03-JavaScript基礎(chǔ)—數(shù)據(jù)類型

文章配套視頻

數(shù)據(jù)

  • 數(shù)據(jù)是指所有能輸入到計(jì)算機(jī)并被計(jì)算機(jī)程序處理的符號的介質(zhì)的總稱,是具有一定意義的數(shù)字、字母、符號和模擬量等的通稱。
數(shù)據(jù)以各種形式存在于我們生活中

數(shù)據(jù)類型

  • 為什么會有數(shù)據(jù)類型?
var  a = 10;
var  b = '10';

思考:變量名a 和 變量名b 保存的數(shù)據(jù)是否一樣?

  • JS中常用的數(shù)據(jù)類型

    • 程序在運(yùn)行過程中會產(chǎn)生各種各樣的臨時數(shù)據(jù), 為了方便數(shù)據(jù)的運(yùn)算和操作, JavaScript對這些數(shù)據(jù)進(jìn)行了分類, 提供了豐富的數(shù)據(jù)類型;

    • 在JavaScript中一共有六種數(shù)據(jù)類型:

    • JS的6種數(shù)據(jù)類型
  • JS中如何查看數(shù)據(jù)類型?

    • typeof 操作符
      • 會將檢查的結(jié)果以字符串的形式返回給我們
      console.log(typeof  100); // number
      var name = "旋之華";
      console.log(typeof name ); // string
      
  • 數(shù)字類型(Number)

    1: 最基本的數(shù)據(jù)類型
    2: 不區(qū)分整型數(shù)值和浮點(diǎn)型數(shù)值
    3: 能表示的最大值是±1.7976931348623157乘以10的308次方
    能表示的最小值是±5 乘以10的-324次方
    4:包含十六進(jìn)制數(shù)據(jù),以 0x開頭 0到9之間的數(shù)字,a(A)-f(F)之間字母構(gòu)成。 a-f對應(yīng)的數(shù)字是10-15
    5: 八進(jìn)制直接以數(shù)字0開始,有0-7之間的數(shù)字組成。

    • 在JS中所有的數(shù)值都是Number類型(整數(shù)和小數(shù))
     var num1= 123;
     var num2= 3.14;
     console.log(typeof num1); // number
     console.log(typeof num2); // number
    
    • 由于內(nèi)存的限制,ECMAScript 并不能保存世界上所有的數(shù)值
     // 最大值:Number.MAX_VALUE
     console.log(Number.MAX_VALUE);  // 1.7976931348623157e+308
     // 最小值:Number.MIN_VALUE
     console.log(Number.MIN_VALUE);  // 5e-324
     // 無窮大:Infinity, 如果超過了最大值就會返回該值
     console.log(Number.MAX_VALUE + Number.MAX_VALUE); // Infinity
     // 無窮?。?Infinity, 如果超過了最小值就會返回該值
     console.log(typeof Infinity); // number
     console.log(typeof -Infinity); // number
    
    • NaN 非法數(shù)字(Not A Number)
      JS中當(dāng)對數(shù)值進(jìn)行計(jì)算時沒有結(jié)果返回,則返回NaN
     var str = NaN;
     console.log(typeof str ); // number
    
    • Number類型注意點(diǎn)
     //  JS中整數(shù)的運(yùn)算可以保證精確的結(jié)果
      var counter = 120 + 20;
      console.log(counter ); // 140
     //  在JS中浮點(diǎn)數(shù)的運(yùn)算可能得到一個不精確的結(jié)果
      var counter = 100.1 + 20.1;
      console.log(counter ); // 120.200000000000003
    
  • 字符串類型(string)

    • 字符串由單引號或雙引號括起
    • 例如單獨(dú)一個字母也被稱為字符串(例如:‘a(chǎn)’)
    • " '
    • 使用字符串注意事項(xiàng)
      //  正常的情況
      var str1 = "hello";
      var str2 = `world`;
      console.log(typeof str1 ); // string
      console.log(typeof str2); // string
      
      //  不能一單一雙,必須成對出現(xiàn) 
      var str3 = `hello world"; // 錯誤
      
      //  相同引號不能嵌套,不同引號可以嵌套
      var str3 = "hello "world""; // 錯誤
      var str4 = `hello `world``; // 錯誤
      var str5 = "hello 'world'"; // 正確
      var str6 = `hello "world"`; // 正確
      
  • 布爾類型(Boolean)

    • 布爾型也被稱為邏輯值類型或者真假值類型
    • 布爾型只能夠取真(true)和假(false)兩種數(shù)值, 也代表1和0,實(shí)際運(yùn)算中true=1,false=0
    var bool1 = true;
    var bool2 = false;
    console.log(typeof bool1); // boolean
    console.log(typeof bool2); // boolean
    
    • 雖然Boolean 類型的字面值只有兩個,但 ECMAScript 中所有類型的值都有與這兩個 Boolean 值等價的值

    任何非零數(shù)值都是true, 包括正負(fù)無窮大, 只有0和NaN是false
    任何非空字符串都是true, 只有空字符串是false
    任何對象都是true, 只有null和undefined是false

     var bool = Boolean(0);
     console.log(bool ); // false
    var bool = Boolean(1);
    console.log(bool ); // true
    var bool = Boolean(-1);
    console.log(bool ); // true
    var bool = Boolean("hello");
    console.log(bool); // true
    var bool = Boolean("");
    console.log(bool ); // false
    var bool = Boolean(undefined);
    console.log(bool ); // false
    var bool = Boolean(null);
    console.log(bool8); // bool 
    
  • Null和Undefined

    • Undefined這是一種比較特殊的類型,表示變量未賦值,這種類型只有一種值就是undefined
      var num;
      console.log(num);  //結(jié)果是undefined
    
    • undefined是Undefined類型的字面量

      • 前者undefined和10, "abc"一樣是一個常量
      • 后者Undefined和Number,Boolean一樣是一個數(shù)據(jù)類型
    • 需要注意的是typeof對沒有初始化和沒有聲明的變量都會返回undefined。

     var str1 = undefined;
     console.log(typeof str1 ); //結(jié)果是undefined
      
     var str2;
     console.log(typeof  str2); //結(jié)果是undefined
    
    • Null 類型是第二個只有一個值的數(shù)據(jù)類型,這個特殊的值是 null
      • 從語義上看null表示的是一個空的對象。所以使用typeof檢查null會返回一個Object
        var test1= null;
        console.log(typeof test1);
      
    • undefined值實(shí)際上是由null值衍生出來的,所以如果比較undefined和null是否相等,會返回true
       var str1 = null;
       var str2 = undefined;
       console.log(str1 == str12);
       console.log(str1=== str2);
      

數(shù)據(jù)類型轉(zhuǎn)換

  • 什么是數(shù)據(jù)類型轉(zhuǎn)換

    • 將一個數(shù)據(jù)類型轉(zhuǎn)換為其他的數(shù)據(jù)類型, 比如: 將String類型轉(zhuǎn)換為Number類型, 將Number類型轉(zhuǎn)換為Boolean類型... ...
  • toString()

    • 將其它類型的數(shù)據(jù)轉(zhuǎn)換為字符串類型
         var num = 12306;
         var str= num .toString();
         console.log(str); // 12306
         console.log(typeof str); // string
      
         var num1 = true;
         var str1 = num1.toString();
         console.log(str1 ); // true
         console.log(typeof str1 ); // string
      
    • 注意:null和undefined沒有toString()方法,如果強(qiáng)行調(diào)用,則會報(bào)錯
       var num2 = undefined;
       var str2 = num2.toString(); // 報(bào)錯
       console.log(str2 );
      
       var num3 = null;
       var str3= num3.toString(); // 報(bào)錯
       console.log(res4);
      
       var num4 = NaN;
       var str4 = num4.toString();
       console.log(str4); // NaN
       console.log(typeof str4); // String
      
    • toString()不會影響到原變量,它會將轉(zhuǎn)換的結(jié)果返回
       var num5 = 10;
       var str5 = str5.toString();
       console.log(typeof num5 ); // number
       console.log(typeof str5 ); // string
      
  • String()函數(shù)

    • 有的時候, 某些值并沒有toString()方法,這個時候可以使用String()。比如:undefined和null
      • Number和Boolean的數(shù)據(jù)就是調(diào)用的toString()方法
      • 對于null和undefined,就不會調(diào)用toString()方法, 因?yàn)闆]有這個方法, 會在內(nèi)部生成一個新的字符串
  • +

    • 任何數(shù)據(jù)和 + 連接到一起都會轉(zhuǎn)換為字符串
      , 其內(nèi)部實(shí)現(xiàn)原理和String()函數(shù)一樣
         var num1 = 100;
         var res1 = num1 + "";
         console.log(res1); // 100
         console.log(typeof res1); // string
      
         var num2 = true;
         var res2 = num2 + "";
         console.log(res2); // true
         console.log(typeof res2); // string
      
         var num3 = undefined;
         var res3 = num3 + "";
         console.log(res3); // undefined
         console.log(typeof res3); // string
      
         var num4 = null;
         var res4 = num4 + "";
         console.log(res4); // null
         console.log(typeof res4); // string
      
  • Number()函數(shù)

    • 字符串 轉(zhuǎn) 數(shù)字
      • 如果是純數(shù)字的字符串,則直接將其轉(zhuǎn)換為數(shù)字
      var str1 = "666";
      var res1 = Number(str1);
      console.log(res1); // 666
      console.log(typeof  res1); // number
      
      • 如果字符串中有非數(shù)字的內(nèi)容,則轉(zhuǎn)換為NaN
      var str2 = "itlike123";
      var res2 = Number(str2);
      console.log(res2); // NaN
      
      • 如果字符串是一個空串或者是一個全是空格的字符串,則轉(zhuǎn)換為0
      var str3 = "";
      var res3 = Number(str3);
      console.log(res3); // 0
      
      var str4 = "    ";
      var res4 = Number(str4);
      console.log(res4); // 0
      
    • undefined 轉(zhuǎn) 數(shù)字
      var str6 = undefined;
      var res8 = Number(str6);
      console.log(res8); // NaN
      
    • null 轉(zhuǎn) 數(shù)字
      var str5 = null;
      var res7 = Number(str5);
      console.log(res7); // 0
      
    • 布爾 轉(zhuǎn) 數(shù)字
      • true 轉(zhuǎn)成 1, false 轉(zhuǎn)成 0
         var bool1 = true;
        var res5 = Number(bool1);
        console.log(res5); // 1
      
        var bool2 = false;
        var res6 = Number(bool2);
        console.log(res6); // 0
      
  • parseInt()函數(shù)和parseFloat()函數(shù)

    • Number()函數(shù)中無論混合字符串是否存在有效整數(shù)都會返回NaN, 利用parseInt()/parseFloat()可以提取字符串中的有效整數(shù)

    • parseInt()和parseFloat()的區(qū)別是前者只能提取整數(shù),后者可以提取小數(shù)

    • parseInt()提取字符串中的整數(shù)

      • 從第一位有效數(shù)字開始, 直到遇到無效數(shù)字
        如果第一位不是有效數(shù)字, 什么都提取不到, 會返回NaN
      • 第一個參數(shù)是要轉(zhuǎn)換的字符串,第二個參數(shù)是要轉(zhuǎn)換的進(jìn)制
       var str7 = "300px";
       var res9 = parseInt(str7);
       console.log(res9); // 300
      
       var str8 = "300px250";
       var res10 = parseInt(str8);
       console.log(res10); // 300
       console.log(parseInt("abc123"));  //返回NaN,如果第一個字符不是數(shù)字或者符號就返回NaN
      console.log(parseInt(""));        //空字符串返回NaN,Number("")返回0 
      
    • parseFloat提取字符串中的小數(shù)

      • 會解析第一個. 遇到第二個.或者非數(shù)字結(jié)束
      • 如果第一位不是有效數(shù)字, 什么都提取不到
      • 不支持第二個參數(shù),只能解析10進(jìn)制數(shù)
      • 如果解析的內(nèi)容里只有整數(shù),解析成整數(shù)
      var str9 = "20.5px";
      var res11 = parseInt(str9);
      console.log(res11); // 20
      
      var str10 = "20.5.5.5px";
      var res12 = parseFloat(str10);
      console.log(res12); // 20.5
      
  • 對非String使用parseInt()或parseFloat(), 會先將其轉(zhuǎn)換為String然后在操作

       var str11 = true;
       var res13 = parseInt(str11); // 這里相當(dāng)于parseInt("true");
       console.log(res13); // NaN
       var res14 = Number(str11);
       console.log(res14); // 1
    
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容