{%hackmd BJrTq20hE %} ###### tags: `JaveScript` `核心篇` `class` # class擴充原始陣列的方法 這個範例是繼承原始Array並添加新的方法,好處是不會動到原始Array的prototype,並且能使用原本Array的所有方法 ```javascript= // 準備要帶入的資料 const orderList = [ {name: 'Jack', order: '小籠湯包', price: 65}, {name: 'John', order: '珍珠奶茶', price: 45}, {name: 'Alex', order: '排骨飯', price: 90}, {name: 'Jon', order: '茄汁義大利麵', price: 120}, {name: 'Marlin', order: '冬瓜牛奶', price: 55}, {name: 'CHUN-CHIA', order: '西班牙海鮮燉飯', price: 180}, {name: 'May', order: '快樂肥宅套餐', price: 250}, ] // 創造一個繼承Array的class class NewArry extends Array{ constructor(data){ // 因為要把陣列帶入陣列如果不展開就會變成[[],[]] super(...data) } // 寫入新的方法 sumPrice(){ return this.reduce((pre, cur) => pre + cur.price ,0) } sortByParminter(par, ascend = true){ return this.sort((a, b) => ascend ? a[par] - b[par] : b[par] - a[par]) } } const myOrder = new NewArry(orderList) console.log(myOrder) console.log(myOrder.sumPrice()) console.log(myOrder.sortByParminter('price' ,false)) ``` [class擴充原始陣列的方法](https://codepen.io/pen/?editors=0011)
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up