JavaScript中的隱式型別轉換
最近在學習渡一教育的JavaScript精品課,成哥講的還是很棒的,開這個系列記錄下學習筆記
本次學習筆記,對應web前端開發JavaScript精英課js的第六課時
目錄
一.is NaN()
當呼叫is NaN()方法時,會隱式的把呼叫者以Number(xxx)的方式轉換為number型別,
需要注意的是,轉換時不會改變呼叫者的資料型別
<script> var a = "abc"; console.log(isNaN(a) + " : " + typeof(a)); // true : string 不會改變原型別 console.log(isNaN(null)); // false </script>
還有一點就是Number(null) 得到的返回值為0,因此isNaN(null)的返回值為false
二.++ -- 自增自減運算子
當使用自增自減運算子時,無論是b++還是++b都會首先呼叫Number(b)轉換為number型別
且因為這是直接對原引數操作,會改變原引數的資料型別
<script> var b = "123"; console.log(typeof(b)); // String console.log(++b); // 124 console.log(--b); // 123 console.log(typeof(b)); // Number b = "abc"; console.log((b++) + " : " + typeof(b)); // NaN number 會改變原型別 </script>
還有一點特殊情況就是,如最後的 console.log((b++) + " : " + typeof(b)); 儘管“abc”轉換為Number失敗了,變為了NaN,但是其資料型別依然是number
三. + - (一元正負)
<script>
var c = +"abc";
console.log(c + " : " + typeof(c)); // NaN number
c = -"abc";
console.log(c + " : " + typeof(c)); // NaN number
</script>
沒啥好說的,加了+ / -就是相當於正數和負數,隱式呼叫Number(xxx),轉換為了number型別
四. + (連線符)
這個就更加沒啥好說的了,學過Java再熟悉不過 就一個字串拼接
<script>
var d = "abc";
var d1 = 123;
console.log((d+d1) + " : " + typeof(d1)); // abc123 number 不會改變原型別
</script>
五. - * / % 運算子
var e = "3" * 2; 在控制檯除錯下會發現等於6,其實本質上也是使用Number(xxx)隱式轉換字串為number型別了,具體可看下面例子
<script>
var e = "abc";
var e1 = e - 1;
var e2 = e * 1;
var e3 = e / 1;
var e4 = e % 1;
console.log(e1 + ":" + typeof(e1)); // NaN number
console.log(e2 + ":" + typeof(e2)); // NaN number
console.log(e3 + ":" + typeof(e3)); // NaN number
console.log(e4 + ":" + typeof(e4)); // NaN number
</script>
e1 e2 e3 e4均被轉換為number型別了
六. > < >= <=
若字串的內容為數字,與另外一個數字比較 那麼字串內容為數字的字串會被Nunber(xxx)隱式轉換為number型別再比較
若字串與字串比較 則會從首個字元開始比較unidode碼順序
需要注意的是下面第一種情況 數字和字串內容非數字的字串相比返回值為false,因為Number()會把它轉為NaN 無法比較
<script>
// 注意數字和非數字字串比較 如下 會變這樣3 > Number("!"); 而和NaN自然無法比較 什麼都是false
console.log(3 > "!");
// 當字串是數字 和數字比較 原理同上
console.log(3 > "2"); // true
// 特殊的
console.log("true > 'a' --- " + (true > "a")); // false
console.log("true < 'a' --- " + (true < "a")); // false
console.log("true == 'a' --- " + (true == "a")); // false
</script>
七. == !=
若與數字比較則,會隱式轉換為數字 無論是字串形式的數字還是普通數字
需要注意的是最後兩個 false == "" 返回值為true 以及 NaN == NaN 返回值為false
<script>
// 與數字比較則會隱式轉換為數字 無論是字串形式的數字還是普通數字
console.log(1 == true); // true
console.log(0 == false); // true
console.log(3 == "3"); // true
console.log("false == undefined --- " + (false == undefined)); // false
console.log("false == null --- " + (false == null)); // false
console.log("false == NaN --- " + (false == NaN)); // false
console.log("true == '1' --- " + (true == "1")); // true
console.log("false == '0' --- " + (false == "0")); // true
console.log("false == '' --- " + (false == "")); // true 這個很特殊
console.log("NaN == NaN --- " + (NaN == NaN)); // false
</script>
八. 特殊規律
沒什麼好說的 記住就完事了
<script>
console.log(undefined > 0); // false
console.log(undefined < 0); // false
console.log(undefined == 0); // false
console.log(null > 0) // false
console.log(null < 0); // false
console.log(null == 0); // false
console.log(undefined == null); // true
console.log(typeof(NULL) == typeof(undefined)); // true 因為NULL相當於一個未定義的變數
console.log(typeof(null)); // object 規定的
console.log(typeof(undefined)); // undefined 規定的
console.log(typeof(NaN)); // number 也很特殊 規定的
console.log(typeof typeof(NaN));// string 因為typeof(NaN)返回的是一個string型別
var student1 = {
name : "ljy",
id : 123
}
var student2 = new Object();
console.log(Number(student1)); // NaN 但如果用typeof測試會知道其實已經轉為number
console.log(Number(student2)); // NaN 但如果用typeof測試會知道其實已經轉為number
console.log(Boolean(null)); // false
console.log(Boolean(undefined));// false
</script>
最後要記住的就是 typeof()返回的是字串 比如 typeof(typeof(undefined));返回值為string