ES6實用的技術

一、const 定義常量

ES6之前并沒有定義聲明常量的方式,ES6標準中引入了新的關鍵字const來定義常量。

const a=123;
a=456;  //會報錯,常量無法覆蓋
console.log(a);

二、let塊級變量

用let定義的變量只在塊當中起作用,離開變量外界的塊(括號)就會被銷毀。

if(true){
    var a=123;
    let b=456
}
console.log(a);
console.log(b); //報錯,訪問不到變量
let a = 123;
let a = 456;
console.log(a)
//Identifier 'a' has already been declared

三、模板字面量

用于字符串拼接和寫模板,使用 ` (反引號,左上角波浪線),變量使用${}

var user="張三";
var age =22;
var sex ="男";
console.log(`大家好,我的名字是"${user}",今年${age}歲,我是${sex}生`);
console.log("大家好,我的名字是"+user+",今年"+age+"歲,我是"+sex+"生");//傳統(tǒng)的寫法

四、解構賦值

交換值

var a=1;
var b=2;
[a,b]=[b,a];
console.log(a,b);  // 2 1

從數組里獲得元素

var array=[1,2,3,4];
var [a, ,b]=array;
console.log(a,b);  // 1 3

從對象中獲取值

var obj={user:"張三",age:"22歲",sex:"男",job:"前端開發(fā)"}
var {user,job}=obj;
console.log(user,job)

返回值解構

function arr(){
    var a=1,b=2,c=3,d=4;
    return {a,b,c,d}
 }
 var {a,c}=arr();
 console.log(a,c);   // 1 3

五、箭頭函數

箭頭函數相當于匿名函數,并且簡化了函數定義。()中放參數,沒有參數就省略,箭頭后面是函數體。

var fun=(x,y)=>{
    console.log(x+y);
}
fun(2,3)

ES6之前訪問函數外面的this比較麻煩,箭頭函數可以直接訪問到最外出的this,不需要轉換

六、對象中函數的聲明

var obj={
    user:"張三",
    job(){
        return "web前端開發(fā)"
    }
    /*  js寫法
        job: function(){}
    */
}
console.log(obj.job())

七、for-of循環(huán)遍歷

var arr=["aaaa","bbbb","cccc","ddddd"];
for(var i of obj){
    console.log(i)
}

八、默認參數

function fun(x=0,y=2,z=true){
    console.log(x,y,z);
}         
fun();  // 0 2 true
fun(4,0,false); // 4 0 false

九、展開運算符 ...

arr1=[1,2,3,4,5];
arr2=["a","b","c","d"];
arr3=arr1.concat(arr2);
arr4=[...arr1,...arr2];

console.log( arr3 );   //[1, 2, 3, 4, 5, "a", "b", "c", "d"]
console.log( arr4 );   //[1, 2, 3, 4, 5, "a", "b", "c", "d"]
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內容