css

mikyou 發(fā)布于2019-08-23 12:24 / 3479人閱讀

摘要：一個(gè)名不見(jiàn)經(jīng)傳的方法的中文意思是符號(hào)象征標(biāo)志記號(hào)等。而是新增的一個(gè)原生數(shù)據(jù)類(lèi)型。但不能作為構(gòu)造函數(shù)使用。只有一個(gè)目的作為對(duì)象屬性的唯一標(biāo)識(shí)符，防止對(duì)象屬性沖突發(fā)生。當(dāng)使用時(shí)以值作為鍵的屬性會(huì)被完全忽略，示意代碼

ES6一個(gè)名不見(jiàn)經(jīng)傳的Symbol()方法

symbol的中文意思是：符號(hào)；象征；標(biāo)志；記號(hào)等。

說(shuō)到JavaScript原生數(shù)據(jù)類(lèi)型，我們通常想到的有這6種：undefined、null、boolean、string、number、object。而symbol是ES6新增的一個(gè)原生數(shù)據(jù)類(lèi)型。

typeof Symbol();

而Symbol本身又是一個(gè)方法。

但Symbol不能作為構(gòu)造函數(shù)使用。

new Symbol();

只有一個(gè)目的——作為對(duì)象屬性的唯一標(biāo)識(shí)符，防止對(duì)象屬性沖突發(fā)生。
因?yàn)镾ymbol()返回值是唯一的，也就是：

Symbol("description") === Symbol("description");    // 返回值是false


let info1 = {
   name: "小明",
   age: 24,
   job: "公司前臺(tái)",
   [Symbol("description")]: "喜歡游泳"
}
let info2 = {
   [Symbol("description")]: "熱情似火"
}

let target = {};
Object.assign(target, info1, info2);

我們可以使用Object.getOwnPropertySymbols(obj)這個(gè)方法進(jìn)行獲取

Symbol在和對(duì)象使用的時(shí)候，往往離不開(kāi)JS中的數(shù)組括號(hào)[]，例如：

var smy = Symbol();
var info = {
  smy: "x",
  [smy]: "y"
};
此時(shí)：

console.log(info.smy);       // 輸出"x"
console.log(info["smy"]);    // 輸出"x"
console.log(info[smy]);      // 輸出"y"

可以添加屬性的

var smy = Symbol();
smy.description = "描述";

Symbol值可以顯式轉(zhuǎn)為字符串，也可以轉(zhuǎn)為布爾值，但是不能轉(zhuǎn)為數(shù)值

var smy = Symbol();
=> +smy

隱式地創(chuàng)建一個(gè)新的string類(lèi)型的屬性名也會(huì)報(bào)錯(cuò)，例如Symbol("foo") + "bar" 將拋出一個(gè)TypeError

使用寬松相等時(shí)， Object(sym) == sym返回值是true。注意這里外面套的是Object()；

Symbols在for...in迭代中不可枚舉，如果想要達(dá)到效果，借助Object.getOwnPropertySymbols(obj)這個(gè)方法。

當(dāng)使用JSON.strIngify()時(shí)以symbol值作為鍵的屬性會(huì)被完全忽略，示意代碼：

JSON.stringify({[Symbol("foo")]: "foo"});    // "{}"

GPU云服務(wù)器云服務(wù)器 css引入css css _CSS css88

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/98451.html

相關(guān)文章

[譯]148個(gè)資源讓你成為CSS專(zhuān)家

摘要：層疊樣式表二修訂版這是對(duì)作出的官方說(shuō)明。速查表兩份表來(lái)自一份關(guān)于基礎(chǔ)特性，一份關(guān)于布局。核心第一篇一份來(lái)自的基礎(chǔ)參考指南簡(jiǎn)寫(xiě)速查表簡(jiǎn)寫(xiě)形式參考書(shū)使用層疊樣式表基礎(chǔ)指南，包含使用的好處介紹個(gè)方法快速寫(xiě)成高質(zhì)量的寫(xiě)出高效的一些提示。迄今為止，我已經(jīng)收集了100多個(gè)精通CSS的資源，它們能讓你更好地掌握CSS技巧，使你的布局設(shè)計(jì)脫穎而出。 CSS3 資源 20個(gè)學(xué)習(xí)CSS3的有用資源 C...

