ES6筆記

let 變量

/**
 * es6 中 let定義的變量無變量提升
 */
function letTest() {
    console.log(foo);
    var foo = 10;
    // undefined

    console.log(foo2);
    let foo2 = 11;
    // ReferenceError
}

/**
 * es6 中let綁定封閉作用域,不能在let申明前賦值
 */
function letTest2() {
    var show = 100;
    if (true){
        show = 200;
        let show;
    }
    // 閉包_立即執行函數.js:58 Uncaught ReferenceError: show is not defined
}

    在代碼塊內，使用let命令聲明變量之前，該變量都是不可用的。這在語法上，稱爲“暫時性死區”（temporal dead zone，簡稱 TDZ）

let 申明的變量 不允許重複申明

/**
 * 哇 想不到不 由於js的變量提升導致打印的是 undefined啊
 * 這是爲啥呢 我湊
 *
 */
function letFun3() {
    var temp = '你是誰';
    function f() {
        console.log(temp);
        if (false){
            console.log('執行了');
            var temp = 'hello';
        }
    }
    f();
    // undefined
}

// 因爲在if內聲明的函數f會被提升到函數頭部
function letFun5_plus() {
    var temp = '你是誰';
    function f() {
        var temp;
        console.log(temp);
        if (false){
            console.log('執行了')
        }
    }
}

let新增了塊級作用域，外層代碼塊不受內層代碼塊的影響，同樣外層作用域無法讀取內層作用域的變量

/**
 * 塊作用域——不會污染全局變量
 *          外層代碼塊不受內層代碼塊的影響
 *          外層作用域無法讀取內層作用域的變量
 */
function letFun4() {
    let  variableA = 10;
    if (true) {
        let variableA = 20;
        console.log('塊內 variableA = ' + variableA);
        // 20
    }
    console.log('塊外 variableA = '+variableA);
    // 10
    
    for (let i=0;i<10;i++){}
    console.log(i);
    // 不會污染全局變量
    // Uncaught ReferenceError: i is not defined
}

// 瀏覽器的 ES6 環境
function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    // 重複聲明一次函數f
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function

// 瀏覽器的 ES6 環境
function f() { console.log('I am outside!'); }
(function () {
  var f = undefined;
  if (false) {
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function

類操作

class Animal {
    name;
    age;

    constructor(name,age){
        this.name = name;
        this.age = age;
    }

    getDes(){
        console.log('name = '+this.name+",age = "+this.age);
    }
}

function client() {
    let  animal = new Animal('猴子',18);
    animal.getDes();
}

// name = 猴子,age = 18