JavaScript ES6 新增语法

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));