impig33 2019-08-29 11:10 評(píng)論0 收藏0
簡(jiǎn)單易懂的CSS Modules

摘要：結(jié)果是選手獲勝，名為的元素，最終的值為。而合理的命名約定，的確是組織代碼的有效策略。它們會(huì)再由轉(zhuǎn)換為適當(dāng)?shù)慕M合。雖然本文為了嚴(yán)謹(jǐn)，結(jié)果寫(xiě)了相當(dāng)長(zhǎng)的篇幅，但希望你讀過(guò)之后，還能覺(jué)得是簡(jiǎn)單易懂的。不要誤會(huì)，CSS Modules可不是在說(shuō)css模塊化這個(gè)好像在某些地方見(jiàn)過(guò)的詞，它其實(shí)是特指一種近期才出現(xiàn)的技術(shù)手段。什么技術(shù)手段呢？請(qǐng)待后文說(shuō)明。層疊樣式表我們知道，css的全名叫做層...

chunquedong 2019-08-30 12:58 評(píng)論0 收藏0
CSS Modules實(shí)踐

摘要：能最大化地結(jié)合現(xiàn)有生態(tài)預(yù)處理器后處理器等和模塊化能力，幾乎零學(xué)習(xí)成本。編碼相關(guān)的所有樣式上例中打印的結(jié)果是注意到是按照自動(dòng)生成的名。實(shí)踐手動(dòng)引用渲染結(jié)果使用可以實(shí)現(xiàn)使用屬性自動(dòng)加載模塊。文章同步于Github Pines-Cheng/blog 隨著前端這幾年的風(fēng)生水起，CSS作為前端的三劍客之一，各種技術(shù)方案也是層出不窮。從CSS prepocessor（SASS、LESS、Styl...

hankkin 2019-08-29 13:00 評(píng)論0 收藏0
【譯】編寫(xiě)更好的CSS必備的40個(gè)工具

摘要：一個(gè)叫的人用純重繪并模擬了種不同的移動(dòng)設(shè)備包括可以給你的網(wǎng)站添加不相關(guān)的獨(dú)立組件的一個(gè)庫(kù)。每一個(gè)組件都是針對(duì)移動(dòng)設(shè)備定制的，并且它有很多你在傳統(tǒng)的框架中看不到的功能。如果你用開(kāi)發(fā)移動(dòng)優(yōu)先的網(wǎng)站，并想要網(wǎng)站正常運(yùn)行在低版本的上，可以考慮。眾所周知，CSS是非常棒的，它使網(wǎng)站看起來(lái)很漂亮，可以為網(wǎng)站添加動(dòng)畫(huà)，并讓呈現(xiàn)和內(nèi)容分離。去了解CSS的一切是非常難做到的，它只會(huì)變得更加困難,因?yàn)槲?..

moven_j 2019-08-28 18:09 評(píng)論0 收藏0
SegmentFault 技術(shù)周刊 Vol.38 - 神奇的 CSS

摘要：層疊即表示允許以多種方式來(lái)描述樣式，一個(gè)元素可以被渲染呈現(xiàn)出多種樣式?？梢宰寣傩缘淖兓^(guò)程持續(xù)一段時(shí)間，而不是立即生效。比如，將元素的顏色從白色改為黑色，通常這個(gè)改變是立即生效的，使用后，將按一個(gè)曲線速率變化。 showImg(https://segmentfault.com/img/bVZwyL?w=900&h=385); CSS 的全稱是 Cascading Style Sheet...

elliott_hu 2019-08-29 13:56 評(píng)論0 收藏0
CSS Modules詳解及React中實(shí)踐

摘要：上例中打印的結(jié)果是對(duì)中的名都做了處理，使用對(duì)象來(lái)保存原和混淆后的對(duì)應(yīng)關(guān)系。結(jié)合實(shí)踐在處直接使用中名即可。如因?yàn)橹粫?huì)轉(zhuǎn)變類(lèi)選擇器，所以這里的屬性選擇器不需要添加。 showImg(http://gtms01.alicdn.com/tps/i1/TB15w0HLpXXXXbdaXXXjhvsIVXX-600-364.png); CSS 是前端領(lǐng)域中進(jìn)化最慢的一塊。由于 ES2015/201...

wemall 2019-08-30 15:45 評(píng)論0 收藏0