es6扩展运算符

237 阅读1分钟

Array.find()

find() 方法返回通过测试函数的第一个数组元素的值。

此例查找(返回)第一个大于 18 的元素(的值):

实例

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

Array.findIndex()

findIndex() 方法返回通过测试函数的第一个数组元素的索引。

此例确定大于 18 的第一个元素的索引:

实例

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

扩展运算符(展开语法)

扩展运算符可以将数组或对象转为用逗号分隔的参数序列。

实例

let ary = [1, 2 ,3];
...ary  //1, 2, 3
consloe.log(...ary);   //1 2 3

扩展运算符(展开语法)

扩展运算符可以运用于合并数组

实例

//方法一
let ary1 = [1, 2, 3];
let ary2 = [3, 4 ,5];
let ary3 = [...ary, ...ary2];
//方法二
ary1.push(...ary2);

扩展运算符(展开语法)

将类数组或可遍历对象转换为真正的数组。

实例

let oDivs = document.getElementsByTagName('div');
oDivs = [...oDivs];

构造函数:Arry.from()

将类数组或可遍历对象转换为真正的数组。

实例

let arryLike = {
  '0': 'a',
  '1': 'b',
  '2': 'c',
  length: 3
};
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c'];

includes()

表示某个数组是否包含给定的值,返回布尔值。

实例

[1, 2, 3].includes(2) // true
[1, 2, 3].includes(4) // false

String 的扩展方法

模板字符串

模板字符串中可以解析变量

实例

let name = '张三';
let sayHello = `hello,my name is $(name)`; //hello, my name is zhangsan

String 的扩展方法

模板字符串

模板字符串中可以换行

实例

let result = {

	name: "zhangsan",

	age: 20

    };

       let html = `

   <div>
   
   <span>${result.name}</span>
   <span>${result.age}</span>
  </div> `;
 console.log(html);		

String 的扩展方法

模板字符串

模板字符串中可以调用函数

实例

const fn = () => {
		return '我是fn函数'
		}
	let html = `我是模板字符串 ${fn()}`;
	console.log(html)