【相關推薦:javascript影片教學、web前端】
本文將探討一個極為有趣的概念,也就是基礎類型的屬性方法。怎麼樣,是不是有點懵?且聽我慢慢道來~
在其他物件導向的程式語言中,例如Java
、 C++
,屬性是物件的獨有概念,基礎類型就是基礎類型,是不存在屬性方法概念的。
沒錯,又是JavaScript
的餿主意,其引擎允許我們像操作物件一樣使用屬性方法操作基礎類型的資料。
在講解這個奇怪的特性之前,我們要先先明確基礎類型和物件類型之間的差異是什麼?
JavaScript
基礎類型中的中一種值;JavaScript
中存在7
種基礎類型,分別是: String
、 Number
、 Boolean
、 BigInt
、 Symbol
、 null
和undefined
;{ }
創建,能儲存多個值;JavaScript
還有其他類型的對象,例如函數;面向對像中會涉及,引入對象的一個關鍵特性是封裝,它可以把各種亂七八糟的資料、方法統一的儲存在一個對象中,從而降低使用的複雜度。
例如:
let user = { name : "xiaoming", hello() { console.log(`你好,我是${this.name}`); }}user.hello();
我們把物件user
的屬性和方法封裝成了一個對象,這樣在使用的時候就非常簡單,我們只需要使用obj.attr
的方式就能呼叫方法或屬性。
但是,這麼做是由額外的開銷的(物件導向有額外的開銷),這也是物件導向的語言C++
相比於C
慢的地方。
基礎類型作為物件使用有兩個難以調和的問題:
"abc".toUpperCase()
;JavaScript
解決以上問題的方式相當的「和稀泥」:
String
、 Number
、 Boolean
和Symbol
類型的方法和屬性;以上規則的意思是,基礎類型仍然是基礎類型,但是呢,如果我們想存取基礎類型的方法和屬性,就會把基礎類型包裝成物件(物件包裝器),等存取完了再銷毀。講真,聽起來多少有點扯。
舉例:
let name = "Trump";console.log(name.toUpperCase());//存取基礎類型的方法
以上程式碼的執行結果如下:
看起好像也沒什麼大問題,但是,其中發生了很多事情,我們需要知道以下幾點:
name
是個字串基礎類型,它本身沒啥特別的地方;name
屬性方法的時候,創建了一個包含字串值的特殊對象,這個物件有toUpperCase
方法;toUpperCase
傳回一個新的字串;變數本身的值並沒有改變,如下:
雖然解決方法充滿了妥協(餿主意),但是,結果還是好的,達成的成就如下:
理論上雖然如此,但實際上JavaScript
引擎高度優化了這個過程,我懷疑它根本沒有創建額外的物件。只是在口頭上表示自己遵循了規範,好像真的搞了個臨時對象。
本文只是簡單的介紹基礎類型方法的概念,並不對各種方法進行講解,伴隨著教程不斷深入,會逐步涉及大量的方法。這裡只簡單的列舉基礎類型常用的一些方法和屬性。
不同的基礎類型,擁有不同的屬性方法,以下分類列舉:
length
屬性,傳回字串長度
console.log("abc".length);
以上程式碼結果如下:
indexOf(ch)
方法,傳回字串中第一個字元ch
的下標
console.log("abc".indexOf('b'));console.log("abc".indexOf('d'));
程式碼執行結果如下:
當字元存在於字串返回下標(從0
開始計),如果找不到就回傳-1
。
concat(str)
方法,拼接兩個字串
let str1 = "hello ";let str2 = "world!";console.log(str1.concat(str2));console.log(str1);console.log(str2 );
程式碼執行結果如下:
replace(str1,str2)
方法,使用str2
取代str1
let str = "javascript";console.log(str.replace('java','996'));console.log(str);
程式碼執行結果如下:
toFixed(num)
方法,四捨五入小數到指定精度
console.log(9.33333333.toFixed(3));console.log(9.3333333.toFixed(0));
程式碼執行結果如下:
toString()
方法,轉數字為字串
3.14.toString();//轉為'3.14'console.log((8).toString(2));//轉為二進位'1000'console.log(( 9).toString(2));//轉為二進位'1001'console.log((996).toString(16));//轉為16進位字串'3e4'
程式碼執行結果如下:
toExponential()
方法,轉為指數計數法
console.log(3.1415926.toExponential());console.log(3.1415926.toExponential(2));console.log(3.1415926.toExponential(3));
執行結果如下:
後繼章節會展示更多的方法,這裡就不過的贅述。
和Java
一樣, JavaScript
可以透過new
操作符,明確的為基礎類型創建“物件包裝器”,這種做法是極其不推薦的,這裡提出,僅為了知識的完整性。
這種做法有問題,舉例如下:
let num = new Number(0);console.log(typeof num);console.log(typeof 0);
程式碼執行結果如下:
也或者,在判斷中會出現混淆:
let zero = new Number(0);if (zero) { // zero 為true,因為它是一個物件console.log('true');}
程式碼執行結果如下:
同時,大家不要忘了,不含new
(關鍵字)的String/Number/Boolean
函數可以將一個值轉換成對應的型別:轉成字串、數字或布林值(原始型別)。
例如:
console.log(typeof Number('123'));
注意:
null
和undefined
兩種類型沒有任何方法
除null
和undefined
以外的基礎類型都提供了許多有用的方法;
雖然JavaScript
使用了妥協的實作方式,但取得了較為滿意的結果,以較低的成本實現了基礎類型的屬性和方法調用;
【相關推薦:javascript視頻教程、web前端】
以上就是JavaScript怎麼實現基礎類型和對像一樣有屬性和方法的詳細內容,更多請關注源碼網其它相關文章!