使用ES6新特性開發微信小程式的新手教程

2022-09-24 03:00:08 字數 4338 閱讀 7679

在es6中,像array,date和dom元素這樣的內建物件都可以被子類化。

class myarray extends array

}var arr = new myarray();

arr[1] = 12;

console.log(arr.length == 2); // 輸出: truemixin在j**ascript裡可以看作是一種從別的物件」借用」功能的方法。每乙個新定義的物件都有乙個 prototype屬性,其他的物件就可以從這裡」借用」功能。這裡的功能可以是乙個屬性,也可以是乙個方法。

mixin支援在乙個系統中降解功能的重複性,增加功能的重用性。在一些應用程式也許需要在所有的物件實體共享行為的地方,我們能夠通過在乙個mixin中維護這個共享的功能,來很容易的避免任何重複,而因此專注於只實現我們系統中真正彼此不同的功能。

在 es6 中,我們可以採用全新的基於類繼承的 「mixin」 模式設計更優雅的「語義化」介面,這是因為 es6 中的 extends 可以繼承動態構造的類,這一點和其他的靜態宣告類的程式語言不同。當 es6 類繼承另乙個類,被繼承的類可以是通過任意表示式建立的動態類。這個特性可以允許實現一種合成器模式,用乙個函式來將乙個類 c 對映到乙個新的繼承了c的類。

mixin 式繼承的基本形式:

const decorator = sup => class extends sup

class myclass extends decorator(superclass) 用 mixin 實現 serilizable

// mixin

const serializable = sup => class extends sup

if (typeof this.constructor.parse !== "function")

}tostring()

}class person );}}

class employee extends serializable(person)

static stringify(employee) = employee;

return json.stringify();

}static parse(str) = json.parse(str);

return new employee(name, age, gender, level, salary);}}

let person = new person("john", 22, "m");

console.log(person); // 輸出:person

let employee = new employee("jane", 25, "f", 1, 1000);

let employee2 = employee.parse(employee + "");

console.log(employee2); // 輸出:employee

console.log(employee2 instanceof employee); // 輸出:true

console.log(employee2 instanceof person); // 輸出:true

console.log(employee == employee2); // 輸出:false上面的**,我們用 es6 的類繼承實現了 serializable,它檢查當前例項的類上是否有定義 stringify 和 parse 靜態方法,如果有,使用靜態方法重寫 tostring 方法,如果沒有,則在例項化物件的時候丟擲乙個異常。然後通過 class employ extends serializable(person) 來實現可序列化,在這裡我們沒有可序列化 person 本身,而將 serializable 在語義上變成一種修飾,即 employee 是一種可序列化的 person。

weakmaps解決了私有資料成員的遺留問題。首先,再也沒有必自己生成乙個唯一的id了,因為該物件例項本身就是乙個唯一id。其次,當乙個物件例項被垃圾**,綁到該例項中的weakmap中所有資料也會被**。

var shape = (function() );

}shape.prototype.getname = function() ;

return shape;

}());

var shape = new shape('rectangle');

console.log(shape.getname()); // 輸出:rectangle

console.log(shape.name); // 輸出:undefined

console.log(shape.privatedata); // 輸出:undefinedprivatedata在這個例子中是乙個weakmap的例項 。當乙個新的shape被建立時,乙個weakmap的條目會被建立用來以便該例項來儲存包含私有資料的物件。在weakmap中最關鍵的是this ,即使對於開發者來說獲取乙個shape物件的引用是微不足道的一件事,他們也無法從例項外來訪問到privatedata,所以,資料被從麻煩製造者手中安全保護了。任何想要操縱私有資料的方法只能夠通過傳入例項的this ,從而拿到返回的物件。在這個例子中, getname()會獲取物件並返回name屬性的值。

尾呼叫(tail call)是函式式程式設計的乙個重要概念,是指某個函式的最後一步是呼叫另乙個函式。

尾呼叫優化是為了避免不斷保留和建立新的呼叫棧,而在函式最後一步呼叫另乙個函式。最後一步的意義就在於:不需要保留當前函式的執行環境,在呼叫的下乙個函式執行完畢並給出返回值後,直接再返回,類似於pipe。

函式呼叫自身,稱為遞迴。如果尾呼叫自身,就稱為尾遞迴。尾遞迴(tail-recursion)就是利用尾調優化的特性,從語言機制上進行遞迴操作的優化,防止堆疊溢位(stack overflow)。

「尾呼叫優化」對遞迴操作意義重大,所以一些函式式程式語言將其寫入了語言規格。es6也是如此,第一次明確規定,所有 ecmascript 的實現,都必須部署」尾呼叫優化」。這就是說,在 es6 中,只要使用尾遞迴,就不會發生棧溢位,相對節省記憶體。

遞迴非常耗費記憶體,因為需要同時儲存成千上百個呼叫幀,很容易發生「棧溢位」錯誤(stack overflow)。但對於尾遞迴來說,由於只存在乙個呼叫幀,所以永遠不會發生「棧溢位」錯誤。

下面**是乙個階乘函式,計算n的階乘,最多需要儲存n個呼叫記錄,複雜度 o(n)  

function factorial(n)

return n * factorial(n - 1);

}console.log(factorial(10)); // 輸出: 3628800如果改成尾遞迴呼叫,只保留乙個呼叫記錄,複雜度 o(1)

function factorial2(n, total = 1)

return factorial2(n - 1, n * total);

}console.log(factorial2(10)); // 輸出: 3628800計算fibonacci數列,能充分說明尾遞迴優化的重要性

function fibonacci(n) ;

return fibonacci(n - 1) + fibonacci(n - 2);

}console.log(fibonacci(10)); // 輸出: 89使用尾遞迴優化過的fibonacci 遞迴演算法

function fibonacci2(n, ac1 = 1, ac2 = 1) ;

return fibonacci2(n - 1, ac2, ac1 + ac2);

}console.log(fibonacci2(10)); // 輸出: 89

console.log(fibonacci2(100)); // 輸出: 573147844013817200000

console.log(fibonacci2(1000)); // 輸出: 7.0330367711422765e+208

console.log(fibonacci2(2000)); // 輸出: infinity

console.log(fibonacci2(10000)); // 輸出: rangeerror: maximum call stack size exceedederror是j**ascript中的錯誤類,它同時也是乙個建構函式,可以用來建立乙個錯誤物件。error例項會在發生執行進錯誤時丟擲,error像其它物件一樣,也可以由使用者自定義建立。

es6通過派生實現自定義錯誤類

class myerror extends error

}var error = new error(" error occurred");

console.log(error.message); // 輸出: error occurred

var myerror = new myerror("error occurred");

console.log(myerror.message); // 輸出: error occurred

使用ES6新特性開發微信小程式新手教程

使用es6新特性開發微信小程式新手教程。ecmascript 6 簡稱es6 是j ascript語言的最新標準。因為當前版本的es6是在2015年發布的,所以又稱ecmascript 2015。微信小程式支援絕大部分es6的新增特性。es6新增了const關鍵字,用來宣告常量,一旦宣告,常量的值就...

es6新特性 ES6新特性(一)

var 1 var宣告的是函式作用域 區域性 但在if for等定義的變數是全域性的 2 var 具有變數提公升,預解析 3 在同乙個作用域下,var可以宣告多次 4 var 宣告的變數會掛載到window上 let1 let不存在變數提公升,在變數使用之前,必須要先宣告 2 let在同一作用域下,...

ES6新特性須知

1.1es5之前函式想要賦預設值var funes5 function a,b,c 1.2es6開始函式想要賦預設值var funes6 function a 50,b 60,c 70 2.1es5之前字串拼接或者拼接屬性值只能如下var a lbj var b 50 var c name a ye...