ES7的功能|Es2016的javascript教程

52 阅读3分钟

在这篇博文中,我将结合实例介绍Es7的功能教程。

ECMAScript 2016或ES2016或Es7介绍

在我之前的文章中,发布了很多关于Es6/Es2015功能的文章。Javascript是一种流行的脚本语言,用于构建软件应用。ES7也被称为ECMAScript 2016或ES2016。每一个版本的javascript都引入了很多特性。前一个版本--ES6(ECMAScript 2015)发布了很多功能,包括语言和API的变化。ES7或ECMAScript 2016是一个小版本,只包含两个特性

  • Array.prototype.includes
  • 指数运算符

Array.prototype.includes()方法

Es7在数组对象中引入了includes。includes()方法检查一个元素/对象是否存在于一个元素/对象的数组中。

如果存在,返回真,否则返回假。

includes()方法是对Es7之前代码中indexOf()方法的替代。

语法

Array.prototype.includes(element) :boolean

参数是一个元素 - 要在数组中搜索的元素 返回值 - 返回布尔值true - 元素包含在数组中 包括使用sameValueZero算法检查元素以找到一个元素 包括使用sameValueZero算法检查元素以找到一个元素


var numericArray = [9, 21, 5];
console.log(numericArray.includes(21)); // outputs true
console.log(numericArray.includes(2)); // outputs false

Includes方法类似于ES6或之前版本的indexOf()方法。ES6或Es5 - 使用index()方法检查数组中的元素 在Es6版本的javascript之前,我们使用indexOf()方法来搜索元素 上述相同的代码可以重写如下

var numericArray = [9, 21, 5];
console.log(numericArray.indexOf(21)>=0); // outputs true
console.log(numericArray.indexOf(2)>=0); // outputs false

indexOf()方法用于检查一个数组中的元素。它返回一个匹配的元素在数组中的位置,如果没有找到该元素,则返回-1。开发者必须写一段代码来检查位置以返回一个布尔值。

arr.includes(x)
arr.indexOf(x) >= 0

这两种方法对+0和-0的处理是一样的。

console.log([-0].includes(+0)) // === true)
console.log([+0].includes(-0)) // === true)
console.log([-0].indexOf(+0)>=0) // === true)
console.log([+0].indexOf(-0)>=0) // === true)

Array.prototype.includes和Array.prototype.IndexOf方法之间的区别

两者的目的相同,都是为了在数组中寻找一个元素。includes方法检查未定义和NaN元素,Index方法不检查NaN是在一个全局对象,其值是Not-a-Number。NaN和未定义是javascript中的有效值。

包括和IndexOf

返回布尔值--真或假

返回数字值>=0或-1

正确处理NaN值。它对比较NaN值非常有用

console.log([NaN].includes(NaN))// outputs true

南值处理中的不一致性

console.log([NaN].indexOf(NaN)) // outputs false

未定义值检查返回真,比较工作如预期

console.log( [, , ].includes(undefined)>=0) // === true)

未定义的检查返回假

console.log( [, , , ,].indexOf(undefined)>=0) // === true)

Includes()使开发者在处理数组数据结构中的元素比较时更加容易。

乘法运算符

这个名字本身就说明它是一个处理数学运算的运算符。指数运算将数字乘以指数2或4次方2,即4*4=16。 在Es6和以前的版本中,要进行指数运算,你必须使用Math.pow方法。

Es6和以前版本的指数运算实例

console.log(Math.pow(3,4)) // 81 console.log( Math.pow(5,2)) // 25


Infix运算符示例

在Es7/Es2016中,引入了新的运算符来处理指数运算符 Infix运算符**用于指数运算,同样的语法可以用新的Es7语法重写。

console.log(3**4)) // 81
console.log( 5**2)) // 25

指数运算符赋值示例

这也可以作为赋值表达式使用。下面是一个使用赋值表达式的代码。

let value = 2
value **= 5
console.log(value === Math.pow(2,5)) // true