Js中Symbol的靜態(tài)屬性及用途詳解
Js Symbol的靜態(tài)屬性及用途
JavaScript 語言在 ES6 規(guī)范中引入了 Symbol
類型,它是一種原始數(shù)據(jù)類型,用于創(chuàng)建唯一的標(biāo)識(shí)符。Symbol
對(duì)象是不可改變且唯一的,適合用作對(duì)象屬性的鍵。除了作為對(duì)象的屬性鍵之外,Symbol
還有許多靜態(tài)屬性(也稱為“內(nèi)置符號(hào)”或“眾所周知的符號(hào)”),這些屬性包含了與語言內(nèi)部機(jī)制相關(guān)聯(lián)的特殊符號(hào)值。本文將介紹 Symbol
類型的所有靜態(tài)屬性,并舉例說明它們的用途和使用場(chǎng)景。
Symbol.hasInstance
Symbol.hasInstance
屬性用來定制 instanceof
運(yùn)算符,在一個(gè)構(gòu)造器對(duì)象上使用 instanceof
時(shí)會(huì)調(diào)用這個(gè)方法。
class MyClass { static [Symbol.hasInstance](instance) { return Array.isArray(instance); } } console.log([] instanceof MyClass); // true
在這個(gè)例子中,MyClass
用自定義的 Symbol.hasInstance
函數(shù)覆蓋了默認(rèn)行為,檢查對(duì)象是否為數(shù)組,從而使得數(shù)組實(shí)例在 instanceof
運(yùn)算時(shí)返回 true
。
Symbol.isConcatSpreadable
Symbol.isConcatSpreadable
屬性是一個(gè)布爾值,表示當(dāng)在 Array.prototype.concat()
時(shí),對(duì)象是否可以展開。
let collection = { 0: 'hello', 1: 'world', length: 2, [Symbol.isConcatSpreadable]: true }; console.log(['Hi'].concat(collection)); // ['Hi', 'hello', 'world']
在這個(gè)例子中,collection
對(duì)象通過設(shè)置 Symbol.isConcatSpreadable
為 true
,可以被 concat
方法展開并合并到結(jié)果數(shù)組中。
Symbol.iterator
Symbol.iterator
屬性指向?qū)ο蟮哪J(rèn)迭代器方法,通常用于定義對(duì)象的 for-of
循環(huán)行為。
let fibonacci = { [Symbol.iterator]() { let pre = 0, cur = 1; return { next() { [pre, cur] = [cur, pre + cur]; return { done: false, value: cur }; } }; } } for (let n of fibonacci) { if (n > 1000) break; console.log(n); }
上述代碼中定義了斐波那契序列的迭代器,可以通過 for-of
循環(huán)輸出序列中的數(shù)。
Symbol.match
Symbol.match
屬性用于定義匹配的正則表達(dá)式行為,即當(dāng)一個(gè)對(duì)象被 String.prototype.match()
方法調(diào)用時(shí)所執(zhí)行的操作。
let hasNumber = { [Symbol.match](string) { return /\d+/.test(string); } }; console.log('123'.match(hasNumber)); // true
在這個(gè)例子中,hasNumber
定義了一個(gè)自定義的 match
行為,當(dāng)字符串中包含數(shù)字時(shí)返回 true
。
Symbol.replace
Symbol.replace
屬性定義了當(dāng)一個(gè)對(duì)象被 String.prototype.replace()
方法調(diào)用時(shí)如何替換字符串中的匹配部分。
let replaceHyphens = { [Symbol.replace](string, replacer) { return string.replace(/-/g, replacer); } }; console.log('123-45-678'.replace(replaceHyphens, ':')); // '123:45:678'
這個(gè)例子中,replaceHyphens
將字符串中的所有連字符替換為冒號(hào)。
Symbol.search
Symbol.search
屬性定義了當(dāng) String.prototype.search()
方法被調(diào)用時(shí),如何返回字符串中匹配項(xiàng)的索引。
let searchObject = { [Symbol.search](string) { return string.indexOf('JavaScript'); } }; console.log('Hello JavaScript!'.search(searchObject)); // 6
在這個(gè)例子中,searchObject
實(shí)現(xiàn)了搜索 "JavaScript" 字符串并返回它在源字符串中的位置。
Symbol.species
Symbol.species
屬性用于創(chuàng)建派生對(duì)象時(shí)確定默認(rèn)的構(gòu)造函數(shù)。
class MyArray extends Array { static get [Symbol.species]() { return Array; } } let a = new MyArray(1,2,3); let mapped = a.map(x => x * x); console.log(mapped instanceof MyArray); // false console.log(mapped instanceof Array); // true
這個(gè)例子表明,MyArray
創(chuàng)建的新數(shù)組 mapped
不是 MyArray
的實(shí)例,它是 Array
的實(shí)例。
Symbol.split
Symbol.split
屬性定義當(dāng)一個(gè)對(duì)象被 String.prototype.split()
方法調(diào)用時(shí),如何分割字符串。
let splitByLength = { [Symbol.split](string) { return string.length <= 3 ? [string] : [string.slice(0, 3), string.slice(3)]; } }; console.log('JavaScript'.split(splitByLength)); // ['Jav', 'aScript']
在這個(gè)例子中,splitByLength
對(duì)象根據(jù)長(zhǎng)度進(jìn)行分割,將字符串分為長(zhǎng)度不超過3的部分。
Symbol.toPrimitive
Symbol.toPrimitive
屬性用于指定對(duì)象轉(zhuǎn)換為相應(yīng)的原始值時(shí)的行為。
let obj = { [Symbol.toPrimitive](hint) { if (hint === 'number') { return 42; } if (hint === 'string') { return 'fourty two'; } return true; } }; console.log(+obj); // 42 console.log(`${obj}`); // 'fourty two'
在這個(gè)例子中,根據(jù)轉(zhuǎn)換提示(hint),obj
對(duì)象會(huì)返回不同的原始值。
Symbol.toStringTag
Symbol.toStringTag
屬性用于自定義對(duì)象的默認(rèn)字符串描述,是在對(duì)象上調(diào)用 toString
方法時(shí)使用的。
let myCollection = { get [Symbol.toStringTag]() { return 'MyCollection'; } }; console.log(myCollection.toString()); // [object MyCollection]
myCollection
對(duì)象的 toString
方法返回了自定義的字符串描述 [object MyCollection]
。
Symbol.unscopables
Symbol.unscopables
屬性指出了哪些屬性名會(huì)被 with
環(huán)境綁定排除。
Array.prototype[Symbol.unscopables] = Object.assign({}, Array.prototype[Symbol.unscopables], { map: true }); with ([]) { console.log(map); // ReferenceError: map is not defined }
這個(gè)例子通過把 Array.prototype.map
方法標(biāo)記為 unscopables
,在 with
語句中無法直接使用 map
方法。
總結(jié)
由于 Symbol
類型的不可變和唯一性質(zhì),它的內(nèi)置符號(hào)作為語言的元操作部分,扮演了調(diào)整對(duì)象默認(rèn)行為的關(guān)鍵角色。無論是改變內(nèi)置操作的工作方式,還是定義新的行為,Symbol
的靜態(tài)屬性為自定義高級(jí)抽象提供了強(qiáng)大的支持,極大地增強(qiáng)了語言的靈活性和擴(kuò)展性。在日益復(fù)雜的應(yīng)用開發(fā)中,了解并合理應(yīng)用 Symbol
的靜態(tài)屬性,有助于提高代碼的可維護(hù)性和擴(kuò)展性。
到此這篇關(guān)于Js中Symbol的靜態(tài)屬性及用途詳解的文章就介紹到這了,更多相關(guān)Js Symbol內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JS簡(jiǎn)單實(shí)現(xiàn)多級(jí)Select聯(lián)動(dòng)菜單效果代碼
這篇文章主要介紹了JS簡(jiǎn)單實(shí)現(xiàn)多級(jí)Select聯(lián)動(dòng)菜單效果代碼,涉及JavaScript數(shù)組元素的遍歷及動(dòng)態(tài)設(shè)置select的實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-09-09深入理解webpack process.env.NODE_ENV配置
這篇文章主要介紹了深入理解webpack process.env.NODE_ENV配置,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02解決js相同的正則多次調(diào)用test()返回的值卻不同的問題
今天小編就為大家分享一篇解決js相同的正則多次調(diào)用test()返回的值卻不同的問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-10-10js跨域和ajax 跨域問題的實(shí)現(xiàn)思路
大家都知道js是不能跨域的,但我們有時(shí)候就要這么用,怎么辦呢?辦法總是有的.2009-09-09js遍歷添加欄目類添加css 再點(diǎn)擊其它刪除css【推薦】
這篇文章主要介紹了js遍歷添加欄目類添加css 再點(diǎn)擊其它刪除css的實(shí)例代碼,非常不錯(cuò),具有一定的參考借鑒借鑒價(jià)值,需要的朋友可以參考下2018-06-06