我喜歡JavaScript.它是一門集強大與靈活於一身的語言,當然前提是你得知道如何去正確的使用它.一旦你真正掌握了JavaScript,你幾乎可以用它來做任何事情,而且能做的既快又好.
如果你認為JavaScript太簡單或者太低級, 那麼你已經掉入了一個陷阱. 並且你會發現有很多人已經掉入了這樣的陷阱中了.這些所謂的JavaScript開發者也許會告訴你,一些其他的語言“X” 更好.
他們甚至會說,如果有一個將能將X語言轉換為JavaScript的系統,那就太好了.想要逃出這個陷阱一直到真正的掌握JavaScript需要付出很多的努力和貢獻.相信我,因為從1997年開始,我就已經在學習JavaScript了.
我是透過學習官方標準文檔掌握了JavaScript的所有高級知識,所以你也可以通過這種方法來掌握完整的語言知識.如果你的職稱中包含了“JavaScript開發者”,那麼你應該這樣做.
在本篇部落格中,我將會給出一個短小的JavaScript程式碼片段,然後讓你給出這段程式碼的正確輸出.如果你是一個JavaScript開發者,你會發現這樣的題目真是太簡單了.如果你仍然處在學習這門語言的過程中,你可能會遇到一些困難,不過你可以好好讀一下代碼下面的解釋部分.
下面的JavaScript代碼顯示了一個彈出框.彈出框中顯示什麼?
var five = 5;
five.three = 3;
alert(five + five.three);
跳到本篇文章的最後查看正確的答案.接下來是為什麼會有這樣的結果的解釋.
在JavaScript中,一共有六種資料型別: Object, Number, String, Boolean, Null, 以及Undefined.
物件(Objects)型別包含了陣列(arrays), 函數(functions),以及其他的一般物件.數字( Numbers)型別可以是整數(integers)或浮點數(floating point)型別以及特殊值NaN和Infinity. 字串(Strings)型別包含了空字串, ”". 布林值(Booleans)型別只有兩個值:true和false.最後兩個基本資料型別有點特殊:Null型別只有一個值:null, Undefined型別只有一個值:undefined.所有Object除外的型別都稱為「原始值(primitive)」.JavaScript變數的類型不是在定義的時候明確指定的,還是在腳本運行的時候自動推斷出來的.在上面的代碼中,名為five的變量是Number類型的,因為它被賦值了一個Number字面量5.
和其他的電腦程式語言類似,JavaScript也會隱式的將某個值的型別轉換成適合對該值進行操作的運算子的型別.和其他語言不同的是, JavaScript會非常積極地做這些轉換.比如表達式”5″ – “3″的運算結果是數字2,因為減號運算符會把兩邊的操作數全部轉換為數字再進行運算.如果一個操作數不能被轉換為數字,則會使用NaN ( “Not a Number”)來替代.例如表達式”5″ – “Fred”會被隱式的轉換為5 – NaN,則運算結果也會是NaN.
一套完整的隱式轉換規則並不是十分複雜,你只需要知道每個操作符需要什麼類型的操作數.
任意值轉換為原始值遵循這樣的規則“任意值轉換為原始值”. 其中對像到原始值的轉換比較複雜:如果操作數的型別必須是Number型別,這表示JavaScript引擎會呼叫物件的valueOf()方法,如果傳回的結果仍然不是一個原始值,則會呼叫物件的toString()方法轉換成一個String型別的值。如果運算元的型別必須是String型別,則會先呼叫物件的toString()方法,如果傳回的結果不是一個原始值,再呼叫物件的valueOf()方法.不管那種情況,如果最終的轉換結果仍然不是一個原始值,則拋出異常.
如果操作數的類型必須是一個數字,但該操作數的實際類型是:
Object:
該值首先被轉換成原始值,如果轉換的結果不是一個數字,則會進入下面的轉換分支.
String:
字串型別的值會依照通常的JavaScript規則轉換成數字型別
Boolean:
如果值為true,轉換為1,否則轉換為0
Null :
0
Undefined:
NaN
如果操作數的類型必須是一個字串,但該操作數的實際類型是:
Object:
該值首先被轉換成原始值,如果轉換的結果不是原始值,如果轉換的結果不是一個字串,則會進入下面的轉換分支.
Number:
數字直接轉為字串, 例如」123″ or ”12.34″
Boolean:
轉為」true”或”false”
ull
「null」
Undefined:
「undefined」
如果運算元的型別必須是布林值,但此運算元的實際型別是:
Object:
:true
:true則轉為false,否則轉為true (譯者註:NaN也會轉為false)
String:
如果值為一個空字符串”",則轉為false,否則轉為true
Null:
false
Undefined:
false
如果運算元的型別必須是物件值,但該運算元的實際型別是:
Number:
使用包裝物件類型Number來包裝原始值,new Number(value),new Number
String:
使用包裝物件類型String來包裝原始值,new String(value)
Boolean:
使用包裝物件類型Boolean來包裝原始值,new Boolean(value)
Null:
:
拋出異常
現在所有的轉換規則已經很清晰了,讓我們回到最初的例子中.
var five = 5;
five.three = 3;
alert(five + five.three);
正如我們前面提到的,第一行程式碼創建了一個名為five,類型為Number的變數.
當用屬性訪問符作用在變數five上時,它的值會轉換為Object類型.這種操作稱之為“包裝”,並且依賴於Number構造函數,該構造函數會產生一個對象,而不是一個原始值.第二行程式碼實際上等同於下面的程式碼:
(new Number(five)).three=3;
正如你看到的,我們並沒有將新生成的Number物件的引用保存到一個變量中.在該表達式運行過後,被添加three屬性的這個物件會被丟棄.而five變數的值沒有任何變化.
第三行程式碼中的表達式five.three會再一次創建一個Number物件.這個新的物件並沒有three屬性,所以回傳了特殊值undefined.結果等同於:
alert(5+undefined);
加法運算子會把兩邊的運算元全部轉換為數字.在本例中,undefined會被轉換為NaN,也就成了:
alert(5+NaN);
這也就解釋了為什麼最後的彈出框中僅僅顯示了一個NaN.
(譯者註:還差最後一步隱式轉換,在進行alert()的時候,NaN會被自動轉換為”NaN”)
評論:
jerone:
你這篇文章所講的內容只是JavaScript的一部分,確切的說只包含了ECMAScript.除了這些,JavaScript還包含了DOM,也就是說還有Node, Element, HTMLElement等更多的數據類型.
作者回复:
Node, Element 以及HTMLElement 都不是數據類型,就像Array, Date 和RegExp一樣,他們都屬於物件(Object)類型.
Marcus Pope:
我認為應該指出正確的編寫方式,下面的程式碼才能夠正常運作
var five = new Number(5);
alert(five); // 5
five.three = 3;
alert(five + five.three); //8
我還認為最好應該用「number」來指數字原始值,而用「Number」來指數字類型的包裝物件,這樣才能減少讀者的困惑.這也是在JavaScript中使用typeof操作符來查看這些值的內部類屬性時顯示的字符串.(譯者註:這裡指的是typeof 5 === “number” )
ACRESTAN:
是啊,這篇文章很讓人困惑,就是因為作者使用了大寫字母開頭的類型字符串來描述原始值…
比如這句“the first line creates a variable called five whose type is Number ”,這是不對的!因為你的程式碼就證明了這一點.
metadings:
還有第七種資料型態,JavaScript中最重要的型別:函數(Function).在JavaScript中,使用函數可以創建新的物件,所以原始值類型和函數型別還是有差別的.
var Project = function () { };
// Project instanceof Function === true
// Project instanceof Object === true
// (typeof Project === 'function') === true
var o = new Project();
// o instanceof Project === true
// o instanceof Object === true
// (typeof Project === 'object') === true
請仔細閱讀這個連結http://metadea.de/V/，看看我是怎麼寫出真正的JavaScript類函數的.(譯者註:還有一句沒翻譯,看不明白,覺的這個人在扯蛋.)
作者回覆:
很顯然函數在JavaScript中非常重要,值得用單獨的文章來講解它,但函數不是另外一種數據類型.函數只是一種特殊的物件.雖然特殊,但仍是物件.
由許許多多不同的建構函式所建立的物件們都繼承了同一個型別:Object.這很容易偵測到:如果Object(a) === a,則a是一個物件類型,而不是其他原始值類型.
ulu:
這篇文章正好進一步證明了JavaScript不只是一個最強大的語言,同時也是最令人困惑的語言.應該不惜一切代價避免使用它.總有一天,會有一個更人性化的語言集成在所有的主流瀏覽器中,我希望在我有生之年能夠趕上.
作者回复:
當你手中拿著一把錘子時,所有事物看上去都像釘子.當你認為JavaScript很讓人迷惑時,任何特性都能成為你的證據.
Dave Chapman :
這種類型的編碼錯誤正是我們為什麼需要一個更好的能夠在我們碼字的同時,在運行程式碼之前進行語法檢查的IDE的原因.例如.在closure compiler中運行例子中的代碼會產生如下的警告信息:
“JSC_INEXISTENT_PROPERTY: Property three never defined on Number at line 4 character 13:
alert(five + five.three);」
(譯者註:closure compiler是Google的程式碼壓縮器或稱為編譯器.https://developers.google.com/closure/compiler/)
google.com/closure/compiler/)
谷歌
simonleung :
一個數字可以是「object」類型的,也可以是「number」類型的.
當用在條件語句中或其他需要轉換為布林值的地方,這兩種類型的數字會產生不同的結果,例如.
Number(0)會得到true,因為Number(0)是一個物件,而0顯然會得到false.🎜(譯者註:這裡他說錯了.Number作為函數只是一個型別轉換函數,返回的仍然是原始值,只有用new Number(0),Number才算是一個建構子,回傳的才是物件)🎜另外一個,在null上進行typeof操作,返回”object”,但它不是真正的對象,null是假值,會被轉換為false.
