看**及注釋就懂了
把es6(es2015)**轉換為es5**
解構賦值
let [dessert, drink, fruit] = breakfast()
const breakfast = () =>
}let = breakfast()
字串
陣列展開符
// 利用 array 的 concat() 實現
let food = ['rice', ...breakfast]
物件
// 物件屬性
let food = {}
let drink = 'hot drink'
food[drink] = 'milk'
console.log(food['hot drink']) // 'milk'
集合 set 和 maplet food = {}
let drink = 'hot drink'
food[drink] = 'milk'
let dessert = 'cake'
food.fruit = 'banane'
let breakfast = object.assign({}, , food) // 有屬性有值
console.log(breakfast) //
/* 新增元素,但是不會新增相同的元素,利用這個特性實現陣列去重:[...new set(arr)] */
fruit.add('pear')
/* 元素數量 */
console.log(fruit.size) // 4
/* 是否有指定元素 */
/* 刪除元素 */
fruit.delete('banana')
/* 遍歷 */
fruit.foreach(item => )
/* 清空 */
fruit.clear()
console.log(fruit) // set(0) {}
generatorlet food = new map()
let fruit = {}, cook = function(){}, dessert = '甜點'
food.set(cook, 'knife')
food.set(dessert, 'cake')
console.log(food.get(dessert)) // "cake"
food.delete(dessert)
console.log(food.has(dessert)) // false
food.foreach((value, key) => )
food.clear()
console.log(food) // map(0) {}
類function* calc(num)
let cal = calc(4)
console.info(
cal.next(), //
cal.next(), //
cal.next(), //
cal.next(), //
cal.next(), // 遍歷完了後 done:true
cal.next() //
)
class chef
get menu()
set menu(dish)
cook()
}let gu = new chef('vegetables');
gu.cook() // "vegetables"
console.log(gu.menu) // "get 取值"
gu.menu = 'egg' // "setter 存值"
gu.menu = 'fish' // "setter 存值"
console.log(gu.menu); // "getter 取值" ["egg", "fish"]
promiseclass person
intro()的生日是$`
}}class one extends person
}let z = new person('zz', '01-09')
let x = new one('xx', '01-09')
console.log(z.intro(), x.intro()) // "zz的生日是01-09" "xx的生日是01-09"
// 轉化為es5的**大概就是
/* function person(name, birth)
person.prototype.intro = function () ;
function one(name, birth)
one.prototype = new person();
var z = new person('zz', '01-09');
var x = new one('xx', '01-09');
console.log(z.intro(), x.intro()); // "zz的生日是01-09" "xx的生日是01-09" */
function ajax(fn),1000)
}ajax(()=>)
console.log('執行結束3')
})console.log('執行結束2')
})console.log('執行結束1')
})/*
效果:1s: 執行業務 執行結束1
2s: 執行業務 執行結束2
3s: 執行業務 執行結束3
4s: 執行業務 執行結束4
*/
function delay(word),1000)
})}delay('執行業務1')
.then(word=>)
.then(word=>)
.then(word=>)
.then(word=>)
.catch()
function delay(word),1000)
})}const start = async () =>
start()
專案中常用的ES6語法總結
fill 陣列填充 array.fill value 會對陣列填充陣列成員,填充長度等於陣列長度 array.fill value,start,end 可以使用指定的元素填充陣列 它接受三個引數 const filldata data return data a b c fill 7 7,7,7 n...
我在專案中es6中陣列的常用方法
array.from 從乙個類似陣列或可迭代物件建立乙個新的,淺拷貝的陣列例項 典型的 類似陣列的物件 是函式的arguments物件,以及大多數 dom 元素集,還有字串。array.from foo f o o 從string生成陣列 function foo foo 1,2,3 1,2,3 c...
vue cli專案中的ES6匯入匯出語法總結
1.export from sum 解釋 從.sum檔案中匯入預設模組,並以sum為別名匯出。是es6原生支援的匯入再匯出語法,等價於以下 import sum from sum export2.import from components 解釋 將.components目錄作為乙個模組,匯入其中的...