目录
一、for...of
1、常用写法
let xxx = ['w','e','b']; for (let val of xxx) { console.log(val); }
运行结果:
2、用于遍历
(1)数组
(2)字符串
(3)元素列表
(4)类数组对象
(5)es6新增Map Set
3、比较
(1)for of:纯数组与类数组集合均可遍历
(2)for in:用于数组与对象,获取的是key
(3)forEach:用于纯数组
二、新增字符串操作:模板字符串
1、就是反引号的用法
2、定义比较长,复杂的字符串
3、可以插入变量
4、可以插入函数
三、函数新特性
1、函数默认值
注:具有默认值的参数要写到后边
2、args参数
(1)function fun(...args){}
(2)可以替代arguments
(3)auguments是也给类数组对象,args是纯数组对象
3、箭头函数
(1)常用写法
let fn=val=>val; //等同于 let fn=function(val){return val;}
(2)要是实现俩个数的和
let sum=(num1,num2)=>num1+num2; console.log(sum(1,5));
运行结果:
(3)若要执行多条语句需要加花括号
(4)作用
<1>简化回调函数的写法 (eg arr.sort((a,b)=>a-b))
<2>箭头函数中的this是函数声明时所在的对象
四、数组新特性
1、扩展运算符
(1)相当于rest方法的逆运算,把数组转换为用逗号隔开的参数列表
function fn(x,y,z){ console.log(x,y,z); } var arr=[1,2,3]; fn(...arr);
运行结果:
(2)应用
<1>复制数组
//复制数组 var arr1 = [1, 2, 3]; var arr2 = [...arr1]; console.log(arr2);
运行结果:
<2>合并数组
//合并数组 var a = [1, 2, 3]; var b = [4, 5, 6]; var c = [7, 8, 9,]; //ES5 var d = a.concat(b, c); //ES6 var e = [...a, ...b, ...c]; console.log(d); console.log(e);
运行结果:
<3>解构赋值
//用于解构赋值 let [a, b, ...args] = [1, 2, 3, 4, 5]; console.log(args);
运行结果:
<4>字符串
//用于字符串 let arr = [..."hellow"] console.log(arr);
运行结果:
<5>适用于所有的类数组集合(实现了遍历器接口的数据类型)
2、Array构造函数新增方法
(1)Array.from():将类数组对象转换为纯数组
// 将类数组对象转换为纯数组 var D = document.getElementsByTagName("div"); var newD = Array.from(D); console.log(D); console.log(newD);
运行结果:
(2)Array.of(a,b,c):
<1>将参数列表返回一个数组
<2>相当于创建数组
<3>Array.of(3) != new Array(3)
3、数组对象新增方法
(1)find(callback):返回数组中第一个满足条件的元素
let arr = [9,16,-9,7,56]; var result = arr.find(function(val,index){ if(val > 10){ return true; } return false })
let arr = [9,16,-9,7,56]; var result = arr.find(function(var,index){ return val > 10 })
let arr = [9, 16, -9, 7, 56]; var result = arr.find(val => val > 10) console.log(result);
运行结果:
(2)findindex(callback):返回数组中第一个满足条件的元素的索引
let arr = [9, 16, -9, 7, 56]; var result = arr.findIndex(val => val > 10) console.log(result);
运行结果:
(3)entries():帮助数组遍历每一个key值与value值
let arr = [9,16,-9,7,56]; for(let [key,value] of arr.entries()){ console.log(key,value); }
运行结果:
(4)keys():帮助数组遍历所有的key值
let arr = [9, 16, -9, 7, 56]; for (let key of arr.keys()) { console.log(key); }
运行结果:
(5)includes():检索数组是否包含某个值,返回布尔值
let arr = [9, 16, -9, 7, 56]; console.log(arr.includes(10));
运行结果:
(6)补充
<1>Array.isArray(arr)
let arr = [9, 16, -9, 7, 56]; console.log(Array.isArray(arr));
运行结果:
注意:返回值为boolean值(true和false)
<2>filter(callback)
1)过滤数组单元,将满足条件的元素过滤
2)callback ==> function(value,index)P{}
3)自动将每一个元素放入callback中进行处理,如果返回值为true,将元素放入新数组中,否则不操作
4)形参value,代表数组中的每一个值
5)形参index,代表数组中每一个值的下标
let arr = [9, 16, -9, 7, 56]; var result = arr.filter(val => val > 10) console.log(result);
运行结果:
<3>map(callback)
1)对数组进行遍历,将计算后的值返回新数组
2)callback同上,不返回bool,返回具体值
let arr = [9, 16, -9, 7, 56]; var result = arr.map(val => val * 10) console.log(result);
运行结果:
<4>some(callback):对数组进行遍历,只要有一个满足条件,则返回true,并终止遍历, 否则返回false
let arr = [9, 16, -9, 7, 56]; var result = arr.some(val => val > 10) console.log(result);
运行结果:
<5>every(callback):对数组进行遍历,如果有一个不满足条件,则返回false,并终止遍 历,否则返回true
let arr = [9, 16, -9, 7, 56]; var result = arr.every(val => val > 10) console.log(result);
运行结果:
<6>forEach(callback)
1)遍历数组
2)无返回值
//val为arr里面的内容,index为内容的索引值 let arr = [9, 16, -9, 7, 56]; arr.forEach((val,index) => { console.log(val,index); })
运行结果:
<7>reduce(callback)
1)累加数组单元
2)preValue:上一个值
3)nowValue:当前值
4)index:当前值下标
5)arrSelf:当前数组
let arr = [9, 16, -9, 7, 56]; var result = arr.reduce((preVal,nowVal) => preVal += nowVal) console.log(result);
运行结果: