JS 中一定要了解的資料型別和資料轉換

湯清麗發表於2019-11-24
JS資料型別

前言

Js中的型別只有6種，其中基本資料型別有5種分別為string,number,boolen,null,undefined，引用型別有一種，就是object，object是一個大的綜合體，在JS中除了那5個基本資料型別以外，其他的一切皆物件。以下是最近自學js整理的一些筆記，希望能讓更多初學者瞭解到資料型別的基本概念。

正文

1.獲取變數型別

typeof

var age = 18;
console.log(typeof age);  // 'number'

2.基本資料型別

字串(String),數值型(number),布林型(boolean)

<script>
    //a.字串
    var a = "laowangba"; 
    //document.write(typeof(a));

    //數值
    var b = 123;
    var b1 = 123.1;---> 同樣是number型別,不要判斷兩個浮點數是否相等.

    //布林型
    var c = ture;
    var d = false;
</script>
  • Boolean字面量： true和false，區分大小寫
  • 計算機內部儲存：true為1，false為0

3.複合資料型別

物件(object),陣列(array object) 

<script>
    //物件
    var e = {'name':'niu','age':18}; ---> 等價於PHP中class a()

</script>

4.其他資料型別

函式,null,undefined

<script>
    //函式型別
    var j = function(){};
    //document.write(j); ---> 這裡可能會有爭議,但typeof列印出來的確就有funcion型別

    //null型別
    var h = null;
    //document.write(h); ---> 空物件,物件型別中的一個分支,沒有此物件的時候會顯示null.
    //alert(document.getElementById('notExistElement')); --->顯示為null,找不到此物件

    //undefined型別
    var g;
    //document.write(i); ---> 列印一個不存在的變數,定義為undefined,未定義或者定義了,但未初始化

    //alert(null == undefined);---> 顯示結果是true
    //alert(null === undefined);---> 顯示結果是false
</script>

2.1 隱式轉換

隱式轉換常用於if判斷等需要直接結果的地方.

<script>
    undefined == null;  // true   
    1 == true;  // true  
    2 == true;  // false  
    0 == false;  // true
    0 == '';  // true
    NaN == NaN;  // false ---> NaN 注意:這是JS中一個特殊的表示,NaN表示不等於任何值.這個數值表示本來要返回數值的運算元未返回數值的情況（這樣就不會丟擲錯誤了）。任何數值除以0都會導致錯誤而終止程式執行。一般使用isNaN()來判斷是否為NaN型別.
    [] == false;  // true  
    [] == ![];  // true
    '6' - '3'  // 3
    1234 + 'abcd' // "1234abcd"
</script>

  1. undefined與null相等,但不恆等（===）

  2. 一個是number一個是string時,會嘗試將string轉換為number

  3. 隱式轉換將boolean轉換為number,0或1

  4. 隱式轉換將Object轉換成number或string,取決於另外一個對比量的型別

  5. 對於0、空字串的判斷,建議使用 “===”

  6. “==”會對不同型別值進行型別轉換再判斷,“===”則不會.它會先判斷兩邊的值型別,型別不匹配時直接為false

2.2顯示轉換

Number:


var a = Number('1');
var b = Number(1);
var c = Number('c');
var d = Number(null);
var e = Number(undefined);

console.log(a,b,c,d,e); // 1 1 NaN 0 NaN

// Number()可以把任意值轉換成數值，如果要轉換的字串中有一個不是數值的字元，返回NaN

String:


String(1234);  // "1234"
String('abcd');  // "abcd"
String(true);  // "true"
String(undefined); // "undefined"
String(null);  // "null"

Boolean:


var a = Boolean('0');
var b = Boolean(0);
var c = Boolean('1');
var d = Boolean(null);
var e = Boolean(undefined);
var f = Boolean(NaN);

console.log(a,b,c,d,e,f); //true false true false false false

// 0、''(空字串) 、null、 undefined 、NaN 會轉換成false  其它都會轉換成true

parseFloat:

var a = parseFloat('1.2df'); //1.2
var b = parseFloat('1.3.4'); //1.3
var c = parseFloat('c12'); //NaN
var d = parseFloat(null); //NaN
var e = parseFloat(undefined); //NaN

console.log(a,b,c,d,e); 

// parseFloat() 把字串轉換成浮點數
// parseFloat()和parseInt非常相似，
// 不同之處在與parseFloat會解析第一個 . 遇到第二個.或者非數字結束
// 如果解析的內容裡只有整數，解析成整數

parseInt()

var a = parseInt('1.2df'); //
var b = parseInt(1);
var c = parseInt('c12');
var d = parseInt(null);
var e = parseInt(undefined);

console.log(a,b,c,d,e); //1 1 NaN NaN NaN

// 如果第一個字元是數字會解析,直到遇到非數字結束
// 如果第一個字元不是數字或者符號就返回NaN

2.3 字串特別說明

1. 單引號和雙引號均可解析跳脫字元

2. 單引號和雙引號均不能解析變數

3. 變數與字串,變數與變數要使用+來拼接,區分開PHP

4. 單引號和雙引號可以互相巢狀,如果單引號中藥巢狀單引號,需要將單引號轉義,同理,雙引號相同

<script>
    //單引號和雙引號為啥不能解析說明
    var a = 10;
    alert('a'); ---> 此處懵逼,到底是要輸出變數還是字串?它不像PHP,有個$直接可以區分開變數和字串
    alert('a'+ a);

    //+連線說明
    alert('hello' + 3 + 'world'); //hello3world
    alert(3 + 2 + 'hello' + 5 + 'world'); //5hello5world
    alert(4 + 4 + 'hello' + 4 + 5 + 'world'); //8hello45world  ---> 左往右連線,兩個數字會理解為加號,直到碰見不為數值則理解為拼接.
</script>

如何列印一下字串：

var s = '我很喜歡   \"雷鋒  \'的精神\'  \"';
console.log(s);
  • 字串長度

length屬性用來獲取字串的長度

var str = 'Hello World';
console.log(str.length);
本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章