javascript ES五、ES6的一些知識

ES6

標籤(空格分隔): ES6es6


嚴格模式 "use strict"

注意:嚴格模式也有做用域,若是在某個函數內部聲明的話,只在該函數內部有做用
1) 嚴格模式下全局變量聲明必須用 var,不然會報錯; var a = 10;
    
    2)嚴格模式下函數直接調用時,內部的this指向 undefined(非嚴格模式時,指向window);
 
    function fn(){
        console.log(this);
    }
    fn(); //打印 undefined
    
    3) 嚴格模式下 delete 不能刪除全局變量,會報錯;
    
    4) 嚴格模式下,函數參數不能重名;
    
    5)嚴格模式下,arguments設置爲關鍵字,不能賦值,不追蹤形參值的變化,只儲存實參的集合;

    funtion fn1(a,b){ 
        a = 10; //修改不起做用
        console.log(a,b);
    }
    fn1(1,2); // 打印 [1,2]
    
    6)函數必須聲明在頂層,或者函數內部,不能在邏輯語句中聲明;
    
    7)函數表達式中聲明一個有名函數的話,函數名會做爲局部變量,只能在函數內部使用;
    
    var a = function fn2(){
        console.log(  fn2 );
    }
    a();    // 打印 整個函數
    
    console.log( fn2 ); //會報錯 ( fn2 is not defined)

es6新語法數組

let數據結構

let 聲明變量函數

1. let 聲明的變量在預解析的時候不會提早;
2. 
2. let 聲明的變量不會掛載再window上;
3. 
3.let 聲明得變量只能在當前做用域中使用; 例如for循環中用let 聲明 i 再for循環外面,不能使用 i;
4. 用 let 聲明變量,在當前塊級做用域中 , 名字不能重複;
  • 暫存死區
    從塊的開始到聲明這段的區域this

  • 什麼是塊級做用域
    一對{}包括的區域稱爲代碼塊;
    塊級做用域指一個變量或者函數只在該區域才起做用。rest

  • 如何造成塊級做用域 使用let關鍵字在代碼塊中聲明的變量,只能在該代碼塊及子級做用域起做用code

const 聲明常量 常量的值不能夠修改,行業慣例常量名全大寫;對象

const A = 10;
    A = 20;  // 會報錯;

什麼是解構賦值接口

ES6容許按照必定模式,從數組和對象中提取值,對變量進行賦值,這被稱爲解構(Destructuring)。

數組的解構賦值語法
    var [a, b, c] = [1, 2, 3];  
                    
對象的解構賦值語法
    var { foo, bar } = { foo: "aaa", bar: "bbb" };
    
解構賦值時能夠夠變量賦默認值
    var [a=0, b=0, c=0] = [1, 2];   
    console.log(a,b,c) //打印 1,2,0

解構賦值的做用
   函數只能返回一個值,若是要返回多個值,只能將它們放在數組或對象裏返回。有了解構賦值,取出這些值就很是方便。
   funtion fn(){
    
   return [1,2,3];
   }
   var [a,b,c] = fn();
   
   console.log(a,b,c);  // 1,2,3

Number 方法擴展作用域

Number.isNaN( XXX ); 檢測傳入的參數是不是NaN
Number.isFinite( n )用來檢查一個數值(n)是否爲有限的(finite);
例子:
Number.isFinite(NaN)  // false
Number.isFinite(1/3)  // true 無線小數也被斷定爲有限的
Number.isFinite(Infinity) // false

Math

Math.sign()  // 去除小數,取整數

Math.sign方法用來判斷一個數究竟是正數、負數、仍是零。
它會返回五種值:
    參數爲正數,返回+1;
    參數爲負數,返回-1;
    參數爲0,返回0;
    參數爲-0,返回-0;
    其餘值,返回NaN。
    
Math.cbrt() // 求立方根

Math.cbrt(8) // 2

for of(便利線性集合(有序集合)的 value 值

遍歷數組:
var arr = [1,2,3]
for (let value of arr){
    console.log(value) // 1,2,3
}

for of 直接便利對象會報錯,由於對像沒有遍歷器接口(對象是非線性的集合沒有順序);

Object.assign 合併對象

var obj = {a:1,b:2};
    var obj2 = {c:3};;

    console.log( Object.assign(obj,obj2) )  // {a:1,b:2,C:3}
    
    console.log( obj )  // {a:1,b:2,C:3}

函數參數的默認值:

function fn(x,y=3){
    console.log( y );
    return x + y;
}
fn(1,2)  //打印 2
fn(1)   //打印默認值3

rest形式的參數:

函數有多個參數時,爲了方便接收能夠用...arg (arg是一個變量) 來儲存形參到數組中
function fn2(...arg){
    console.log( arg );

}
fn2(1,2,3);  打印 //[1,2,3]

function fn3(a,...arg){

    console.log( arg );
}
fn3(1,4,5,6)  打印 //[4,5,6]

注意:arg必須是最後一個參數,後面不能夠再寫參數,會報錯

(...arr)擴展運算符

把數組的每一項用逗號分割成一個參數序列;
var arr = [1,2,3,4];
console.log(...arr);  打印 //  1 2 3 4

function fn(...a){
    console.log(a);
}
fn(...arr); // 打印結果[1,2,3,4] (...arr 把數組的每一項都轉成參數傳入函數, ...a 又把參數儲存到數組中 )

箭頭函數()=》{}

箭頭函數注意事項:
    1.箭頭函數不能做爲構造函數;
    2. 箭頭函數中不能使用 arguments能夠用rest方式接收參數(...arg);
    3.箭頭函數中的this 指向定義函數時的做用域中的this;
    
var a = ()=>{
    console.log(1);
}
a();  // 打印 1

----------

var x = 2;
document.onclick = function(){
    this.x = 1;
    let a = ()=>{
        console.log(this.x);
    }
    a();
}
點擊document的時候,打印 1 ;

(Set 和 Map )
Set 和 Map是數據結構,就像似數組和對象,的用來儲存數據的倉庫;
Set 相似數組,可是成員的值都是惟一的,沒有重複的值。

Set([array])
ES6提供了新的數據結構Set。它相似於數組,可是成員的值都是惟一的,沒有重複的值。

Set是一個構造函數,能夠傳入一個數組初始化默認值。

Set的一些方法
set.size
Set實例的成員個數(數組的長度)
set.add(value)
爲Set的實例添加值
set.delete(value)
刪除Set實例的值
set.has(value)
判斷傳入的參數是否爲set的成員
set.clear()
清除set中全部成員

用Set和擴展用算符實現合併數組而且去重

var arr1 = [1,2,3];
var arr2 = [3,4,6];

[...arr1,...arr2] //利用擴展用算符展開到一個數組中;

new Set([...arr1,...arr2])  //set去重

var arr = [ ...new Set([...arr1,...arr2]) ]  //再展開到新數組

Map
ES6提供了map數據結構。它相似於對象,也是鍵值對的集合,可是「鍵」的範圍不限於字符串,各類類型的值(包括對象)均可以看成鍵。

Map也能夠接受一個數組做爲參數。該數組的成員是一個個表示鍵值對的數組

map.get(key) //經過key獲取value

map.set(key,value) //爲Map的實例添加新鍵值對

map.has(key) // 查找key值是否存在。

map.delete(key) //刪除對應鍵值對 map.clear()

相關文章
相關標籤/搜索