国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

[ ES6 ] 快速掌握常用 ES6 （二）

hidogs / 2278人閱讀

摘要：本系列文章適合快速掌握入門語法，想深入學(xué)習(xí)的小伙伴可以看看阮一峰老師的入門本篇文章是對之前文章的一個補充，可以使代碼更簡潔函數(shù)參數(shù)默認(rèn)值在傳統(tǒng)語法中如果想設(shè)置函數(shù)默認(rèn)值一般我們采用判斷的形式在新的語法中我們可以在參數(shù)聲明的同時賦予默認(rèn)值參數(shù)

本系列文章適合快速掌握 ES6 入門語法，想深入學(xué)習(xí) ES6 的小伙伴可以看看阮一峰老師的《ECMAScript 6 入門》
本篇文章是對之前文章的一個補充，可以使 JavaScript 代碼更簡潔

函數(shù)

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

在 JavaScript 傳統(tǒng)語法中如果想設(shè)置函數(shù)默認(rèn)值一般我們采用判斷的形式

function example (a,b,c) {
    a = a||"string";
    b = b||"number";
    c = c||"json";
    console.log(a);
    console.log(b);
    console.log(c); // "string" "number" "json"
}

在新的語法中我們可以在參數(shù)聲明的同時賦予默認(rèn)值

function example (a = "string",b = "number",c = "json") {
    console.log(a);
    console.log(b);
    console.log(c); // "string" "number" "json"
}

參數(shù)展開

在 JavaScript 傳統(tǒng)語法中如果不確定參數(shù)的數(shù)量，并且想獲取所有的參數(shù)，一般使用 arguments （函數(shù)自帶的變量，數(shù)組類型，存放所有的參數(shù)）

function example (){
    console.log(arguments);
}

在新的語法中我們可以使用三個點 ... 表示接收全部參數(shù)

function example (...oVar){
    console.log(oVar);
}

還可以結(jié)合解構(gòu)賦值，實現(xiàn)不用按順序傳遞參數(shù)

function (...opaction){
    let {url,type,succ,err} = opaction;
    if(!url){
        return false;
    }else{
        console.log(url);
        console.log(type);
        console.log(succ);
        console.log(err);
    }
}
數(shù)組

map() 方法創(chuàng)建一個新數(shù)組，然后每次從開始給回調(diào)函數(shù)傳遞一個原來數(shù)組的成員，直到結(jié)束

let oArray = [5, 7, 1, 56];
const oMap = oArray .map(x => x * 3);
console.log(oMap);//  Array [15, 21, 3, 168]
//映射： 一個對一個

reduce() 方法接收一個函數(shù)作為累加器(升序執(zhí)行)，最終計算為一個值

var numbers = [1, 2, 3, 4];
 
function getSum(total, num) {
    return total + num;
}
console.log(numbers.reduce(getSum)); // 10
//匯總：一堆 返回 一個

filter() 方法創(chuàng)建一個新的數(shù)組，新數(shù)組中的元素是回調(diào)函數(shù)中符合條件的所有元素。

var ages = [95, 59, 18, 21];

function checkAdult(age) {
    return age >= 60;
}

console.log(ages.filter(checkAdult));// 95 

//過濾：一堆 返回 部分

forEach() 方法調(diào)用數(shù)組的每個元素,并將元素傳遞給回調(diào)函數(shù)

//遍歷： 以上的都可以通過 forEach() 來手動實現(xiàn)，并且可以實現(xiàn)更加個性的自定義操作
var array1 = ["a", "b", "c"];

array1.forEach(element => {
  console.log(element);
});// a b c

Array.from() 方法用于將兩類對象轉(zhuǎn)為真正的數(shù)組：類似數(shù)組的對象（array-like object）和可遍歷（iterable）的對象

//常見的類似數(shù)組的對象是 DOM 操作返回的 NodeList 集合，以及函數(shù)內(nèi)部的 arguments 對象

// NodeList對象
let ps = document.getElementsByClassName("p");//所有取到的 dom 元素都是 NodeList 格式，不是真正意義上的數(shù)組
Array.from(ps).filter(p => {
  return p.textContent.length > 9;//先用 from() 將所有取到的 p 標(biāo)簽轉(zhuǎn)換為真正的數(shù)組 然后過濾掉前十個
});

// arguments對象
function foo() {
  var args = Array.from(arguments);
  // arguments 也不是真正意義上的數(shù)組
}
json JavaScript對象字面量

關(guān)于什么是 json 這里不過多介紹，主要看看 ES6 里 json JavaScript對象字面量 是怎樣的
很多JavaScript開發(fā)人員都錯誤地把JavaScript對象字面量（Object Literals）稱為JSON對象（JSON Objects）包括我自己
在這里推薦一篇文章,感謝那些幫我指出錯誤并告訴我正確知識的人，謝謝

