js Es6新增內容總結

1.模塊化

/*關於模塊化的瞭解 非模塊化有如下缺點: 1.命名衝突 2.文件依賴前端

前端流行的模塊化:AMD requirejsCMD seajs服務器端的模塊化 CommonJS-----Node.jsnode

一個文件即一個模塊模塊的導出 經過exports 和module.exports*/json

var addTwo=function(a,b){ return parseInt(a)+parseInt(b);}/經過exports//exports.addTwo=addTwo;//module.exports/module.exports=addTwo;數組


//引入模塊
var module=require('filePath');
  • 模塊文件的後綴: .js .json .node服務器

    加載優先級(不寫後綴的狀況下).js->.json->.nodeapp

2.ES6

  • 關於聲明變量let和const模塊化


     //1.let聲明的變量不存在預解析
     //2.let聲明的變量不容許重複(在一個塊級做用域內)
     //3.ES6引入了塊級做用域,在塊級做用域中使用let 和const定義的變量,外部不能夠訪問
     //4.const 用來聲明常量,不容許從新賦值,聲明時必須初始化。
  • 解構賦值:函數


    /*變量的結構賦值*/
    //數組的結構賦值
    let [a,b,c,d]=[1,2,3,5];
    console.log(a,b,c,d);
    /*對象的結構賦值*/
    /*let {name,age}={name:'小明',age:20};
    console.log(name,age);*/
    // 對象屬性別名
    let {name:firstName,age}={name:'小明',age:20};
    console.log(firstName,age);
    let {sin,cos}=Math;
    console.log(typeof sin);
     console.log(typeof cos);
     /*字符串的結構賦值*/
     let[h,g,j]='jefiwi';
     console.log(h,g,j);
  • 字符串的相關擴展:requirejs

    1.includes()//判斷字符串是否包含字符串,第一個參數要判斷的字符串,第二個參數從索引爲多少開始。ui

    startsWith() endsWith()

    2.模板字符串:


    let person={
    name:'xiaoming',
    age:18,
    school:'hanzhong'
    }
    let div=`
    <div>
      <span>${person.name}</span>
      <span>${person.age}</span>
      <span>${person.school}</span>
      <span>${1+20}</span>
    </div>`
    console.log(div);
  • 函數擴展:

    1.默認值. 2.參數解構賦值,3.rest參數 4...擴展符.


    //默認值
    function print(a=10,b=2,c=1){
    let result=a+b+c;
    console.log(result);
    }
    print();
    //解構賦值
    function foo({name='小明',age=18}={}){
    console.log(name,age);
    }
    foo();
    foo({name:'小紅',age:20});
    //rest參數
    function restParam(a,b,...param){
    console.log(a);
    console.log(b);
    console.log(param);

    }
    restParam(1,2,3,56,6,9,45,12);
    1
    2
    [ 3, 56, 6, 9, 45, 12 ]
    //...擴展符 在函數調用時將數組轉換爲單個參數。
    function restParam(a,b,c,d,e){
    console.log(a+b+c+d+e);

    }
    let arr=[20,30,45,56,30]
    restParam(...arr);
    //合併數組
    let arr1=[12,5];
    let arr2=[45,89];
    let arr3=[...arr1,...arr2]
  • 箭頭函數:

    let foo=()=>console.log('你好');
    foo();
    //多個參數須要使用()包裹。
    let foo=(a,b)=>{
    let c=10;
    console.log(a+b+c);
    }
    foo(20,30);
    /*做爲匿名函數傳遞*/
    let arr=[20,30,45,56,30];

    arr.forEach((element,index)=>{
    console.log(element);
    })
    //箭頭函數的注意事項:
    1.this取決於函數的定義,而不是調用。
    2.箭頭函數不用new關鍵字
    3.箭頭函數不可使用arguments得到參數列表,可使用rest參數代替
    let foo=(...param)=>{
      console.log(param);
      }
      foo(12,56);

     

  • js中apply的用法。

儘管js的apply方法在日常的使用中並很少見,可是在某些地方使用的仍是頗有幫助性的,這裏就和你們說兩個比較實用的例子: 1.數組最大最小值:var min = Math.min.apply(null, arr);

求數組中的最大最小值,js有相應的方法:Math.min(),Math.max(),可是這兩個方法有個不方便的地方就是其參數不能是數組,而是單個元素值,即(para1,para2,para3....)。因此使用就沒有那麼方便了,可是咱們可使用這個方法:

 2.數組合並。數組的合併也和求最值同樣,咱們可使用簡單的push(para1);進行循環push.但咱們也可使用比較簡單的方法:Array.prototype.push.apply(arrA, arrB); ``//將數組arrB push到數組 arrA中。

  • call和this的使用:

    ECMAScript規範爲全部函數都包含兩個方法(這兩個方法非繼承而來), callapply 。這兩個函數都是在特定的做用域中調用函數,能改變函數的做用域,其實是改變函數體內 this 的值 。

    call 和 apply
    語法 定義 說明
    call(thisObj,Object) 調用一個對象的一個方法,以另外一個對象替換當前對象。 call 方法能夠用來代替另外一個對象調用一個方法。call 方法可將一個函數的對象上下文從初始的上下文改變爲由 thisObj 指定的新對象.若是沒有提供 thisObj 參數,那麼 Global 對象被用做 thisObj
    apply(thisObj,[argArray]) 應用某一對象的一個方法,用另外一個對象替換當前對象。 若是 argArray 不是一個有效的數組或者不是 arguments 對象,那麼將致使一個 TypeError。若是沒有提供 argArray 和 thisObj 任何一個參數,那麼 Global 對象將被用做 thisObj, 而且沒法被傳遞任何參數
  • arguments返回的是一個參數列表對象,使用時相似與數組,但不一樣於數組。

相關文章
相關標籤/搜索