摘要:模板字符串?dāng)U展操作符操作符,有兩個(gè)主要用處復(fù)制一個(gè)新的數(shù)組或?qū)ο蟀讯鄠€(gè)參數(shù)賦值給一個(gè)數(shù)組變量把一個(gè)數(shù)組變量賦值給多個(gè)參數(shù)是一個(gè)新的數(shù)組,內(nèi)容和一樣合并對(duì)象屬性,后邊的屬性會(huì)覆蓋前邊的,可用于修改對(duì)象的某個(gè)屬性值輸出默認(rèn)參數(shù)給方法添加默認(rèn)參
模板字符串
let name = "siri", age = 18, job = "front-end engineer" let oldStr = "Hi, " + name + ", I"m " + age + " and work as a " + job + "."; let newStr = `Hi, ${ name }, I"m ${ age } and work as a ${ job }.`;擴(kuò)展操作符
… 操作符,有兩個(gè)主要用處:
復(fù)制一個(gè)新的數(shù)組或?qū)ο?/p>
把多個(gè)參數(shù)賦值給一個(gè)數(shù)組變量
把一個(gè)數(shù)組變量賦值給多個(gè)參數(shù)
let a = [1, 2, 3] let b = [...a] // b是一個(gè)新的數(shù)組,內(nèi)容和a一樣 let c = [...a, 4, 5, 6] let car = { type: "vehicle ", wheels: 4}; let newCar = {...car} console.log(newCar); // { type: "vehicle ", wheels: 4} // 合并對(duì)象屬性,后邊的屬性會(huì)覆蓋前邊的,可用于修改對(duì)象的某個(gè)屬性值 let car2 = {...car, type: "vehicle2", wheels: 2} // {type: "vehicle2", wheels: 2}
function foo(...args) { console.log(args); } foo( "car", 54, "tree"); // console.log 輸出 [ "car", 54, "tree" ]默認(rèn)參數(shù)
// 給方法添加默認(rèn)參數(shù)值 function foo( a = 5, b = 10) { console.log( a + b); } foo(); // 15 foo( 7, 12 ); // 19 foo( undefined, 8 ); // 13 foo( 8 ); // 18 foo( null ); // 10 as null is coerced to 0
// 默認(rèn)參數(shù)值也可以是表達(dá)式或者函數(shù) function foo( a ) { return a * 4; } // y = x + 4, z = foo(x) function bar( x = 2, y = x + 4, z = foo(x)) { console.log([ x, y, z ]); } bar(); // [ 2, 6, 8 ] bar( 1, 2, 3 ); //[ 1, 2, 3 ] bar( 10, undefined, 3 ); // [ 10, 14, 3 ]
// 對(duì)象參數(shù)默認(rèn)值,如果參數(shù)為空,則會(huì)拋出異常 function show({ title = "title", width = 100, height = 200 }) { console.log( `${title} ${width} ${height}` ); } show() // Cannot destructure property `title` of "undefined" or "null". show({}) // title 100 200 // 解決辦法: function show({ title = "title", width = 100, height = 200 } = {}) { console.log( `${title} ${width} ${height}` ); } show(); // title 100 200 show({width: 200}) // title 200 200解析賦值
// key變量重命名, first --> firstName const person = { first: "foo", last: "tom", }; const { first: firstName } = person; console.log(firstName); // foo
// 默認(rèn)值 const settings = { speed: 150 } const { speed = 750, width = 500 } = settings; console.log(speed); // 150 console.log(width); // 500 // 可能不存在的key const { middle: middleName = "midname" } = person; console.log(middleName); // "midname"
// 嵌套賦值 const user = { id: 339, name: "Fred", age: 42, education: { degree: "Masters" } }; const {education: {degree}} = user; console.log(degree); //prints: Masters
// 如果嵌套的屬性不存在 const user = { id: 339, name: "Fred", age: 42 }; const {education: {degree}} = user; // TypeError: Cannot match against "undefined" or "null". // 解決辦法: const user = { id: 339, name: "Fred", age: 42 }; const {education: {degree} = {}} = user; console.log(degree); //prints: undefined利用數(shù)組生成一個(gè)數(shù)字序列
const numRange = (start, end) => { return Array(end - start + 1).fill().map((item, index) => start + index); }; const numbers = numRange(0, 5); // [0, 1, 2, 3, 4, 5] const numbers2 = numRange(1, 5); // [1, 2, 3, 4, 5]利用Set給數(shù)組去重
const years = [2016, 2017, 2017, 2018, 2018, 2019] // set構(gòu)造函數(shù)的參數(shù)是一個(gè)array const distinctYears = [...new Set(years)] // [2016, 2017, 2018, 2019]生成唯一隨機(jī)字符串,可以指定長(zhǎng)度
function generateRandom(length) { let radom13chars = function () { return Math.random().toString(16).substring(2, 15) } let loops = Math.ceil(length / 13) return new Array(loops).fill(radom13chars).reduce((string, func) => { return string + func() }, "").substring(0, length) } generateRandom(8) // "03836a49"
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/101535.html
摘要:讓你的代碼更簡(jiǎn)短,更整潔,更易讀的小技巧寫(xiě)在文章前面這篇文章翻譯自文章就代碼整潔方面對(duì)進(jìn)行了總結(jié)。如果你正在使用的代碼使用的語(yǔ)法,這個(gè)是你需要注意的事情。更多還提供了我們很多很多其他的方式來(lái)使我們的代碼更簡(jiǎn)潔,更易讀,以及更穩(wěn)定。 讓你的代碼更簡(jiǎn)短,更整潔,更易讀的ES6小技巧 寫(xiě)在文章前面 這篇文章翻譯自ES6 tips and tricks to make your code cl...
摘要:由進(jìn)行開(kāi)發(fā)和維護(hù),代發(fā)布于年月,現(xiàn)在主要是。狀態(tài)是只讀的,只能通過(guò)來(lái)改變,以避免競(jìng)爭(zhēng)條件這也有助于調(diào)試。文件大小為,而為,為。請(qǐng)記住,性能基準(zhǔn)只能作為考慮的附注,而不是作為判斷標(biāo)準(zhǔn)。使用的人員報(bào)告說(shuō),他們永遠(yuǎn)不必閱讀庫(kù)的源代碼。 本文當(dāng)時(shí)寫(xiě)在本地,發(fā)現(xiàn)換電腦很不是方便,在這里記錄下。 angular,react & vue 2018/07/23 2016年,對(duì)于JavaScript來(lái)說(shuō)...
閱讀 3616·2021-11-24 10:22
閱讀 3686·2021-11-22 09:34
閱讀 2480·2021-11-15 11:39
閱讀 1528·2021-10-14 09:42
閱讀 3662·2021-10-08 10:04
閱讀 1553·2019-08-30 15:52
閱讀 846·2019-08-30 13:49
閱讀 3015·2019-08-30 11:21