key and value

當(dāng)鍵名和鍵值是一樣的情況下可以只寫一個，在引入組件與庫中特定方法時，可以看到（關(guān)于如何引入其他文件，將在之后的文章寫）

//傳統(tǒng)
{
    name: name,
}

//ES6
{
    name
}

function

如果在之前了解過微信小程序，vue ，或者將要學(xué)習(xí)那么應(yīng)該會經(jīng)常看到這兩種函數(shù)的寫法

{
    onLoad() {
        butClick() {
            return false;
        }
    }
    
    methods: {
        butClick() {
            return false;
        }
    }
}

但是如果不用框架，寫這樣的代碼，會報錯
這是因為框架其實可以看做一個函數(shù)，上面這種代碼是傳遞給函數(shù)的參數(shù)（這個參數(shù)的接收方法在本篇文章的開頭）
這個參數(shù)是以 json 對象的形式傳遞的，
而 ES6 中當(dāng) value 旳值是一個函數(shù)時可以省略冒號和 function 關(guān)鍵字

//傳統(tǒng) 
{
    butClick: function (){
        return false;
    }
}

//ES6 
{
    butClick() {
        return false;
    }
}

[ ES6 ] 快速掌握常用 ES6 （一）
[ ES6 ] 快速掌握常用 ES6 （二）

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/100109.html

相關(guān)文章

  • [ ES6 ] 快速掌握常用 ES6 （一）

    摘要：常量變量先說說常量和變量的概念吧，常量是說那種進(jìn)行一次賦值后不會更改的值，比如說游戲賬戶的，變量是說賦值后有更改的需求的，比如游戲名，游戲密碼。常用實例交換變量的值提取數(shù)據(jù)解構(gòu)賦值對提取對象中的數(shù)據(jù)，尤其有用。 本系列文章適合快速掌握 ES6 入門語法，想深入學(xué)習(xí) ES6 的小伙伴可以看看阮一峰老師的《ECMAScript 6 入門》 學(xué)習(xí) 20% 的知識完成 80% 的工作 關(guān)于 ...

    ispring 評論0 收藏0

  • ES6-7

    摘要：的翻譯文檔由的維護(hù)很多人說，阮老師已經(jīng)有一本關(guān)于的書了入門，覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發(fā)過程中，顯得越來越重要。為了讓編程更美好，我們就需要引入來降低異步編程的復(fù)雜性。 JavaScript Promise 迷你書（中文版） 超詳細(xì)介紹promise的gitbook，看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...

    mudiyouyou 評論0 收藏0

  • 前端基礎(chǔ)進(jìn)階（十四）：es6常用基礎(chǔ)合集

    摘要：在繼承的構(gòu)造函數(shù)中，我們必須如上面的例子那么調(diào)用一次方法，它表示構(gòu)造函數(shù)的繼承，與中利用繼承構(gòu)造函數(shù)是一樣的功能。 showImg(https://segmentfault.com/img/remote/1460000009078532); 在實際開發(fā)中，ES6已經(jīng)非常普及了。掌握ES6的知識變成了一種必須。盡管我們在使用時仍然需要經(jīng)過babel編譯。 ES6徹底改變了前端的編碼風(fēng)格，...

    Ryan_Li 評論0 收藏0

  • 快速掌握JavaScript面試基礎(chǔ)知識(二)

    摘要：第一部分請點擊快速掌握面試基礎(chǔ)知識一閉包閉包由一個函數(shù)以及該函數(shù)定義是所在的環(huán)境組成。當(dāng)匿名函數(shù)執(zhí)行的時候，的值為。這個問題可以改用后面會介紹方法來解決，通過對每一個匿名函數(shù)構(gòu)建獨立的外部作用域來實現(xiàn)。 譯者按： 總結(jié)了大量JavaScript基本知識點，很有用！ 原文: The Definitive JavaScript Handbook for your next develope...

    fyber 評論0 收藏0

  • 前端資源系列（4）-前端學(xué)習(xí)資源分享&前端面試資源匯總

    摘要：特意對前端學(xué)習(xí)資源做一個匯總，方便自己學(xué)習(xí)查閱參考，和好友們共同進(jìn)步。 特意對前端學(xué)習(xí)資源做一個匯總，方便自己學(xué)習(xí)查閱參考，和好友們共同進(jìn)步。 本以為自己收藏的站點多，可以很快搞定，沒想到一入?yún)R總深似海。還有很多不足&遺漏的地方，歡迎補充。有錯誤的地方，還請斧正... 托管: welcome to git，歡迎交流，感謝star 有好友反應(yīng)和斧正，會及時更新，平時業(yè)務(wù)工作時也會不定期更...

    princekin 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<