摘要:完整清單是中添加,此處不予介紹布爾值用來表示可能是真或假的值。結果抽象比較運算符在比較它們之前在類型之間進行自動轉換。中的隱式轉換稱為強制類型轉換,并在規范中定義。這些內置類型可用于在不同類型之間進行顯式轉換。
翻譯:瘋狂的技術宅
原文:https://www.valentinog.com/bl...
本文首發微信公眾號:前端先鋒
歡迎關注,每天都給你推送新鮮的前端技術文章
JavaScript 建立在一系列基本單元之上。你應該對其中的一些已經很熟悉了,比如字符串和數字:
var greet = "Hello"; var year = 89;
字符串和數字是該語言所謂“原語”的一部分。完整清單是:
String
Number
Boolean
Null
Undefined
Object
Symbol (ES6中添加,此處不予介紹)
布爾值用來表示可能是真或假的值。 null 是故意不去賦值,它通常被分配給一個變量,用于表示綁定完畢,稍后將填充有意義的內容。
var maybe = null;
然后才是 undefined,這意味著變量仍然沒有被附加上:
var name; console.log(name) undefined
null 和 undefined 看起來非常相似,但它們是兩個截然不同的實體,很多開發人員仍然不確定應該使用哪個。
如果要判斷 JavaScript 實例的類型,可以用 typeof 運算符。讓我們用字符串嘗試一下:
typeof "alex" > "string"
還有數字:
typeof 9 > "number"
用于布爾值:
typeof false > "boolean"
undefined:
typeof undefined > "undefined"
還有 null:
typeof null > "object"
結果令人驚訝! null 看起來像一個對象,但實際上它是 JavaScript 中的一個歷史性錯誤,自語言誕生就躺在那里了。 由于這些問題,JavaScript 一直聲名狼借。但這僅僅是個開始。
陌生的事情在 JavaScript 中,在兩種類型之間進行轉換時有一些奇怪的規則。讓我給你一些背景信息。先用 Python 舉一個例子。 在 Python 中執行以下指令:
"hello" + 89
會給你一個明確的錯誤:
TypeError: can only concatenate str (**not** "int") to str
而在 JavaScript 中,只有天空才是你的極限:
"hello" + 89
事實上給出:
"hello89"
如果我們嘗試向字符串添加數組,看起來會更加奇怪:
"hello" + []
將會得到
1. "hello"
還有
1. "hello" + [89]
會給你一個驚喜:
1. "hello89"
看起來這種轉換背后存在某種邏輯。它甚至適用于存在更多元素的 array :
1. "hello" + [89, 150.156, "mike"]
得到:
1. "hello89,150.156,mike"
這兩行 JavaScript 足以讓 Java 程序員逃離。但是這種行為在 JavaScript 中 100% 是又意義的。因此這種隱式轉換,也稱為強制類型轉換是非常值得探索的。
當一個數字變成一個字符串一些編程語言有一個叫做類型轉換的概念,這意味著:如果我想把一個數字或實例轉換為另一種類型,那么我必須使顯式轉換。它也適用于 JavaScript。請看以下示例:
var greet = "Hello"; var year = 89;
如果我想明確的進行轉換,可以在代碼中表明意圖:
var greet = "Hello"; var year = 89; var yearString = year.toString()
要么這樣做:
var greet = "Hello"; var year = 89; var yearString = String(year)
然后我可以連接兩個變量:
greet + yearString;
但是在 JavaScript 中有一種被稱為隱式轉換的微妙機制,由 JavaScript 引擎提供。該語言不會阻止我們對數字和字符串進行加法操作:
"hello" + 89
會得到:
"hello89"
但是這種轉換背后的邏輯是什么?你可能會驚訝地發現 JavaScript 中的加法運算符 + 會自動將兩個操作數中的任何一個都轉換為字符串,如果其中至少有一個是字符串的話!
你會發現更令人驚訝的是,這條規則在ECMAScript規范中一脈相承。 第11.6.1節 定義了加法運算符的行為,我在這里為你做了總結:
如果 x 是 String 或 y 是String,則返回 ToString(x),然后返回ToString(y)
這個花招只適用于數字嗎?并不是。 數組和對象也會受到相同的轉換:
"hello" + [89, 150.156, "mike"]
會得到:
"hello89,150.156,mike"
那么下面的代碼會得到怎樣的結果:
"hello" + { name: "Jacopo" }
要找到答案,你可以通過將對象轉換為字符串來進行快速測試:
String({ name: "Jacopo" })
將會得到:
"[object Object]"
所以我有一種感覺:
1. "hello" + { name: "Jacopo" }
會得到:
1. "hello[object Object]"
打住!這又是什么?
JavaScript 中 [object Object] 的含義是什么?“[object Object]” 是最常見的 JavaScript “怪癖”之一。
幾乎每個 JavaScript 實例都有一個名為 toString() 的方法,有些方法是由 Object.prototype.toString 提供的。
某些類型(如數組)實現了 toString() 的自定義版本,以便在調用方法時將值轉換為字符串。例如 Array.prototype.toString 會覆蓋 Object.toString()(也稱為 method shadowing)。
但是當你在普通的 JavaScript 對象上調用 toString() 時,引擎會給出“[object Object]”,因為 Object.toString() 的默認行為是由實體類型(在這種情況下為Object)返回字符串 object 。
現在讓我們把注意力集中在 JavaScript 比較運算符上,它們與算術運算符一樣奇怪。
等于還是不等于?JavaScript 中有兩個主要的比較運算符。
第一個我們稱之為“弱比較”。這是抽象比較運算符(雙等號):==。
另一個是“強比較”,可以通過三等號進行識別:=== 也稱為嚴格比較運算符。它們兩者的行為方式完全不同。
來看一些例子。首先,如果我們將兩個字符串與兩個運算符進行比較,我們得到相同的結果
"hello" == "hello" > true "hello" === "hello" > true
看上去一切都還好。
現在嘗試比較兩種不同的類型,數字和字符串。首先是“強比較”:
1. "1" === 1 2. false
這說得通!字符串“1”與數字1是不同的。但是“弱比較”會發生什么?
1. "1" == 1 2. true
居然是true!它沒有任何意義,除非這種行為與我們之前看到的隱式轉換有關。
如果適用相同的規則怎么辦?沒錯! ECMAScript spec 再次罷工。結果抽象比較運算符在比較它們之前在類型之間進行自動轉換。這是規范的摘要:
比較 x == y 執行如下:如果 x 是 String 且 y 是Number,則返回比較結果 ToNumber(x)== y
規范說:如果第一個操作數是一個字符串,第二個操作數是一個數字,那么將第一個操作數轉換為數字。有趣。
JavaScript 規范充滿了這個瘋狂的規則,我強烈鼓勵大家對它深入挖掘。
在此期間除非你有充分的理由否則在 JavaScript 代碼中避免使用抽象比較運算符。你以后會感謝自己的。
那么“強勢比較”怎么樣?規范中的說 嚴格相等比較在把值與三等 === 進行比較之前沒有進行自動轉換。在代碼中使用嚴格相等比較可以避免愚蠢的 bug。
總結JavaScript 中有七個構建塊,即 String,Number,Boolean,Null,Undefined,Object 和 Symbol。這些類型被稱為基元。
JavaScript 開發人員可以使用算術和比較運算符來操作這些類型。但是我們要特別注意加法運算符 + 和抽象比較運算符 ==,它本質上傾向于在類型之間進行轉換。
JavaScript 中的隱式轉換稱為強制類型轉換,并在 ECMAScript 規范中定義。無論什么時候你的代碼都要使用嚴格的比較運算符 === 而不是 ==。
作為最佳實踐,當你打算在兩種類型之間進行轉換時,請務必明確操作。JavaScript 有一堆內置對象,它們反映了原始類型:String,Number,Boolean。這些內置類型可用于在不同類型之間進行顯式轉換。
本文首發微信公眾號:前端先鋒 歡迎掃描二維碼關注公眾號,每天都給你推送新鮮的前端技術文章 歡迎繼續閱讀本專欄其它高贊文章:12個令人驚嘆的CSS實驗項目
世界頂級公司的前端面試都問些什么
CSS Flexbox 可視化手冊
過節很無聊?還是用 JavaScript 寫一個腦力小游戲吧!
從設計者的角度看 React
CSS粘性定位是怎樣工作的
一步步教你用HTML5 SVG實現動畫效果
程序員30歲前月薪達不到30K,該何去何從
7個開放式的前端面試題
React 教程:快速上手指南
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103437.html
摘要:強制類型轉換作為程序員,你一定獲取過當前系統的時間戳。比如對于變量而言,此次強制類型轉換是隱式的。然而則是非常典型的顯式強制類型轉換。隱式強制類型轉換大部分被詬病的強制類型轉換都是隱式強制類型轉換。 JavaScript 強制類型轉換 作為 JavaScript 程序員,你一定獲取過當前系統的時間戳。在 ES5 引入 Date.now() 靜態方法之前,下面這段代碼你一定不會陌生: v...
摘要:如果有并且返回基本類型值,再使用該值進行強制類型轉換。四寬松相等和嚴格相等允許在相等比較中進行強制類型轉換,而不允許。這時最好用來避免不經意的強制類型轉換。這兩個原則可以讓我們避開幾乎所有強制類型轉換的坑。 一、類型轉換規則 1.ToString 對于普通對象來說,除非自行定義toString方法,否則就會調用Object.prototype.toString()方法,如果對象有自己的...
摘要:第三章強制類型轉換強制類型轉換將其他數據類型轉換成類型將其他數據類型轉換為強制類型轉換指將一個數據類型強制轉換為其他數據類型類型轉換主要是指將其他數據類型轉換為將其他數據類型轉換為方式一調用被轉換數據的方法該方法不會影響到原變量但是注 ??????????????????????????????第三章強制類型轉換 ???????Cast type:強制類型轉換 ??????將其他數據類...
摘要:拆封想要等到封裝對象中基本類型值,我們可以使用方法獲取。值類型轉換上面兩種方式,第一種我們稱為顯示強制類型轉換第二種稱之為隱式強制類型轉換。介紹強制與隱式類型轉換時,我們需要掌握對字符串數字和布爾類型的轉換規則。 前面兩章介紹了幾大數據類型以及值類型,接下來的這個知識點,我覺得它對于javascript程序員來說是很重要的, 認識封裝對象 在開始之前,我們先看一個例子,以便之后更輕松的...
摘要:隱式強制類型轉換隱式強制類型轉換指的是一些特殊的操作的副作用來實現類型轉換,而非和等函數來實現值的類型轉換。下面幾種情況會發生布爾值的強制類型轉換語句中的天健判斷表達式。 引言 來到北京已經有4個年頭了,做過一些測試、打雜、前端的工作之后,最后還是選擇了前端的工作。現階段主要還是在寫業務代碼,代碼質量,工作效率就顯得尤為重要。【學以致用】這個系列主要記錄一些平時工作、學習遇到的一些問題...
閱讀 2755·2019-08-30 15:53
閱讀 521·2019-08-29 17:22
閱讀 1040·2019-08-29 13:10
閱讀 2307·2019-08-26 13:45
閱讀 2751·2019-08-26 10:46
閱讀 3202·2019-08-26 10:45
閱讀 2504·2019-08-26 10:14
閱讀 467·2019-08-23 18:23