1.箭头函数
箭头函数的传参:
如果只传递一个参数,小括号可以省略
如果没有参数或者参数大于1个,小括号不能省略
箭头函数的返回值:
如果函数只有一行代码,则大括号可以不写同时这一行代码运行结果将被直接返回,大括号不写,则不要换行
const fun1 = (a) => a + 1;
console.log(fun1(5));
箭头函数返回对象:
箭头函数省略大括号情况下返回一个对象,需添加一个小括号
const fun1 = () => ({
username: '悟空',
age: 20,
password:'845353935'
});
console.log(fun1());
形参默认值写法:
如果调用函数的时候没有传递参数,就使用默认值参数
如果传递了参数,就会使用传递的参数而不会使用默认值
const func1 = (msg = '大家好') => {
console.log(msg);
};
func1("你好"); // '你好'
func1(); //'大家好'
2.解构
数组解构:注重顺序
const arr = [1, 2, 3, 4];
const [num1, num2] = arr;
console.log(num1, num2);//1 2
对象解构:注重属性名
const obj = {
name: '老王',
age: 18,
skill: '翻墙'
};
const { name, skill } = obj;
console.log(name, skill);//'老王' '翻墙'
交换变量:
let a = 100;
let b = 200;
[a, b] = [b, a];
console.log(a, b);
3.对象的简写
对象属性名和变量名一致时可以简写
对象方法可以省略冒号及function
const username = '悟空';
const skill = '72变';
const obj = {
username, //等价于username:username
skill, //等价于skill:skill
say(){
console.log('耍金箍棒'); // 等价于 say:function(){console.log('耍金箍棒')}
}
};
4.剩余运算符
获取剩余数据:
剩余运算符是一种比较方便我们获取剩余数据的方式
const arr = [1, 2, 3, 4, 5];
const [letter1, letter2, ...list] = arr;
console.log(list);//[3,4,5]
const obj = { a: 1, b: 2, c: 3, d: 4 };
const { a, b, ...obj1 } = obj;
console.log(obj1);//{c:3,d:4}
获取所有参数:
利用剩余运算符获取到所有传递给calc的参数 封装到params数组中
calc(1, 2, 3);
function calc(...params) {
console.log(params); //[1, 2, 3]
}
复制引用类型:
相当于复制了一份引用类型的值 不再是同一个了 变成独立的个体
const obj = { username: '悟空', age: 1080 };
const newObj = { ...obj };
newObj.username = '八戒';
console.log(obj);//{username: '悟空', age: 1080}
console.log(newObj);//{username: '八戒', age: 1080}
const arr = [1, 2, 3, 4];
const newArr = [...arr];
newArr.push(5);
console.log(arr);// [1, 2, 3, 4]
console.log(newArr);// [1, 2, 3, 4, 5]
5.数组方法
map
用于数据的改造
const arr = [1, 2, 3, 4];
const newArr = arr.map(item => item * 2);
console.log(newArr);//[2, 4, 6, 8]
filter
用于数据的查询和删除
可以遍历指定数组,每次遍历给回调函数传入参数,value 及 index
执行回调函数,如果回调函数的返回结果是true,就将元素存储到filter内部数组
最后将内部数组返回
const arr = [1, 2, 3, 4, 5, 6];
const newArr = arr.filter(item => item > 3);
console.log(newArr); //[4,5,6]
forEach
单纯数组遍历
every
检测数组元素的每个元素是否都符合条件 全符合则返回true 否则返回false
对于空数组 会直接返回true 不会去管判断条件
const arr = ['葫芦娃', '狗腿子', '萝卜', '丸子'];
const res = arr.every(item => item.length > 2);
console.log(res); //flase
some
检测数组元素 只要有一个元素满足条件 就返回true
const arr = [
'健康',
'健康',
'健康',
'中招',
'健康',
'健康',
'健康',
'健康',
'健康',
'健康',
];
const result = arr.some((value) => value === '中招');//true
