JavaScript(ES6版本)語法基礎(chǔ)

在學(xué)習(xí)react過程中,發(fā)現(xiàn)自己js的基礎(chǔ)還很薄弱,一些ES6版本里常見的內(nèi)容在這里做下總結(jié)。

一,var let 和 const

let,var,const的區(qū)別:
http://www.itdecent.cn/p/9f7f053f7204
https://baijiahao.baidu.com/s?id=1621787284851612777&wfr=spider&for=pc

二,解構(gòu)賦值

數(shù)組解構(gòu)賦值,對象解構(gòu)賦值

{
    let a,b,rest;
    [a,b]=[1,2];  //數(shù)組解構(gòu)賦值
   // let a=1,b=2; 之前的方法
    console.log(a,b);
}

{
    let a,b,rest;
    [a,b,...rest]=[1,2,3,4,5,6];
    console.log(a,b,rest);
}

{
    let a,b;
    ({a,b}={a:1,b:2});   //對象解構(gòu)賦值
    console.log(a,b);

}
//對象解構(gòu)賦值
{
    let o={p:42,q:true};
    let {p,q}=o;
    console.log(p,q);
}

//對象解構(gòu)賦值,默認(rèn)值的處理
{
    let {a=10,b=5}={a:3};

    console.log(a,b);
}

{
    let a,b,c,rest;
    [a,b,c=3]=[1,2];  //數(shù)組解構(gòu)賦值,給3一個(gè)默認(rèn)值
    // [a,b,c]=[1,2];  如果沒能配對,會出現(xiàn)未定義
    console.log(a,b,c);
}

數(shù)組解構(gòu)賦值應(yīng)用場景

1.取函數(shù)的返回值

{
    function f() {
        return [1,2];
    }

    let a,b;
    [a,b]=f();
    console.log(a,b);
}

2.變量交換

{
    let a=1;
    let b=2;
    [a,b]=[b,a];

    console.log(a,b);
}

3.接受函數(shù)返回值,可選擇

{
    function f1() {
        return[1,2,3,4,5];
    }
    let a,b,c;
    [a,,,b]=f1();

    console.log(a,b); //返回的是多個(gè)值,可以只關(guān)心自己想要的
}

4.如果不確定長度,接受多個(gè)值

{
    function f1() {
        return[1,2,3,4,5];
    }
    let a,b,c;
    [a,...b]=f1();

    console.log(a,b);
}

對象解構(gòu)賦值應(yīng)用場景

取json對象的某些值

{
    let Data={
        title:'abc',
        test:[{
            title:'test',
            desc:'description'
        }]
    }
    let {title:a,test:[{title:b}] }=Data;
    console.log(a,b);
}

三,函數(shù)相關(guān)

參數(shù)默認(rèn)值

{
    function test(x,y='world') {
        console.log(x,y);
    }
    test('hello');
}

作用域
以函數(shù)內(nèi)部參數(shù)的優(yōu)先

{
    let x='test';
    function f(x,y=x) {
        console.log(x,y);//輸出的是 kill kill
    }
    f('kill');
}

{
    let x='test';

    function f(c,y=x) {
        console.log(c,y);  //輸出的是 kill test
    }
    f('kill');

}

rest參數(shù)

{
    function  test3(...arg) {
        for(let v of arg){
            console.log('rest',v);
        }
    }
    test3(1,2,3,'a','b','c');

}

箭頭函數(shù)

{
    let arrow =  v => v*2; //arrow是函數(shù)名,v是參數(shù),v*2是返回值
    console.log(arrow(3));
    let arrow2 =  () => 5;
    console.log(arrow2());
}

this綁定
尾調(diào)用

四,模塊化

import 引入模塊
export 導(dǎo)出模塊

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容