摘要:你不知道的基本包裝類型聲明本文的大部分內容參考自高級程序設計第三版中文版,中間夾雜一些自己閱讀這部分內容時的思路。而且,上面的步驟同樣適用于類型的類型對應的布爾值和數字值。
JavaScript 你不知道的基本包裝類型
聲明:本文的大部分內容參考自《JavaScript 高級程序設計(第三版)》(中文版 P.118),中間夾雜一些自己閱讀這部分內容時的思路。
JavaScript 中共有 6 種基本數據類型:Undefined、Null、Boolean、Number、String、Symbol (new in ES 6) !
舉例子入門基本數據類型的值不是對象,因而從邏輯上講它們不應該有方法或者屬性,然而事實并不是我們所想的那樣,看法寶:
var str = "hello world"; str.length; // 11 str.toUpperCase(); // HELLO WORLD
你對上面的現象有疑問嗎?沒有的話,可以關掉這個頁面了。
引入基本包裝類型為了便于操作基本數據類型的值,JavaScript 中的原始數據類型的值會在后臺隱式地被包裝為對象,從而引出了基本包裝類型(primitive wrapper type)這個概念。
【書中原話】每當讀取一個基本類型的值的時候,后臺就創建一個對應的基本包裝類型的對象,從而讓我們能夠調用一些方法來操作這些數據。
這也是為什么書中會提到這句話,ECMAScript 還提供了3個特殊的引用類型:Boolean、Number、String。哦,不對了,現在不是又出現了一種新的數據類型嗎?所以,這句話應該改為:ECMAScript 還提供了4個特殊的引用類型:Boolean、Number、String、Symbol。
除了 null 和 undefined,所有的原始值都有等價的、由對象包裝原始值的形式表達,取而代之,null 和 undefined 常被當作一個全局對象的全局屬性來使用。
window.null; // undefined window.undefined; // undefined null == undefined; // true null === undefined; // false繼續剛開始的那個例子
為了方便,就把前面的代碼直接挪過來了。
var str = "hello world"; str.length; // 11 str.toUpperCase(); // HELLO WORLD
我們看到的代碼是上面的樣子,其實后臺會自動完成下列的處理:
執行到第二行時:
創建 String 類型的一個實例;
在實例上調用指定的屬性;
銷毀這個實例;
執行到第三行時:
創建 String 類型的一個實例;
在實例上調用指定的方法;
銷毀這個實例;
可以將上面的步驟想象成下列 ECMAScript 代碼:
// 執行到第二行時 var str = new String("hello world"); str.length; str = null; // 執行到第三行時 var str = new String("hello world"); str.toUpperCase(); str = null;
經過此番處理,基本的字符串值就變得跟對象一樣啦。而且,上面的步驟同樣適用于 Boolean 類型的 Number 類型對應的布爾值和數字值。
嘿嘿,啰嗦了這么多,搞懂了嗎?
引用類型與基本包裝類型的區別引用類型與基本包裝類型的主要區別就是對象的生存期。
使用 new 操作符創建的引用類型的實例,在執行流離開當前作用域之前,會一直保存在堆內存中。而后臺自動創建的基本包裝類型的對象,則只存在一行代碼的執行瞬間,然后立即被銷毀。這意味著我們不能為基本類型的值添加屬性和方法。
看了上面的原理,再來看例子:
var str = "some text"; str.color = "red"; console.log(str.color); // undefined
在此,第二行表面上看是為 str 添加了 color 屬性,但是仔細回想上面的后臺執行的那 3 個步驟,會發現,第二行創建的 String 對象在添加了 color 屬性后,被銷毀了。執行到第三行時,第三行代碼又創建了自己的 String 對象,然而這個對象沒有 color 屬性。一切都顯得那么清晰。
為了與上面的例子形成對比,我們顯式地創建基本包裝類型的對象,代碼如下:
var str = new String("some text"); str.color = "red"; console.log(str.color); // red
書中有警告:除非絕對必要,否則不要顯式地創建基本包裝類型的對象,因為這種做法很容易讓人分不清自己是在處理基本類型還是引用類型的值。
var value = "25"; var number = Number(value); // 轉型函數 console.log(number); // 25 var obj = new Number(value); // 構造函數 console.log(typeof obj); // object console.log(obj); // Number {[[PrimitiveValue]]: 25}Boolean 引用類型
書中很嚴肅地說:理解基本類型的布爾值與 Boolean 對象之間的區別非常重要------當然,我們的建議是永遠不要使用 Boolean 對象。
Number 引用類型吐槽一下,segmentfault 好像不讓上傳本地的無聊表情包,所以只好外鏈過來了。喔草,我剛剛說了什么。。。
【MDN】傳送門---Number
var num = 1.2345678; num.toFixed(2); // 1.23 num.toPrecision(2); // 1.2 num.toExponential(2); // 1.23e+0String 引用類型
【MDN】傳送門---String
這個家伙的方法就很多了。
charAt()
concat()
slice()
indexOf()
trim()
toUpperCase()
toLowerCase()
match()
search()
replace()
.........
自己進門里面探索去吧!
Symbol 引用類型 (ES 6)【MDN】傳送門---Symbol
額,這個還沒怎么用過呢。但是這里還是有一點需要注意下:
var sym = new Symbol(); // TypeError: Symbol is not a constructor
為什么會這樣呢?這是因為圍繞原始數據類型創建一個顯式包裝器對象從 ECMAScript 6 開始不再被支持。 然而,現有的原始包裝器對象,如 new Boolean、new String 以及 new Number 因為遺留原因仍可被創建。
好了,就這樣結束吧!
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/80279.html
摘要:就像我寫書的過程一樣,每個開發者在學習函數式編程的旅程中都會經歷這個部分。類型在函數式編程中有一個巨大的興趣領域類型論,本書基本上完全遠離了該領域。在函數式編程中,像這樣涵蓋是很普遍的。 原文地址:Functional-Light-JS 原文作者:Kyle Simpson-《You-Dont-Know-JS》作者 關于譯者:這是一個流淌著滬江血液的純粹工程:認真,是 HTML...
摘要:詞法熟悉語法的開發者,箭頭函數在涉及綁定時的行為和普通函數的行為完全不一致。被忽略的作為的綁定對象傳入,使用的是默認綁定規則。使用內置遍歷數組返回迭代器函數普通對象不含有,無法使用,可以進行改造,個人博客地址 this詞法 熟悉ES6語法的開發者,箭頭函數在涉及this綁定時的行為和普通函數的行為完全不一致。跟普通this綁定規則不一樣,它使用了當前的詞法作用域覆蓋了this本來的值。...
摘要:強制類型轉換本章介紹了的數據類型之間的轉換即強制類型轉換包括顯式和隱式。強制類型轉換常常為人詬病但實際上很多時候它們是非常有用的。隱式強制類型轉換則沒有那么明顯是其他操作的副作用。在處理強制類型轉換的時候要十分小心尤其是隱式強制類型轉換。 前言 《你不知道的 javascript》是一個前端學習必讀的系列,讓不求甚解的JavaScript開發者迎難而上,深入語言內部,弄清楚JavaSc...
摘要:理解的函數基礎要搞好深入淺出原型使用原型模型,雖然這經常被當作缺點提及,但是只要善于運用,其實基于原型的繼承模型比傳統的類繼承還要強大。中文指南基本操作指南二繼續熟悉的幾對方法,包括,,。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。 怎樣使用 this 因為本人屬于偽前端,因此文中只看懂了 8 成左右,希望能夠給大家帶來幫助....(據說是阿里的前端妹子寫的) this 的值到底...
摘要:如果是聲明中的第一個詞,那么就是一個函數聲明,否則就是一個函數表達式。給函數表達式指定一個函數名可以有效的解決以上問題。始終給函數表達式命名是一個最佳實踐。也有開發者干脆關閉了靜態檢查工具對重復變量名的檢查。 你不知道的JS(上卷)筆記 你不知道的 JavaScript JavaScript 既是一門充滿吸引力、簡單易用的語言,又是一門具有許多復雜微妙技術的語言,即使是經驗豐富的 Ja...
閱讀 4312·2021-10-13 09:39
閱讀 489·2021-09-06 15:02
閱讀 3234·2019-08-30 15:53
閱讀 1046·2019-08-30 13:04
閱讀 2053·2019-08-30 11:27
閱讀 2019·2019-08-26 13:51
閱讀 2103·2019-08-26 11:33
閱讀 2908·2019-08-26 10:36