摘要:看到下面的題,是不是已經蒙了,讀完這篇文章,就能順利通關了沒有輸出數據類型判斷數據類型數據類型一共有種,類型判斷特殊情況由此可以看出,不能區分數組,和對象運算符返回一個布爾值,表示對象是否為某個構造函數的實例。
前言
無論筆試還是面試,總會問到數據類型和隱式轉換。今天徹底整理一下這塊的知識,希望對大家有幫助。
看到下面的題,是不是已經蒙了,讀完這篇文章,就能順利通關了
console.log([] == 0) //true console.log(![] == 0) //true console.log([] == ![]) //true console.log([] == []) //false console.log({} == {}) //false console.log({} == !{}) //false console.log([] == false) //true console.log({} == false) //false if([]) {console.log(3)} //3 if([1] == [1]){console.log(4)} //沒有輸出 console.log("2" > 10) //false console.log("2" > "10") //true數據類型判斷 數據類型
js數據類型一共有7種,undefined、 null、 boolean 、string、 number、 object、 Symbol
類型判斷 typeoftypeof undefined //undefined typeof true //boolean typeof 42 //number typeof "42" //string typeof { life: 42 } //object let s = Symbol(); typeof s //symbol //特殊情況 typeof [1,2,3,4]// object typeof null //object typeof new Date() //object typeof function () {} //function
由此可以看出,typeof不能區分數組, null和對象
Object.prototype.toString.calllet getType=Object.prototype.toString; getType.call(undefined) //[object Undefined] console.log(getType.call(true)) //[object Boolean] console.log(getType.call(42)) //[object Number] console.log(getType.call(Symbol()))//[object Symbol] console.log(getType.call([1,2,3,4])) //[object Array] console.log(getType.call(null))//[object Null] console.log(getType.call(new Date())) //[object Date] console.log(getType.call(function () {} )) //[object Function]instanceof
instanceof運算符返回一個布爾值,表示對象是否為某個構造函數的實例。
instanceof運算符的左邊是實例對象,右邊是構造函數。它會檢查右邊構建函數的原型對象(prototype),是否在左邊對象的原型鏈上。
new Date instanceof Date //true [1,2,3] instanceof Array //true
instanceof運算符只能用于對象,不適用原始類型的值。
constructor 屬性prototype對象有一個constructor屬性,默認指向prototype對象所在的構造函數。
function P() {} P.prototype.constructor === P // true
[1,2].constructor === Array //true "123".constructor === String //true面試常問 怎么判斷是不是數組
instanceof、constructor、Object.prototype.toString.call、Array.isArray
[1,2] instanceof Array //true [1,2].constructor === Array //true Object.prototype.toString.call([1,2]) === "[object Array]" //true Array.isArray([1,2]) //true如何判斷一個對象是不是空對象
轉換成json字符串判斷
JSON.stringify({}) == "{}"
for in 循環判斷
let isEmptyObject = function(obj) { for (let key in obj) { return false; } return true; } console.log(isEmptyObject(obj));//true
使用ES6的Object.keys()
Object.keys({}).length === 0類似的數組轉化成數組
類數組和數組都可以讀寫,獲取長度,遍歷,但是類數組不能調用數組的方法,比如push等
Array.prototype.slice.call(arguments)
或者Array.from(arguments)
字符串翻轉"abc".split("").reverse().join("")
字符串和數組轉換["a", "b", "c"].join("") //"abc"
"abc".split("") //["a", "b", "c"]類型轉換 顯示類型轉換 轉成數字,Number()、parseInt()、parseFloat()
// 數值:轉換后還是原來的值 Number(324) // 324 // 字符串:如果可以被解析為數值,則轉換為相應的數值 Number("324") // 324 // 字符串:如果不可以被解析為數值,返回 NaN Number("324abc") // NaN // 空字符串轉為0 Number("") // 0 // 布爾值:true 轉成 1,false 轉成 0 Number(true) // 1 Number(false) // 0 // undefined:轉成 NaN Number(undefined) // NaN // null:轉成0 Number(null) // 0 //對象轉化 Number({a: 1}) // NaN Number({}) //NaN //數組 Number([1, 2, 3]) // NaN Number([5]) // 5 Number([]) //0
Number方法參數是對象時轉換規則
第一步,調用對象自身的valueOf方法。如果返回原始類型的值,則直接對該值使用Number函數,不再進行后續步驟。
第二步,如果valueOf方法返回的還是對象,則改為調用對象自身的toString方法。如果toString方法返回原始類型的值,則對該值使用Number函數,不再進行后續步驟。
第三步,如果toString方法返回的是對象,就報錯。
轉換規則示例:
var obj = {x: 1}; Number(obj) // NaN // 等同于 if (typeof obj.valueOf() === "object") { Number(obj.toString()); } else { Number(obj.valueOf()); }
先使用valueOf返回了對象本身,再代用toString()返回了"[object Object]"
注意:
任何涉及NaN的操作都返回NaN,NaN和任何值不相等
除了以下值的轉換結果為false,其他的值全部為true。
false, "", 0, NaN, null, undefined
String函數可以將任意類型的值轉化成字符串(1)原始類型值
//數值:轉為相應的字符串。 String(123) // "123" //字符串:轉換后還是原來的值。 String("abc") // "abc" //布爾值:true轉為字符串"true",false轉為字符串"false"。 String(true) // "true" //undefined:轉為字符串"undefined"。 String(undefined) // "undefined" //null:轉為字符串"null"。 String(null) // "null"
(2)對象
//String方法的參數如果是對象,返回一個類型字符串 String({a: 1}) // "[object Object]" //如果是數組,返回該數組的字符串形式。 String([1, 2, 3]) // "1,2,3"
String方法背后的轉換規則,與Number方法基本相同,只是互換了valueOf方法和toString方法的執行順序。
隱式類型轉換 自動轉化為布爾值if條件,while,
自動轉換為字符串主要發生在字符串加法,一個值為字符串,另一個非字符串,則后者直接轉為字符串
"5" + 1 // "51" "5" + true // "5true" "5" + {} // "5[object Object]"自動轉化為數值
除了加法運算符(+)有可能把運算子轉為字符串,其他運算符都會把運算子自動轉成數值。
++/--(自增自減運算符) + - * / %(算術運算符) + > < >= <= == != === !=== (關系運算符)
"5" - "2" // 3 "5" * "2" // 10 true - 1 // 0 false / "5" // 0 //"abc"轉為數值為NaN,NaN任何運算都是NaN "abc" - 1 // NaN //null進行Number運算轉成0 null + 1 // 1 //undefined轉為數值時為NaN undefined + 1 // NaN== 運算符
(1)原始類型的數據會轉換成數值類型再進行比較。
1 == true // true // 等同于 1 === Number(true) 0 == false // true // 等同于 0 === Number(false) 2 == true // false // 等同于 2 === Number(true) "true" == true // false // 等同于 Number("true") === Number(true) // 等同于 NaN === 1 "" == 0 // true // 等同于 Number("") === 0 // 等同于 0 === 0 "" == false // true // 等同于 Number("") === Number(false) // 等同于 0 === 0 "1" == true // true // 等同于 Number("1") === Number(true) // 等同于 1 === 1 " 123 " == 123 // true // 因為字符串轉為數字時,省略前置和后置的空格
(2)對象與原始類型值比較
對象(這里指廣義的對象,包括數組和函數)與原始類型的值比較時,對象轉化成原始類型的值,再進行比較。
[1] == 1 // true // 等同于 Number([1]) == 1 [1] == "1" // true // 等同于 Number([1]) == Number("1") [1] == true // true // 等同于 Number([1]) == Number(true)實戰練習
//true,空數組valueOf還是空數組,toString()轉成得到空字符串,空字符串調用Number轉成0 console.log([] == 0) //true //true,非的運算級別高,空數組轉為布爾值為true,所以![]得到的false,Number轉換為0, 最后結果還是true console.log(![] == 0) //true //true,前面是調用valueOf()后調用toString()轉成false,后邊是非轉成false console.log([] == ![]) //false,2個數組放在堆里面,棧中存儲的是地址 console.log([] == []) //引用類型存儲在堆中,棧中的是地址,所以是false console.log({} == {}) //{}.valueOf().toString()得到的是[object, Object], !{}得到的是false,Number轉換后不相等 console.log({} == !{}) //數組的valueOf().toString()后為空,所以是真 console.log([] == false) //true //因為對象調用valueOf后為{}, toString后轉為[object, Object],Number后是NaN, //任何涉及NaN的操作都返回NaN,NaN和任何值不相等 console.log({} == false) //false //空數組的boolean值為true if([]) {console.log(3)} //3 //2個數組的棧地址不同 if([1] == [1]){console.log(4)} //沒有輸出 //false,轉成2>10 console.log("2" > 10) //都是字符串,按照字符串的unicode轉換,"2".charCodeAt() > "10".charCodeAt = 50 > 49 console.log("2" > "10") //都是字符串,按照字符串的unicode轉換 console.log("abc" > "b") //false
參考:http://javascript.ruanyifeng....
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/100517.html
摘要:包裝對象即,與數值字符串布爾值相對應的三個原生對象。顯示類型轉換強制轉換即,顯示調用函數進行類型轉換。返回對象的字符串數值或布爾值表示,通常與返回的值相同。 一、類型與包裝對象 1. 類型 原始類型: number string boolean null undefined Symbol 對象類型: Object Array Function 原始類型(基本類型)和對象類型(引...
摘要:如何讓根據拆箱轉換,以及的隱式轉換,可以如下寫為什么計算機中所有的數據都是以二進制存儲的,所以在計算機計算時要把數據先轉換成二進制進行計算,然后把計算結果轉換成十進制。會存在精度丟失問題和的二進制都是以無線循環的小數的二進制的二進制 本想著記筆記里,但是筆記里沒有分類,還是以文章的形式,當個人總結吧,這一篇就當作JS基礎篇的記錄吧,有修改的和新增的持續更新~ 關于JS的一些小技巧 1:...
摘要:引用數據類型引用數據類型值指保存在堆內存中的對象。訪問方式是按引用訪問。數據類型檢測操作符是檢測基本類型的最佳工具。未定義布爾值字符串數值對象或函數用于檢測引用類型,可以檢測到它是什么類型的實例。 前端學習:教程&開發模塊化/規范化/工程化/優化&工具/調試&值得關注的博客/Git&面試-前端資源匯總 歡迎提issues斧正:數據類型 回味,無窮! 數據類型定義 數據類型分類 基本數據...
摘要:即在這個隱式強制類型轉換中,即不會等于也不會等于。按照正常人類的腦回路,應該是將先轉換為布爾值,然后再將兩個布爾值對比。為什么和就可以避開操作符的坑呢它們進行強制類型轉換時的轉換規則又是怎樣的。 在js中,類型轉換是一個被非常多人詬病的地方。新手看了會發矇,老手看了會頭疼。 類型轉換,又成為強制類型轉換,主要區分為顯式強制類型轉換和隱式強制類型轉換 按我理解,類型轉換的意思就很明顯,就...
摘要:業務越復雜,邏輯就越復雜,判斷就越多比較判斷比較判斷是比較兩個值,返回一個布爾值,表示是否滿足比較條件。對于非布爾值的數據,取反運算符會自動將其轉為布爾值。 前端學習:教程&開發模塊化/規范化/工程化/優化&工具/調試&值得關注的博客/Git&面試-前端資源匯總 歡迎提issues斧正:========== JavaScript-判斷 代碼中,多多少少會有判斷語句。業務越復雜,邏輯就越...
閱讀 3268·2021-09-23 11:55
閱讀 2609·2021-09-13 10:33
閱讀 1668·2019-08-30 15:54
閱讀 3097·2019-08-30 15:54
閱讀 2364·2019-08-30 10:59
閱讀 2370·2019-08-29 17:08
閱讀 1805·2019-08-29 13:16
閱讀 3589·2019-08-26 12:25