JavaScript ES6

Ano ang ECMAScript 6?

ECMAScript 6 ay tinatawag din na ES6 at ECMAScript 2015.

Mayroon na itong tinatawag na JavaScript 6.

Ang section na ito ay naglalarawan ng ilang bagong katangian ng ES6.

  • JavaScript let
  • JavaScript const
  • Pwersa (**)
  • Default na halaga ng parameter
  • Array.find()
  • Array.findIndex()

Ang pag-suporta ng browser sa ES6 (ECMAScript 2015)

Safari 10 at Edge 14 ang unang browser na ganap na sumusuporta sa ES6:

Chrome 58 Edge 14 Firefox 54 Safari 10 Opera 55
Jan 2017 Aug 2016 Mar 2017 Jul 2016 Aug 2018

JavaScript let

Ang statement na ito ay nagbibigay ang pagkilala ng variable sa block scope.

实例

var x = 10;
// Dito ay 10 ang x
{ 
  let x = 2;
  // Dito ay 2 ang x
}
// Dito ay 10 ang x

亲自试一试

JavaScript const

const Ang statement na ito ay nagbibigay ang pagkilala ng constant (variable na may halaga na konstante sa JavaScript).

Ang constant ay katulad ng let Ang variable, ngunit hindi mababago ang halaga.

实例

var x = 10;
// Dito ay 10 ang x
{ 
  const x = 2;
  // Dito ay 2 ang x
}
// Dito ay 10 ang x

亲自试一试

Mangyaring basahin sa aming JavaScript Let / Const Basa ang mga section na ito para sa let At const Ang nilalaman nito.

Pwersang operator

Ang operator ng pwersa (**Magtaas ng unang operand sa pwersa ng ikalawang operand.

实例

var x = 5;
var z = x ** 2;          // Ang resulta ay 25

亲自试一试

x ** y Ang resulta ay Math.pow(x,y) Apat na:

实例

var x = 5;
var z = Math.pow(x,2);   // Ang resulta ay 25

亲自试一试

Default na halaga ng parameter

ES6 Pinahihintulutan ang mga parameter ng function na may default na halaga.

实例

function myFunction(x, y = 10) {
  // y ay 10 kung hindi naipasa o undefined
  return x + y;
}
myFunction(5); // Ay magbibigay ng 15

亲自试一试

Array.find()

find() Mga method ay nagbibigay ng halaga ng unang elemento ng array na napagdaanan ng test function.

Ang halimbawa na ito ay naghahanap (nagbibigay) ng pinakaunang elemento (halaga) na mas malaki sa 18:

实例

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

亲自试一试

Paging ang function na ito ay tumatanggap ng tatlong argumento:

  • Halaga ng item
  • Index ng item
  • Ang array mismo

Array.findIndex()

findIndex() Mga method ay nagbibigay ng index ng unang elemento ng array na napagdaanan ng test function.

Ang halimbawa na ito ay nagtutukoy sa index ng unang elemento na mas malaki sa 18:

实例

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

亲自试一试

Paging ang function na ito ay tumatanggap ng tatlong argumento:

  • Halaga ng item
  • Index ng item
  • Ang array mismo

Bagong katangian ng bilang

ES6 ay nagdagdag ng sumusunod na katangian sa objekto ng Number:

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

实例

var x = Number.EPSILON;

亲自试一试

实例

var x = Number.MIN_SAFE_INTEGER;

亲自试一试

实例

var x = Number.MAX_SAFE_INTEGER;

亲自试一试

Bagong metoda ng bilang

ES6 ay nagdagdag ng 2 bagong metoda sa objekto ng Number:

  • Number.isInteger()
  • Number.isSafeInteger()

Metodong Number.isInteger()

Kung ang argumento ay integer, Number.isInteger() 方法返回 true。

实例

Number.isInteger(10);        // Nagbabalik true
Number.isInteger(10.5);      // Nagbabalik false

亲自试一试

Metodong Number.isSafeInteger()

Ang ligtas na bilang ay ang mga integer na maaaring maipakilala nang eksaktong bilang na double precision.

Kung ang argumento ay ligtas na bilang, Number.isSafeInteger() 方法返回 true。

实例

Number.isSafeInteger(10);    // Nagbabalik true
Number.isSafeInteger(12345678901234567890);  // Nagbabalik false

亲自试一试

Ang ligtas na bilang ay ang lahat ng integer mula sa -(253 - 1) hanggang +(253 - 1).

Ito ay ligtas: 9007199254740991. Ito ay hindi ligtas: 9007199254740992.

Bagong pangkalahatang metoda

ES6 ay nagdagdag ng 2 bagong pangkalahatang global na metoda ng bilang:

  • isFinite()
  • isNaN()

Metodong isFinite()

Kung ang argumento ay Infinity O NaN，则全局 isFinite() Ang metoda ay nagbabalik false.

Kung hindi, nagbabalik true:

实例

isFinite(10/0);       // Nagbabalik false
isFinite(10/1);       // Nagbabalik true

亲自试一试

Metodong isNaN()

如果参数是 NaN，则全局 isNaN() 方法返回 true。否则返回 false：

实例

isNaN("Hello");       // 返回 true

亲自试一试

箭头函数（Arrow Function）

箭头函数允许使用简短的语法来编写函数表达式。

您不需要 function 关键字、return 关键字以及花括号。

实例

// ES5
var x = function(x, y) {
   return x * y;
}
// ES6
const x = (x, y) => x * y;

亲自试一试

箭头功能没有自己的 this。它们不适合定义对象方法。

箭头功能未被提升。它们必须在使用前进行定义。

使用 const 比使用 var 更安全，因为函数表达式始终是常量值。

如果函数是单个语句，则只能省略 return 关键字和花括号。因此，保留它们可能是一个好习惯：

实例

const x = (x, y) => { return x * y };

亲自试一试