專案中常用的ES6

看**及注釋就懂了

把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'

let 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) {}

let 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"]

class 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目錄作為乙個模組，匯入其中的...