簡單瞭解ES6(一)

ES6聲明變量的六種方式:let、const(變量爲只讀常量,一旦聲明,不能修改)、class、import、var、function    ——   其中var、function是ES5聲明變量的方式(全局)

簡單說明ES6的變量:

1.在所在的區域塊內纔有效

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

------------------------------------------

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6


2.不存在變量提升

console.log(foo);
var foo = 2; //2

----------------------------------------

console.log(foo);
let foo = 3; //報錯


3.暫時性死區

if (true) {
  // TDZ開始
  tmp = 'abc'; // ReferenceError
  console.log(tmp); // ReferenceError

  let tmp; // TDZ結束
  console.log(tmp); // undefined

  tmp = 123;
  console.log(tmp); // 123
}

其中typeof也不是百分之百安全的操作:  typeof x; //報錯   let x;  因爲x使用let聲明,在聲明之前都是x的“死區”


4.不允許重複聲明變量與參數

function func(arg) {
  let arg;
}
func() // 報錯

function func(arg) {
  {
    let arg;
  }
}
func() // 不報錯

------------------------------------------

// 報錯
function func() {
  let a = 10;
  var a = 1;
}

// 報錯
function func() {
  let a = 10;
  let a = 1;
}

 瞭解一下塊級作用域與函數聲明

ES5規定:函數只能在頂層作用域與函數作用於之中聲明,不能再塊級作用域聲明。

// 情況一
if (true) {
  function f() {}
}

// 情況二
try {
  function f() {}
} catch(e) {
  // ...
}

ES6規定:塊級作用域中,函數聲明語句作用類似於let,在塊級作用於之外不做引用。

function f() { console.log('I am outside!'); }
(function () {
  var f = undefined;
  if (false) {
    function f() { console.log('I am inside!'); }
  }

  f();
}());


理論上會返回“I am inside!”,但是在ES6的瀏覽器報錯。因爲環境差異太大,應該避免在塊級作用域內聲明函數,如果確實需要,可以將函數修改爲函數表達式,例如:

// 塊級作用域內部的函數聲明語句,建議不要使用
{
  let a = 'secret';
  function f() {
    return a;
  }
}

// 塊級作用域內部,優先使用函數表達式
{
  let a = 'secret';
  let f = function () {
    return a;
  };
}

 

this對象

全局環境:this => 頂層對象

Node模塊和ES6模塊:this => 當前模塊

任何環境:globalThis => 頂層對象

 

發佈了45 篇原創文章 · 獲贊 10 · 訪問量 4萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章