JavaScript ES6 新增语法_xihuanLilia

大大的周 02-07 2931

ES6中新增的语法扩展运算符利用扩展运算符来合并数组方法1方法2 将类数组或可遍历对象转换为真正的数组 Array.from()find()findIndex()数据扁平化includes()遍历对象startsWith() 和 endsWith()repeat（）

扩展运算符

扩展运算符又被称为展开语法扩展运算符可以将数组或者对象转化为用逗号隔开的参数序列如下

let arr = ['a','b','c'] console.log(...arr);

利用扩展运算符来合并数组方法1 let arr1 = [1, 2, 3]; let arr2 = [4, 5, 6]; let arr3 = [...arr1,...arr2] console.log(arr3); 方法2 let arr1 = [1, 2, 3]; let arr2 = [4, 5, 6]; arr1.push(...arr2); console.log(arr1); 将类数组或可遍历对象转换为真正的数组 var divs = document.getElementsByTagName('div'); let arr = [...divs] console.log(arr); Array.from()

Array.from()方法可以将伪数组或可遍历的对象转换为真数组

var arrayLike = { "0": "1" , "1": "2", "length": 2 } let newArr = Array.from(arrayLike); console.log(newArr); let newArr1 = Array.from(arrayLike,ele => ele*3) console.log(newArr1);

方法还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组

find()

用于找出第一个符合条件的数组成员，如果没有找到返回undefined

var ary = [{ id: 1, name: '张三' }, { id: 2, name: '李四' }]; let target = ary.find(item => item.id == 1); console.log(target)// 返回张三的对象 findIndex()

用于找出第一个符合条件的数组成员的位置，如果没有找到返回-1

let ary = [10, 20, 50]; let index = ary.findIndex(item => item > 25); console.log(index) 数据扁平化

flat()

// let arr1 = [1,2,[4,[555,[[[[[5]]]]]],5]] // console.log(arr1.flat()); // console.log(arr1.flat(Infinity));

includes()

判断某个数组是否包含给定的值，返回布尔值。

遍历对象 // let obj ={ // a:1, // b:2, // c:3 // } // console.log( Object.keys(obj) ); 属性名 // console.log( Object.values(obj) ); 属性值 // console.log( Object.entries(obj) ); 以数组的方式属性名加属性值

startsWith() 和 endsWith()

startsWith()：表示参数字符串是否在原字符串的头部，返回布尔值 endsWith()：表示参数字符串是否在原字符串的尾部，返回布尔值

repeat（）

repeat方法表示将原字符串重复n次，返回一个新字符串

let str2 = '8848' console.log(str2.repeat(5));