ES6 变量、箭头函数、参数扩展、数组方法、字符串、JSON、结构赋值随笔
1.变量(之前的变量var能重复声明、无法限制修改、没有块级作用域是函数级作用域,所以新增了两个变量 let、const):
1.1:let 不能重复声明,变量(可以修改),块级作用域
1.2: const 不能重复声明,常量(不能修改),块级作用域
2.箭头函数:
2.1:可以将function省略不写,在()后面换成 =>
2.2::如果()只有一个参数,()也可以省略不写
2.3:如果{ }里只有一个return操作,{ }和return都可以省略不写
// 演示1: // var $ = function(id){ return document.getElementById(id) } var $ = id => document.getElementById(id) $('tsDiv').style.color = 'red' // 演示2: // function aa(a){ console.log(a) } var aa = (a)=> console.log(a) aa(555)
3.参数扩展:
3.1:...收集:
function show(a, b, ...c){
alert(a); //1
alert(b); //6
alert(c); //4,12,22,38,12
}
show(1,6,4,12,22,38,12);
3.2: ...扩展:
let arr = [22,9,28]
let arr2 = [...arr]; //22,9,28
let arr3 = [...arr, ...arr]; //22,9,28,22,9,28
3.3:默认参数:
function show(a, b=5){}
4.数组方法:
4.1: map(映射 -- 一个对一个):
let arr = [9, 11, 16];
let arr1 = arr.map(function (item) {
return item
});
alert(arr1); // 9, 11, 16 (item形参就是数组arr里的所有项)
简写:let arr1 = arr.map(item=>item);
应用:let arr1 = arr.map(item=>item>=10?'及格':'不及格');//不及格,及格,及格
4.2:reduce (汇总 -- 一推出来一个) :
let arr = [1,2,3]; //求和
let arr1 = arr.reduce(function(tmp, item, index){
return tmp+item;
});
alert(arr1); //6 (tmp是上一次运算的中间结果,最后一次为最终结果,item是下一项,index是索引)
let arr = [1,2,3]; //求平均数
let arr1 = arr.reduce(function(tmp,item,index){
if(index != arr.length-1){ //不是最后一次
return tmp+item
}else{ //最后一次
return(tmp+item)/arr.legth;
}
});
alert(arr1); //3
4.3:filter(过滤器):
let arr = [12,5,6,8,79,56]
let arr1 = arr.filter(function(item){
if(item%3==0){
return true; //能被3整除的留下
}else{
return false; //否则消失
}
});
alert(arr1);
简写: let arr1 = arr.filter(item=>item%3==0) //都是true和true或false和false没必要都写
4.4:forEach(循环、迭代):
let arr = [1,2,3]
arr.forEach(function(item,index){
alert(index+ ' : ' +item); //依次出现0:1/1:2/2:3
});
5.字符串:
5.1:多了两个新方法(startSwitch / endSwitch):
let str = 'abcde'; alert(str.startSwith('a')); //true (判断是否以a开头)
let str = 'abcde'; alert(str.endSwith('a')); //false (判断是否以a结尾)
5.2:字符串模板(支持换行):
let a = 12; let a1 = `a${a}bc`; aleart(a1); //a12bc(${}可把变量直接塞进去) 例子: let title = '标题'; let comtent = '内容'; let arr = `<div> <h1>${title}</h1> <p>${content}</p> </div>`;
6.JSON(json标准写法:所有key和value需用双引号包住,value是数字除外):
6.1:JSON对象:
JSON.stringify() // 转为json
JSON.parse() //解析json为object
6.2:JSON简写:
json对象里key和value值一样留一个即可
json对象里有方法 : function 都可以省略不写 // 如:show: function(){} 省略为 show(){}
7.结构赋值:
例子:
let [a, b, c] = [1,2,3]; console.log(a,b,c); // 1 2 3
let {a, b, c} = {a:1, b:2, c:3}; console.log(a, b, c); //1 2 3
let [ { a1, a2 }, [b1, b2, b3], c, d] = [ { a1:1, a2:2 }, [3, 4,5], 6, 'abcd' ]
console.log(a1, a2, b1, b2, b3, c, d) // 1 2 3 4 5 6 "abcd"
注意:
左右两边结构必须一样// 错误示范:let [a,b]={a:1,b:2}
右边必须是个合法格式的东西// 错误示范:let {a,b}={1,2}
声明赋值不能分开// 错误示范:let[a,b]; [a,b]=[1,2]
8
本文来自博客园,作者:封兴旺,转载请注明原文链接:https://www.cnblogs.com/fxw1/p/14075349.html