微语:代码适合中午敲,早晚出BUG
检测类型-isArray JavaScript
// isArray判断是否为数组
let arr = [1, 2, 3, 4, 5]
let arr1 = {
name: "张三"
}
console.log(Array.isArray(arr)); //判断arr是否为数组,返回值:true
console.log(Array.isArray(arr1));//判断arr1是否为数组,返回值false
类型检测-instanceof JavaScript
let arr = [1, 2, 3, 4]
// 判断arr是否属于某个类
console.log(arr instanceof Array);//判断是否属于数组类 返回值:true
console.log(arr instanceof Object);//判断是否属于引用类 返回值: true
let obj = {}
console.log(obj instanceof Array);//判断是否为数组类 返回值:false
console.log(obj instanceof Object);//判断是否为引用类 返回值:true
//检测构造函数
function Person(color, like) {
this.color = color;
this.link = like;
}
let p1 = new Person("#ff0000", "旅游")
console.log(p1 instanceof Person); //判断p1是否属于Person类 返回值:true
console.log(p1 instanceof Function); //判断p1是否属于Function类 返回值:false
深拷贝 JavaScript
// 浅拷贝存在的问题:浅拷贝只能拷贝一层数据。
let obj1 = {
name: "小白",
color: "#ff0000",
like: ["爬山", "旅游"]
}
let obj2 = {}
for (let key in obj1) {
obj2[key] = obj1[key]
}
// 修改拷贝后的boj2里面值
obj2.like[0] = "赏花 "
// 发现修改之后会影响到boj1,所以没有拷贝成功
console.log(obj1);
console.log(obj2);
// 解决办法:遍历数组或对象的所有子数据,每一层都单独拷贝
let obj3 = JSON.parse(JSON.stringify(obj1))
obj3.like[0] = "钓鱼"
// 这里修改之后,发现并没有影响到obj1和obj2的数据,说明拷贝成功了
console.log(obj3);
变量的拷贝 JavaScript
// 引用类型的拷贝
let obj1 = {
name: "小红",
age: 18,
sex: "女",
}
let obj2 = obj1;
console.log(obj1);
console.log(obj2);
/*
| 执行流程 |
1).定义了一个obj1对象
2).定义了一个obj2,吧obj1的值赋值给obj2(这里赋值的是obj1的地址,由于obj1是一个对象,也就是引用型数据,会存放到堆中,栈区存放的是堆中数据的地址,由栈区的地址,找到堆中的实体)
3).执行console.log() 分别打印obj1,obj2
执行结果:{name: '小红', age: 18, sex: '女'}
注:此处拷贝的只是一个地址,不是一个全新的实体,指向的还是同一个实体。
*/
基本类型和引用类型 JavaScript
// 基本数据类型(存放在栈里面)
let a1 = 50;
let b1 = a1;
a1 = 40;
console.log("a1=", a1, "b1=", b1);
/* | 执行流程 |
1).定义变量a1赋值50
2).定义变量b1 把a1的50赋值给b1,此时b1=50;
3).对a1重新赋值,此时a1为40
4).执行 console.log();
结果为:a1= 40 ,b1= 50
*/
//引用类型:存储在堆里面
let c1 = [1, 2, 3, 4];
let d1 = c1;
c1[0] = 10; //修改数组C1下标0的值为10
console.log(c1);
console.log(d1);
/*
| 执行流程 |
1).定义一个数组为c1 传入数组元素[1, 2, 3, 4]
2).把数组C1的值赋值给d1(由于是引用类型,这里的赋值指的是地址(实体存在堆里面,栈里面存放的是一个地址,指向堆中的实体))
3).对数组c1的下标为0的元素进行元素修改为 10
4).执行 console.log()打印c1和c2;
结果为:C1=[10, 2, 3, 4] ,b1=[10, 2, 3, 4]
注:这里虽然修改了c1下标为0的数组元素,但是由于c1赋值给d1的值是地址,所以他们始终指向的是同一个实体,这里对c1的元素进行了修改,所以d1也一样会发生改变。
*/
IIFE JavaScript
在ES5中为了避免全局污染所用的手法。
(function () {
var sum = 0;
for (var i = 0; i <= 100; i++) {
sum += i;
}
console.log(sum);
})();
例如封装一个函数求N个数相加之和 JavaScript
方法一:arguments方法【伪数组】
function add() {
let sum = 0;
for (i = 0; i < arguments.length; i++) {
sum += arguments[i];
}
return sum;
}
方法二:rest参数【真数组】
function add(...arr) {
let sum = 0;
arr.forEach(v => {
sum += v;
})
return sum;
}
调用函数
console.log(add(1, 5, 3, 4));
console.log(add(1, 8, 3, 4, 21));
console.log(add(1, 25, 6));
Js箭头函数 JavaScript
ES5
let show = function () {
console.log("show");
}
show()
ES6箭头函数
let show = () => {
console.log("show");
}
show()
当形式参数只有一个的时候,可以省略()
let arr = [1, 2, 3]
arr.forEach(v => {
console.log(v);
})
当代码只有一句话的时候,可以省略{},自动返回,return可以不写
let arr2 = arr.map(v => v + 10)
console.log(arr2);