前端拾遺--javascript-ES6基礎

西南_張家輝發表於2020-03-14

箭頭函式和普通函式的區別

  • 箭頭函式是匿名函式,不能作為建構函式,不能使用new

  • 箭頭函式不繫結arguments,取而代之用rest引數 (...rest)

  • 箭頭函式不繫結this,會捕獲其所在的上下文的this值,作為自己的this值.其中需要注意的是: 箭頭函式的 this 永遠指向其上下文的 this ,任何方法都改變不了其指向,如 call() , bind() , apply()

var obj = {
  a: 10,
  b: () => {
    console.log(this.a); // undefined
    console.log(this); // Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …}
  },
  c: function() {
    console.log(this.a); // 10
    console.log(this); // {a: 10, b: ƒ, c: ƒ}
  }
}
obj.b();  // window
obj.c();  // 10

複製程式碼
  • 箭頭函式沒有原型屬性
var a = ()=>{
  return 1;
}

function b(){
  return 2;
}

console.log(a.prototype);  // undefined
console.log(b.prototype);   // {constructor: ƒ}
複製程式碼

談談var,let,const 的使用和區別

  • 1、在 ES6之前,ES5中js只有全域性作用域和函式作用域,let ==增加了塊級作用域==
if(true) {
   let a = 'name'
}
console.log('a',a) // a is not defined
複製程式碼
  • 2、let 限制了變數提升(JavaScript 中函式和變數都會提升,==函式的提升優先順序大於變數的提升==,所以下面會先列印函式)

變數提升指的是變數宣告的提升,不會提升變數的初始化和賦值。

function fn() {
    console.log('a', a);
    var a = 1;
    function a () {
        console.log('I am a function');
    }
}
fn() // ƒ a () {console.log('I am a function');}
複製程式碼

使用 let 的時候

function fn1() {
    console.log('a', a);
    let a = 1;
    function a () {
        console.log('I am a function');
    }
}
fn1();
VM1868:4 Uncaught SyntaxError: Identifier 'a' has already been declared
複製程式碼
  • 3、使用 var 可以重複宣告變數,但是 ==let 不允許在同一塊作用域內重複宣告同一個變數==, 和 const 不能重複命名

  • 4、==let 不允許設定全域性變數==,var 可以

const

不能修改值,const 宣告的變數必須經過初始化。

以上 let 的規則同樣適用於 const,但是跟 let 的區別是 const 宣告的變數不能重新賦值,所以 const 宣告的變數必須經過初始化。

參考

相關文章