web前端分享JS有哪些很牛的語法系列二，JS這個語言好是好，但是很多時候?qū)懫饋硖罅?，每次看大牛的代碼的時候，媽媽都問我為什么跪著讀代碼，隨著 ES 2015的普及我們可以寫出很多可讀性強且漂亮的代碼，那么接下來就帶著大家一塊學習一下可以把JS寫漂亮的 “很牛” 語法。

　　在組織面向?qū)ο蟠a的時候我們通常使用的語法是 :

　　function Swiper(){

　　}

　　原型編程時我們往往會因為語言的無奈寫成這樣的 :

　　Swiper.prototype.init = function (){}

　　Swiper.prototype.render = function(){}

　　...

　　這樣寫丑陋且麻煩，那么如何讓我們的代碼變得更漂亮，更好用那？對于JS有一定了解的童鞋可能會這么寫，兼容性良好且可以節(jié)省大量的代碼。

　　Swiper.prototype = {

　　constructor : Swiper,

　　init : function(){

　　},

　　render:function(){

　　}

　　....

　　}

　　這樣組織看起來工整一點但是還會存在不少莫名其妙的屬性constructor是個啥，好像沒啥用啊，那么如果我們在項目中加入了類似jQuery 這樣的類庫，我們的代碼就可以變得更加簡練，類似于這樣

　　$.extend(Swiper.prototype,{

　　init : function(){

　　},

　　render:function(){

　　}

　　})

　　但是受限于語法，沒法讓方法看起來很很清爽，而且要引入一個龐大的類庫，那么我們在項目構(gòu)建時使用babel這樣的編譯工具，我們可以寫成

　　Object.assign(Swiper.prototype,{

　　Init(){

　　},

　　render(){

　　}

　　})

　　現(xiàn)在你的代碼可以無需任何類庫，變得漂亮，優(yōu)雅。甚至無需使用class關(guān)鍵字就可以讓我們的代碼變得清晰、耐看，有逼格。

　　說完了面向?qū)ο筮@個大事再跟大家普及兩個極其方便的ES6新特性。

　　一行式數(shù)組去重:

　　var arr = [1,1,2,3,2,3,4,5,6,7]

　　arr = Array.from(new Set(arr));

　　ok數(shù)組去重完畢，不再用一大堆邏輯代碼處理數(shù)組中的重復(fù)，不可謂不”很?！?/p>

　　讓我們的HTMLCollection 可以使用forEach ， map ，filer... 等遍歷屬性 :

　　當我們選擇一組元素想要遍歷的時候我們在es5中往往需要非常惡心的for循環(huán)語法:

　　例如 :

　　var domlist = document.querySelector(“.list”);

　　我們需要使用非常...的for 循環(huán)

　　for( var i = 0 ; i < domlist.lenght ; i++){

　　domlist[i].....

　　}

　　如何讓這段代碼變得優(yōu)雅那 ？

　　domlist = Array.from(domlist)

　　domlist.forEach( dom =>{

　　dom....

　　})

　　怎么樣，是不是代碼上了一個臺階的趕腳。

　　好了，今天的“很牛”語法就暫時說到這里，各位小伙伴，我們下期見。