摘要:函數(shù)調(diào)用會(huì)在內(nèi)存形成一個(gè)調(diào)用記錄,又稱調(diào)用幀,保存調(diào)用位置和內(nèi)部變量等信息。等到運(yùn)行結(jié)束,將結(jié)果返回到,的調(diào)用幀才會(huì)消失。方法用于將一組值,轉(zhuǎn)換為數(shù)組。,和遍歷數(shù)組方法返回一個(gè)布爾值,表示某個(gè)數(shù)組是否包含給定的值,與字符串的方法類似。
ES6 簡(jiǎn)介
ES6, 全稱 ECMAScript 6.0 ,是 JavaScript 的下一個(gè)版本標(biāo)準(zhǔn),2015.06 發(fā)版。
let 和 const let 命令let 命令,用來(lái)聲明變量。它的用法類似于 var,區(qū)別在于 var 聲明的變量全局有效,let 聲明的變量只在它所在的代碼塊內(nèi)有效。
// 變量i儲(chǔ)存的值是10,所以執(zhí)行a[2]()后輸出10 var a = []; for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[2](); // 10 // 修正方法 // 閉包會(huì)使得函數(shù)中的變量都被保存在內(nèi)存中,所以執(zhí)行a[2]()后輸出2 var a = []; for (var i = 0; i < 10; i++) { (function (i) { a[i] = function () { console.log(i) } })(i); } a[2](); // 2 // es6 // let聲明的i只在當(dāng)前的代碼塊有效,所以每次for循環(huán)相當(dāng)于用let重新聲明一次i var a = []; for (let i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[2](); // 2 // 注:JavaScript 引擎內(nèi)部會(huì)記住上一輪循環(huán)的值,初始化本輪的變量i時(shí),就在上一輪循環(huán)的基礎(chǔ)上進(jìn)行計(jì)算。
let 不存在變量提升,必須先聲明后使用,否則報(bào)錯(cuò);var 存在變量提升,未聲明前使用輸出 undefined。
let 存在暫時(shí)性死區(qū),在代碼塊內(nèi),使用 let 命令聲明變量之前,該變量都是不可用的。
let 不允許重復(fù)聲明。
const 命令const 聲明一個(gè)只讀的常量。一旦聲明,常量的值就不能改變。不能只聲明不賦值。
const a = 10; a = 20; // 報(bào)錯(cuò) const b; // 報(bào)錯(cuò)
const 的作用域與 let 相同。
if(true) { const num = 5; } console.log(num); // 報(bào)錯(cuò)
const 聲明對(duì)象,常量對(duì)象內(nèi)存地址,因此對(duì)象本身可改,但是給常量重新賦值就會(huì)報(bào)錯(cuò)。
const obj = {}; obj.a = "a"; obj = {}; // 報(bào)錯(cuò)塊級(jí)作用域和函數(shù)作用域
ES5 規(guī)定,函數(shù)只能在頂層作用域和函數(shù)作用域之中聲明,不能在塊級(jí)作用域聲明。但是在 ES6 中,函數(shù)可以在塊級(jí)作用域中聲明。但是,市面上很多瀏覽器都不支持 ES6,所以應(yīng)該避免在塊級(jí)作用與中聲明函數(shù)。
ES6 聲明變量的方法var
function
let
const
import
class
變量的解構(gòu)賦值ES6 允許按照一定模式,從數(shù)組和對(duì)象中提取值,對(duì)變量進(jìn)行賦值,這被稱為解構(gòu)(Destructuring)。
數(shù)組的解構(gòu)賦值模式匹配賦值,如果解構(gòu)不成功,變量的值就等于 undefined。
let [a, [[b], c]] = [1, [[2], 3]]; console.log(a,b,c); // 1, 2, 3 let [x, , y, z] = [1, 2, 3]; console.log(x); // 1 console.log(y); // 3 console.log(z); // undefined
不完全解構(gòu)賦值,等號(hào)左邊的模式,只匹配一部分的等號(hào)右邊的數(shù)組。
let [x, [y], z] = [1, [2, 3], 4]; console.log(x); // 1 console.log(y); // 2 console.log(z); // 4
數(shù)組結(jié)構(gòu)賦值右邊必須是數(shù)組,模式不匹配則報(bào)錯(cuò)。
let [a] = {}; // 報(bào)錯(cuò)
解構(gòu)賦值可以添加默認(rèn)值,并且可以引用解構(gòu)賦值的其他變量。
let [a = 1, b = 2] = [, 3]; console.log(a); // 1 console.log(b); // 3 let [x = 1, y = x] = []; // x = 1; y = 1 let [x = 1, y = x] = [2]; // x = 1; y = 2
數(shù)組解構(gòu)賦值可用于交換變量的值。
let [a, b] = [1, 2]; console.log(a, b); // 1, 2 [b, a] = [a, b]; console.log(a, b); // 2, 1對(duì)象的解構(gòu)賦值
變量必須與屬性同名
let { a, b, c } = { a: "aaa", b: "bbb" }; console.log(a); // "aaa" console.log(b); // "bbb" console.log(c); // undefined
變量名與屬性名不一致
let { a: x, b: y } = { a: "aaa", b: "bbb" }; console.log(x); // "aaa" console.log(y); // "bbb"
嵌套賦值,如果子對(duì)象所在的父屬性不存在,會(huì)報(bào)錯(cuò),慎用。
let { a, a: {x}, b: y } = { a: {x: "xxx",y: "yyy"}, b: "bbb" }; console.log(a); // { x: "xxx", y: "yyy" } console.log(x); // "xxx" let {c: {d: {e}}} = {c: "ccc"}; // 報(bào)錯(cuò) console.log(e)
變量解構(gòu)賦值也和數(shù)組的解構(gòu)賦值一樣,可以賦默認(rèn)值,變量解構(gòu)賦值時(shí),不能將大括號(hào)寫在行首,否者 JavaScript 引擎將會(huì)按代碼塊執(zhí)行。
let x; {x} = {x: 1}; // 報(bào)錯(cuò) // 正確寫法 let x; ({x} = {x: 1});字符串解構(gòu)賦值
字符串解構(gòu)賦值,將字符串轉(zhuǎn)化成數(shù)組對(duì)象
const [a,b,c] = "123456789"; const {length} = "123456789"; console.log(a, b, c, length); // 1, 2, 3, 9函數(shù)解構(gòu)賦值
const arr = [[1, 2], [3, 4]].map(([a, b]) => a + b); console.log(arr); // [ 3, 7 ]解構(gòu)賦值規(guī)則
解構(gòu)賦值的規(guī)則是,只要等號(hào)右邊的值不是對(duì)象或數(shù)組,就先將其轉(zhuǎn)為對(duì)象。由于 undefined 和 null 無(wú)法轉(zhuǎn)為對(duì)象,所以對(duì)它們進(jìn)行解構(gòu)賦值,都會(huì)報(bào)錯(cuò)。
let {toString: n} = 123; n === Number.prototype.toString // true let {toString: b} = true; b === Boolean.prototype.toString // true let { prop: u } = undefined; // 報(bào)錯(cuò) let { prop: n } = null; // 報(bào)錯(cuò)解構(gòu)賦值的用途
交換變量的值
從對(duì)象、數(shù)組中取值(提取 JSON 數(shù)據(jù)),或從函數(shù)中返回多個(gè)值
函數(shù)解構(gòu)賦值傳參,給定函數(shù)參數(shù)的默認(rèn)值
輸入模塊的指定方法
遍歷 Map 結(jié)構(gòu)
const map = new Map(); map.set("first", "hello"); map.set("second", "world"); for (let [key, value] of map) { console.log(key + " is " + value); } // first is hello // second is world字符串?dāng)U展(不含編碼) for...of 遍歷字符串
for(let codePoint of "string"){ console.log(codePoint) } // "s" // "t" // "r" // "i" // "n" // "g"includes(),startsWith(),endsWith()
三個(gè)方法都接收兩個(gè)參數(shù),第一個(gè)參數(shù)為檢索的值,第二個(gè)參數(shù)為檢索的起始位置,返回布爾值
let s = "Hello world!"; const [a, b, c] = [ s.startsWith("Hello", 2), s.endsWith("!"), s.includes("o w") ]; console.log(a, b, c); // false true truerepeat()
repeat 方法返回一個(gè)新字符串,表示將原字符串重復(fù) n 次。
參數(shù)為[-Infinity,-1]或者 Infinity,會(huì)報(bào)錯(cuò);
參數(shù)為(-1,1)時(shí),相當(dāng)于參數(shù)為 0;
參數(shù)為小數(shù)時(shí)向下取整;
參數(shù) NaN 等同于 0;
參數(shù)是字符串,則會(huì)先轉(zhuǎn)換成數(shù)字。
"str".repeat("3") // "strstrstr"padStart(), padEnd()
padStart(),padEnd()有兩個(gè)參數(shù),第一個(gè)參數(shù)為字符串補(bǔ)全生效的最大長(zhǎng)度,第二個(gè)參數(shù)為補(bǔ)全的字符串。
第二個(gè)參數(shù)默認(rèn)為空格,省略第二個(gè)參數(shù)時(shí)默認(rèn)用空格補(bǔ)全。
第一個(gè)參數(shù)小于字符串原長(zhǎng)度時(shí),返回原字符串。
如果用來(lái)補(bǔ)全的字符串與原字符串,兩者的長(zhǎng)度之和超過(guò)了最大長(zhǎng)度,則會(huì)截去超出位數(shù)的補(bǔ)全字符串。
常見用途:補(bǔ)全指定位數(shù),提示字符串格式。
"123456".padStart(10, "0") // "0000123456" "09-12".padStart(10, "YYYY-MM-DD") // "YYYY-09-12"模版字符串(``)
const str = "world"; const template = `Hello ${str}`; console.log(template); // Hello world正則擴(kuò)展(略) 數(shù)值擴(kuò)展 二進(jìn)制、八進(jìn)制表示法
使用二進(jìn)制表示法,前綴為 0b,使用八進(jìn)制表示法,前綴為 0o,ES6 不支持使用 00 前綴表示八進(jìn)制。
進(jìn)制轉(zhuǎn)換使用 toString 方法,使用 Number 方法直接轉(zhuǎn)十進(jìn)制。
0b1100100 === 100; // true 0o144 === 100; // true (0b1100100).toString(8); // 144 (0b1100100).toString(10); // 100 Number("0b1100100"); // 100Number.isFinite(),Number.isNaN()
Number.isFinite()用來(lái)檢查一個(gè)數(shù)值是否為有限的(finite),即不是 Infinity。參數(shù)類型不是數(shù)值,Number.isFinite 一律返回 false。
Number.isNaN()用來(lái)檢查一個(gè)值是否為 NaN。參數(shù)類型不是 NaN,Number.isNaN 一律返回 false。
Number.isFinite(15); // true Number.isFinite(-Infinity); // false Number.isNaN(15) // false Number.isNaN(9/0) // trueNumber.parseInt(), Number.parseFloat()
ES6 將全局方法 parseInt()和 parseFloat(),移植到 Number 對(duì)象上面,行為完全保持不變。
Number.isInteger()Number.isInteger()用來(lái)判斷一個(gè)數(shù)值是否為整數(shù)。
Number.isInteger(25) // true Number.isInteger(25.0) // true Number.isInteger(25.1) // falseES6 新增 Number 常量
Number.EPSILON 極小常量,浮點(diǎn)數(shù)誤差小于這個(gè)值可以認(rèn)為不存在誤差;
Number.MAX_SAFE_INTEGER 安全整數(shù)的最大范圍;
Number.MIN_SAFE_INTEGER 安全整數(shù)的最小范圍;
Number.isSafeInteger() 用來(lái)判斷一個(gè)整數(shù)是否落在安全整數(shù)范圍之內(nèi)。
Number.isSafeInteger(9007199254740993) // false Number.isSafeInteger(990) // true Number.isSafeInteger(9007199254740993 - 990) // trueMath 對(duì)象的擴(kuò)展
Math.trunc() 除去一個(gè)數(shù)的小數(shù)部分,返回整數(shù)部分。參數(shù)不是數(shù)值,內(nèi)部會(huì)先調(diào)用 Nunber()專為數(shù)值,對(duì)于空值和無(wú)法截取整數(shù)的值,返回 NaN。(Math 對(duì)象的擴(kuò)展的方法對(duì)于非數(shù)值的處理方法都一樣)
Math.trunc(5.9) // 5 Math.trunc(-4.9) // -4 Math.trunc(null) // 0 Math.trunc("foo"); // NaN
Math.sign() 判斷一個(gè)數(shù)是正數(shù)、負(fù)數(shù)、還是零。
Math.sign(-5) // -1 負(fù)數(shù) Math.sign(5) // +1 正數(shù) Math.sign(0) // +0 零 Math.sign(-0) // -0 零 Math.sign(NaN) // NaN
Math.cbrt() 計(jì)算一個(gè)數(shù)的立方根。
Math.cbrt(2) // 1.2599210498948734 // Math.sqrt(x) 計(jì)算平方根 Math.sqrt(2) // 1.4142135623730951 // 冪運(yùn)算 Math.pow(x,y) Math.pow(2, 3)
Math.hypot() 返回所有參數(shù)的平方和的平方根。
Math.hypot(3, 4); // 5 Math.hypot(3, 4, 5); // 7.0710678118654755函數(shù)擴(kuò)展 rest 參數(shù)
ES6 引入 rest 參數(shù)(形式為...變量名),用于獲取函數(shù)的多余參數(shù),rest 參數(shù)搭配的變量是一個(gè)數(shù)組,該變量將多余的參數(shù)放入數(shù)組中。只能是最后一個(gè)參數(shù),函數(shù)的 length 屬性,不包括 rest 參數(shù)。
function sum1(x, y, ...args) { let sum = 0; for (let arg of args) { sum += arg; } return sum; } console.log(sum1(1, 2, 3, 4)) // 7 function sum2(...args) { return args.reduce((prev, curr) => { return prev + curr }, 0) } console.log(sum2(1, 2, 3)); // 6name 屬性
函數(shù)的 name 屬性,返回該函數(shù)的函數(shù)名。對(duì)于匿名函數(shù),ES5 返回"",ES6 返回變量名;
Function 構(gòu)造函數(shù)返回的函數(shù)實(shí)例,name 屬性的值為 anonymous;bind 返回的函數(shù),name 屬性值會(huì)加上 bound 前綴。
function fn() {} fn.name // "fn" function foo() {}; foo.bind({}).name // "bound foo" (function(){}).bind({}).name // "bound "箭頭函數(shù)
const fn = v => v; // 等同于 const fn = function (v) { return v; };
注意要點(diǎn)
函數(shù)體內(nèi)的 this 對(duì)象,就是定義時(shí)所在的對(duì)象,而不是使用時(shí)所在的對(duì)象;
不可以當(dāng)作構(gòu)造函數(shù),即不可以使用 new 命令,否則會(huì)拋出一個(gè)錯(cuò)誤;
不可以使用 arguments 對(duì)象,該對(duì)象在函數(shù)體內(nèi)不存在。如果要用,可以用 rest 參數(shù)代替;
不可以使用 yield 命令,因此箭頭函數(shù)不能用作 Generator 函數(shù)。
尾調(diào)用優(yōu)化尾調(diào)用指函數(shù)的最后一步是調(diào)用另一個(gè)函數(shù)。
function f(x){ "use strict"; return g(x); }
函數(shù)調(diào)用會(huì)在內(nèi)存形成一個(gè)“調(diào)用記錄”,又稱“調(diào)用幀”(call frame),保存調(diào)用位置和內(nèi)部變量等信息。如果在函數(shù) A 的內(nèi)部調(diào)用函數(shù) B,那么在 A 的調(diào)用幀上方,還會(huì)形成一個(gè) B 的調(diào)用幀。等到 B 運(yùn)行結(jié)束,將結(jié)果返回到 A,B 的調(diào)用幀才會(huì)消失。如果函數(shù) B 內(nèi)部還調(diào)用函數(shù) C,那就還有一個(gè) C 的調(diào)用幀,以此類推。所有的調(diào)用幀,就形成一個(gè)“調(diào)用棧”(call stack)。
尾調(diào)用由于是函數(shù)的最后一步操作,所以不需要保留外層函數(shù)的調(diào)用幀,因?yàn)檎{(diào)用位置、內(nèi)部變量等信息都不會(huì)再用到了,只要直接用內(nèi)層函數(shù)的調(diào)用幀,取代外層函數(shù)的調(diào)用幀就可以了,這樣可以防止內(nèi)存溢出,達(dá)成尾調(diào)用優(yōu)化。
ES6 的尾調(diào)用優(yōu)化只在嚴(yán)格模式下開啟,正常模式是無(wú)效的。
數(shù)組擴(kuò)展 擴(kuò)展運(yùn)算符擴(kuò)展運(yùn)算符(spread)是三個(gè)點(diǎn)(...)。它好比 rest 參數(shù)的逆運(yùn)算,將一個(gè)數(shù)組轉(zhuǎn)為用逗號(hào)分隔的參數(shù)序列。
const arr = [1, 2, 3]; arr.push(...[4, 5, 6]);
擴(kuò)展運(yùn)算符的應(yīng)用
數(shù)組展開
const arr = [1, 2, 3]; ...arr // 1, 2, 3
復(fù)制數(shù)組
const a1 = [1, 2]; // 寫法一 const a2 = [...a1]; // 寫法二 const [...a2] = a1; // 相當(dāng)于 const a1 = [1, 2]; const a2 = a1.concat();
合并數(shù)組。淺拷貝只是對(duì)指針的拷貝,拷貝后兩個(gè)指針指向同一個(gè)內(nèi)存空間,深拷貝不但對(duì)指針進(jìn)行拷貝,而且對(duì)指針指向的內(nèi)容進(jìn)行拷貝,經(jīng)深拷貝后的指針是指向兩個(gè)不同地址的指針。以下的兩種方法屬于淺拷貝,如果修改了原數(shù)組的成員,會(huì)同步反映到新數(shù)組。
const arr1 = ["a", "b"]; const arr2 = ["c"]; const arr3 = ["d", "e"]; // ES5 的合并數(shù)組 arr1.concat(arr2, arr3); // [ "a", "b", "c", "d", "e" ] // ES6 的合并數(shù)組 [...arr1, ...arr2, ...arr3] // [ "a", "b", "c", "d", "e" ]
解構(gòu)賦值,字符串轉(zhuǎn)數(shù)組
const list = [1, 2, 3]; [a, ...b] = list; console.log(a) // 1 console.log(b) // [2, 3] [..."hello"] // ["h", "e", "l", "l", "o"]Array.from()
Array.from 方法用于將兩類對(duì)象轉(zhuǎn)為真正的數(shù)組:類似數(shù)組的對(duì)象(array-like object)和可遍歷(iterable)的對(duì)象(包括 ES6 新增的數(shù)據(jù)結(jié)構(gòu) Set 和 Map)。
常見的類似數(shù)組的對(duì)象有 DOM 操作返回的 NodeList 集合,以及函數(shù)內(nèi)部的 arguments 對(duì)象。
let arrayLike = { "0": "a", "1": "b", "2": "c", length: 3 }; // ES5的寫法 var arr1 = [].slice.call(arrayLike); // ["a", "b", "c"] // ES6的寫法 let arr2 = Array.from(arrayLike); // ["a", "b", "c"] Array.from("hello"); // ["h", "e", "l", "l", "o"] let namesSet = new Set(["a", "b"]); Array.from(namesSet); // ["a", "b"]
Array.from 還可以接受第二個(gè)參數(shù),作用類似于數(shù)組的 map 方法,用來(lái)對(duì)每個(gè)元素進(jìn)行處理,將處理后的值放入返回的數(shù)組。
let arrayLike = { "0": 1, "1": 2, "2": 3, length: 3 }; Array.from(arrayLike, x => x * x); // [ 1, 4, 9 ]Array.of()
Array.of 方法用于將一組值,轉(zhuǎn)換為數(shù)組。這個(gè)方法的主要目的,是彌補(bǔ)數(shù)組構(gòu)造函數(shù) Array()的不足。因?yàn)閰?shù)個(gè)數(shù)的不同,會(huì)導(dǎo)致 Array()的行為有差異。
Array.of() // [] Array.of(undefined) // [undefined] Array.of(1) // [1] Array.of(1, 2) // [1, 2]copyWithin()
參數(shù):
target(必需):從該位置開始替換數(shù)據(jù)。如果為負(fù)值,表示倒數(shù)。
start(可選):從該位置開始讀取數(shù)據(jù),默認(rèn)為 0。如果為負(fù)值,表示倒數(shù)。
end(可選):到該位置前停止讀取數(shù)據(jù),默認(rèn)等于數(shù)組長(zhǎng)度。如果為負(fù)值,表示倒數(shù)。
這三個(gè)參數(shù)都應(yīng)該是數(shù)值,如果不是,會(huì)自動(dòng)轉(zhuǎn)為數(shù)值。
[1, 2, 3, 4, 5].copyWithin(0, 3)find() 和 findIndex()
數(shù)組實(shí)例的 find 方法,用于找出第一個(gè)符合條件的數(shù)組成員,如果沒(méi)有符合條件的成員,則返回 undefined。
findIndex 方法返回第一個(gè)符合條件的數(shù)組成員的位置,如果所有成員都不符合條件,則返回-1。
[1, 4, -5, 10].find(n => n < 0); // -5 [1, 4, -5, 10].findIndex(n => n < 0); // 2
兩個(gè)方法都可以接受第二個(gè)參數(shù),用來(lái)綁定回調(diào)函數(shù)的 this 對(duì)象。
function f(v){ return v > this.age; } let person = {name: "John", age: 20}; [10, 12, 26, 15].find(f, person); // 26
這兩個(gè)方法都可以發(fā)現(xiàn) NaN,彌補(bǔ)了數(shù)組的 indexOf 方法的不足。
fill() 填充數(shù)組fill 方法使用給定值,填充一個(gè)數(shù)組。fill 方法可以接受第二個(gè)和第三個(gè)參數(shù),用于指定填充的起始位置和結(jié)束位置。如果填充的類型為對(duì)象,那么被賦值的是同一個(gè)內(nèi)存地址的對(duì)象,而不是深拷貝對(duì)象,改變數(shù)組中的一項(xiàng),則所有項(xiàng)都改變。
let arr = Array.of(1, 2, 3).fill({ num: 20 }); console.log(arr); // [ { num: 20 }, { num: 20 }, { num: 20 } ] arr[0].num = 10; console.log(arr); // [ { num: 10 }, { num: 10 }, { num: 10 } ]entries(),keys() 和 values() 遍歷數(shù)組
for (let index of ["a", "b"].keys()) { console.log(index); } // 0 // 1 for (let elem of ["a", "b"].values()) { console.log(elem); } // "a" // "b" for (let [index, elem] of ["a", "b"].entries()) { console.log(index, elem); } // 0 "a" // 1 "b"includes()
includes 方法返回一個(gè)布爾值,表示某個(gè)數(shù)組是否包含給定的值,與字符串的 includes 方法類似。該方法的第二個(gè)參數(shù)表示搜索的起始位置,第二參數(shù)是負(fù)數(shù),取它的倒數(shù),第二參數(shù)大于數(shù)組長(zhǎng)度,取 0。
[1, 2, 3].includes(3, -1); // trueflat(),flatMap()
flat()默認(rèn)只會(huì)“拉平”一層,如果想要“拉平”多層的嵌套數(shù)組,可以將 flat()方法的參數(shù)寫成一個(gè)整數(shù),表示想要拉平的層數(shù),默認(rèn)為 1。
flat()的參數(shù)為 2,表示要“拉平”兩層的嵌套數(shù)組。如果不管有多少層嵌套,都要轉(zhuǎn)成一維數(shù)組,可以用 Infinity 關(guān)鍵字作為參數(shù)。
[1, [2, [3]]].flat(Infinity); // [1, 2, 3]
flatMap()先遍歷數(shù)組,再“拉平”一層,也只能拉平一層。參數(shù)魚 map()方法類似。
?
[2, 3, 4].flatMap(x => [x, x * 2]); // [2, 4, 3, 6, 4, 8] // 相當(dāng)于 [2, 3, 4].map(x => [x, x * 2]).flat(); // [2, 4, 3, 6, 4, 8]對(duì)象擴(kuò)展 屬性簡(jiǎn)潔表示法
const a = 1; const b = 2; const c = {a, b}; // 等同于 const c = {a: a, b: b}; const o = { method() { return "Hello!"; } }; // 等同于 const o = { method: function() { return "Hello!"; } }; function f(x, y) { return {x, y}; } // 等同于 function f(x, y) { return {x: x, y: y}; }對(duì)象的擴(kuò)展運(yùn)算符
對(duì)象擴(kuò)展符類似數(shù)組擴(kuò)展符,主要用于解構(gòu)賦值。
let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 }; x // 1 y // 2 z // { a: 3, b: 4 } let ab = { ...a, ...b }; // 等同于 let ab = Object.assign({}, a, b);Object.is()
Object.is就是部署這個(gè)算法的新方法。它用來(lái)比較兩個(gè)值是否嚴(yán)格相等,與嚴(yán)格比較運(yùn)算符(===)的行為基本一致。
Object.is("str", "str"); // true Object.is({}, {}); // false
不同之處只有兩個(gè):一是+0不等于-0,二是NaN等于自身。
+0 === -0 //true NaN === NaN // false Object.is(+0, -0) // false Object.is(NaN, NaN) // trueObject.assign()
Object.assign方法用于對(duì)象的合并,將源對(duì)象(source)的所有可枚舉屬性,復(fù)制到目標(biāo)對(duì)象(target)。
Object.assign方法的第一個(gè)參數(shù)是目標(biāo)對(duì)象,后面的參數(shù)都是源對(duì)象。如果目標(biāo)對(duì)象與源對(duì)象有同名屬性,或多個(gè)源對(duì)象有同名屬性,則后面的屬性會(huì)覆蓋前面的屬性。
由于undefined和null無(wú)法轉(zhuǎn)成對(duì)象,所以如果它們作為首參數(shù),就會(huì)報(bào)錯(cuò)。
const target = { a: 1, b: 1 }; const source1 = { b: 2, c: 2 }; const source2 = { c: 3 }; Object.assign(target, source1, source2); target // {a:1, b:2, c:3}
常見用途:
為對(duì)象添加屬性和方法
克隆或合并對(duì)象
給屬性指定默認(rèn)值
其他本文參考《ECMAScript 6 入門》,了解更多請(qǐng)點(diǎn)擊跳轉(zhuǎn)點(diǎn)擊跳轉(zhuǎn)。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/109152.html
摘要:手把手教你做個(gè)人火的時(shí)候,隨便一個(gè)都能賺的盆滿缽滿,但是,個(gè)人沒(méi)有服務(wù)端,沒(méi)有美工,似乎就不能開發(fā)了,真的是這樣的嗎秘密花園經(jīng)典的中文手冊(cè)。涵蓋前端知識(shí)體系知識(shí)結(jié)構(gòu)圖書推薦以及入門視頻教程,全的簡(jiǎn)直不要不要的了。 JavaScript 實(shí)現(xiàn)點(diǎn)擊按鈕復(fù)制指定區(qū)域文本 html5 的 webAPI 接口可以很輕松的使用短短的幾行代碼就實(shí)現(xiàn)點(diǎn)擊按鈕復(fù)制區(qū)域文本的功能,不需要依賴 flash。...
摘要:一些知識(shí)點(diǎn)有哪些方法方法前端從入門菜鳥到實(shí)踐老司機(jī)所需要的資料與指南合集前端掘金前端從入門菜鳥到實(shí)踐老司機(jī)所需要的資料與指南合集歸屬于筆者的前端入門與最佳實(shí)踐。 工欲善其事必先利其器-前端實(shí)習(xí)簡(jiǎn)歷篇 - 掘金 有幸認(rèn)識(shí)很多在大廠工作的學(xué)長(zhǎng),在春招正式開始前為我提供很多內(nèi)部推薦的機(jī)會(huì),非常感謝他們對(duì)我的幫助?,F(xiàn)在就要去北京了,對(duì)第一份正式的實(shí)習(xí)工作也充滿期待,也希望把自己遇到的一些問(wèn)題和...
摘要:平日學(xué)習(xí)接觸過(guò)的網(wǎng)站積累,以每月的形式發(fā)布。年以前看這個(gè)網(wǎng)址概況在線地址前端開發(fā)群月報(bào)提交原則技術(shù)文章新的為主。 平日學(xué)習(xí)接觸過(guò)的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址:http://www.kancloud.cn/jsfron... 概況 在線地址:http://www.kancloud.cn/jsfront/month/82796 JS前端開發(fā)群月報(bào) 提交原則: 技...
摘要:平日學(xué)習(xí)接觸過(guò)的網(wǎng)站積累,以每月的形式發(fā)布。年以前看這個(gè)網(wǎng)址概況在線地址前端開發(fā)群月報(bào)提交原則技術(shù)文章新的為主。 平日學(xué)習(xí)接觸過(guò)的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址:http://www.kancloud.cn/jsfron... 概況 在線地址:http://www.kancloud.cn/jsfront/month/82796 JS前端開發(fā)群月報(bào) 提交原則: 技...
閱讀 2330·2021-11-17 09:33
閱讀 858·2021-10-13 09:40
閱讀 585·2019-08-30 15:54
閱讀 788·2019-08-29 15:38
閱讀 2424·2019-08-28 18:15
閱讀 2487·2019-08-26 13:38
閱讀 1853·2019-08-26 13:36
閱讀 2140·2019-08-26 11:36