JavaScript

前言

最新的 ECMAScript 标准定义了JS的 7 种数据类型，其中包括：

6 种基本类型:Boolean、Null、Undefined、Number、String、Symbol (ECMAScript 6 新定义)；

1个引用类型： Object（包含狭义的对象，Array，function）。

本文主要介绍一下7种数据类型介绍及数据类型转换及数据类型判断。

目录

1. JavaScript七种数据类型（Boolean、Null、Undefined、Number、String、Symbol、Object）
2. JavaScript数据类型转换（任意类型转字符串，任意类型转数字，任意类型转布尔）
3. JavaScript数据类型判断（Typeof()、instanceof、Object.prototype.toString.call()、constructor）

正文

1 JavaScript七种数据类型

• Boolean

  • Bealean类型的值有两个：true、false

  • 所有其他数据类型都有对应的Boolean值，使用Boolean(value)方法可以强制转换任意值为boolean类型

    console.log(Boolean("Hello")); //true

• Null

  • Null类型的值只有一个：null

  • Typeof(null)时返回“object”：这是历史原因造成的，但是可以理解成：unll表示一个空对象(Object)的引用
    

    typeof(null); // "object"

• Undefined

  • undefined类型的值只有一个：undefined

  • 只进行了声明而未初始化的变量，其值都是undefined

    var m;
    console.log(m);    //undefined

  • undefined值派生自null值，两者都是表示“没有值”。两者相等，但是由于数据类型不一样，两者不全等（==是相等操作符会对数据类型进行转化，===是全等操作符不会转化数据类型）

  • console.log(undefined == null); //true 

    console.log(undefined === null); //false

  • 如何区分undefined和null：表示一个还没赋值的对象用null；表示一个还没赋值的字符串、数字、布尔、symbol时用undefined

• Number

  • number包括：整数和小数(如:1/1.1)、科学计数法(如:1.11e2)、二进制(如:0b11)、八进制(如:011或0o11)、十六进制(如:0x11)
  • 保存浮点数所需的内存空间是整数值的2倍
  • 浮点数值相加结果会不准确

    console.log(0.1+0.2);    //0.30000000000000004

  • NaN是一个特殊的Number值；它的存在是为了避免程序直接报错；NaN的任何操作都会返回NaN；NaN与任何值都不相等，包括它自身

    console.log(NaN === NaN);  //false；

• String

  • 字符串String类型是由引号括起来的一组由16位Unicode字符组成的字符序列。
  • 用单引号（' '）或双引号（" "）皆可，但是必须双引号配双引号，单引号配单引号
  • 任何字符串的长度都是可以通过length属性来取得

    var a="nihao";
    console.log(a.length);
    //5

  • ECMAScript中字符串是不可变，如要改变该变量保存的字符串，首先要销毁原来的字符串，再用另一个包含新值的字符串填充该变量 

• Symbol（本节参考自neweastsun的博客）

• • symbol是基本类型，实现唯一标识　　
  • 通过调用symbol(name)创建symbol　　name
  • 我们创建一个字段，仅为知道对应symbol的人能访问，使用symbol很有用　　
  • symbol不会出现在for..in结果中　　
  • 使用symbol(name）创建的symbol，总是不同，即使name相同。如果希望相同名称的symbol相等，则使用全局注册　　
  • symbol.for(name)返回给定名称的全局symbol，多次调用返回相同symbol　　
  • Javascript有系统symbol，通过Symbol.*访问。我们能使用他们去修改一些内置行为

• Object

  • 对象由 { } 分隔，在 { } 内部，对象的属性以名称和值对的形式 (name : value) 来定义，属性由逗号分隔　

    var cars={
    "car1" : "Volvo",
    "car2": "Saab",
    }; 
    //或者
    var cars={
    car1 : "Volvo",
    car2: "Saab",
    }; 

    　
  • 寻找对象中的值有两种方式：

    car1name=cars.car1;
    car1name =cars["car1"];

  • 数组(Array)和函数(Function)是高级的对象
  • 注意⚠️：基本类型和引用类型的区别：
  • 基本类型：访问是按值访问值不可变，基本类型的比较是值的比较，数据是存放在栈内存中的
  • 引用类型：拥有属性和方法且值是可变的，引用类型的比较是引用的比较，数据是存放在堆内存中的

2 JavaScript数据类型转换

• 任意转字符串

  • String(thing)   （thing：任何可以被转换成字符串的值）
    

    String(1)    //"1"
    String(true)    //"true"
    String(null)    //"null"
    String(undefined) //"undefined"
    String({})     //"[object Object]"

    注意⚠️：当字符串中的数字为其他进制时，会自动转化为十进制，再把十进制转化为字符串，如：

    String(0b1100)  //"12"   二进制转化为十进制
    String(01100）  //"576"  八进制转化为十进制
    String(0o1100)  //"576"  八进制转化为十进制
    String(0x1100)  //"4352" 十六进制转化为十进制
    

  • thing.toString()

    1.toString()  //Uncaught SyntaxError: Invalid or unexpected token
    1..toString()  //"1" 
    (1).toString()  //"1" 
    true.toString()  //"true"
    null.toString()  //VM285:1 Uncaught TypeError: Cannot read property 'toString' of null at <anonymous>:1:6
    undefined.toString()  //VM283:1 Uncaught TypeError: Cannot read property 'toString' of undefined at <anonymous>:1:11
    {}.toString()  //"[object Object]"

  • thing + ""

    1 + ""   //"1"
    true + ""  //"true"
    null + ""  //"null"
    undefined + ""  //"undefined"
    {} + ""  //0
    var o={}  //undefined
    o + ""  //"[object Object]"

• 任意转数字　　

  • Number(value)

    Number(true) //1     布尔转为数字
    Number(false) //0     布尔转为数字
    Number(null) //0     null转为数字
    Number(undefined) //NaN   undefined转为数字，结果为NaN 
    Number("123") //123   字符串转为数字
    Number(" ") //0       有空格的空字符串为0
    Number("") //0       为空格的空字符串为0
    Number("123a")  //NaN   number转数字的字符串中不能有字母，parseFloat以及parseInt的中间可以有字母，但是开头不能有
    Number("true") //NaN
    Number("false") //NaN

  • parseInt(string, radix) MDN 

    //⚠️string必须是一个字符串
    //⚠️如果不是字符串而是一串数字（注意不能是数字+字母的格式），系统会自动把数字转为字符串，parseInt(01100)相当于是parseInt(String(01100))，由于01100是0开头，是一个八进制，String(01100)会把进制度转化为十进制再转为字符串，即相当于是parseInt("576")
    
    parseInt("01100", 10) //1100      
    parseInt(01100)  //576        
    parseInt("01100", 8) //576  8的意思是：我字符串中的值是八进制的，请把它转化为十进制
    
    
    //⚠️但是0x开头（即十六进制）的除外
    parseInt("0b1100")  //0     二进制返回0，到字母b处即无法识别数字
    parseInt("0o1100")  //0     八进制返回0，到字母o处即无法识别数字
    parseInt("0x1100")  //4352  括号里的是字符串。十六进制返回对应的十进制
    parseInt(0x1100)    //4352  括号里的不是字符串。十六进制返回对应的十进制

    • string：必需。要被解析的字符串。
    • radix：可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间，如果省略该参数或其值为 0，则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头，将以 16 为基数，如果该参数小于 2 或者大于 36，则 parseInt() 将返回 NaN。　　
    • 注意⚠️：radix参数为n 将会把第一个参数看作是一个数的n进制表示，而返回的值则是十进制的
      
      
• parseFloat(string) MDN

  parseFloat("1.11")  //1.11       字符串中是数字（0-9）以及小数点
  parseFloat(".1.11")  //0.1        如果首字符是.则会自动shi
  parseFloat("0.0111e2")  //1.11       字符串中是科学计数法（e/E）
  parseFloat("+1.11")  //1.11       字符串中有+
  parseFloat("-1.11")  //-1.11      字符串中有-
  parseFloat("1.11more")  //1.11       字符串中如果有除 小数点、+/-、数字、e/E  的字符，它以及之后的字符都会被忽略
  parseFloat("more1.11")  //NaN       如果以字母开头直接NaN
  parseFloat("   1.11")  //1.11       字符串开头的空格会自动忽略
  
  //注意⚠️
  parseFloat(".1.11")  //0.1        如果字符串有两个点，第二点之后的内容会被忽略掉
  parseFloat("..1.11")  //NaN       开头多个点会NaN

  • string：需要被解析成浮点数的字符串　　　　
  • parseFloat是个全局函数,不属于任何对象　　
  • parseFloat将它的字符串参数解析成为浮点数并返回，如果在解析过程中遇到了正负号(+或-)、数字(0-9)、小数点、或者科学记数法中的指数(e或E)以外的字符，则它会忽略该字符以及之后的所有字符，返回当前已经解析到的浮点数，同时参数字符串首位的空白符会被忽略 　　
  • 可以通过调用isNaN函数来判断parseFloat的返回结果是否是NaN，如果让NaN作为了任意数学运算的操作数，则运算结果必定也是NaN　　
  • parseFloat 也可转换和返回Infinity值. 可以使用isFinite 函数来判断结果是否是一个有限的数值 (非Infinity, -Infinity, 或 NaN)　　
    
    
• string- 0 或 string*1 或string/1　

  "123"-0//123  相减
  "123"*1//123  相乘
  "123"/1//123  相除
  
  
  //注意⚠️
  "123a"-0//NaN  字符串中不能有字母

  　
• +string 或 -string

  +"123"//123  正
  -"123"//-123 负

  　

• 任意转布尔

  • Boolean(value)   (value：可选，是用来初始化 Boolean 对象的值。)

  • //Boolean()值为false的情况：参数值为 0、-0、null、NaN、undefined、空字符串（""），或者传入的参数为 DOM 对象的 document.all 时
    Boolean(""); //false 
    Boolean(0); //false
    Boolean(-0); //false
    Boolean(NaN); //false
    Boolean(null); //false 
    Boolean(undefined); //false 
    
    //Boolean()值为True的情况：除以上提到的几种情况，任何其他的值，包括值为 "false" 的字符串和任何对象，都会创建一个值为 true 的 Boolean 对象。
    //⚠️空字符串中如果有空格，返回的是true
    

    Boolean(" "); //true

  • !!value

    !!""  //false
    !!0  //false
    !!-0 //false
    !!NaN //false
    !!null //false
    !!undefined //false

3 JavaScript数据类型判断 

• Typeof()

  • 判断基本数据类型（基本类型number、string、boolean、undefined，除了null。）⚠️不能区分对象、数组、null、引用类型

    //typeof()输出有五种数据类型  number   string    boolean   undefined   object以及以及函数类型 function
    
    typeof("")  //"string"
    typeof(1) //"number"
    typeof(true) //"boolean"
    typeof(undefined) //"undefined"
    typeof({}) //"object"
    typeof([]) //"object"                     array返回对象
    typeof(function(){})  //"function"
    typeof(null)  //"object"                  null返回对象
    
    //但是怎么区分 对象、数组以及null 呢？

• instanceof运算符
  

  • 判断引用类型（引用类型，即对象类型。创建对象后可以调用这个对象下的方法有Object类型、Array类型、Date类型、RegExp类型、Function类型，包装类型（Boolean、Number、String）等。）

    //nstanceof对引用类型进行判断
    {} instanceof Object;     //true[] instanceof Array;       //truenew Date() instanceof Date;        //true
    function(){} instanceof Function;   //true
    
    
    //instanceof无法对原始类型进行判断
    "string" instanceof String;       //false(111) instanceof Number;   //false

• Object.prototype.toString.call()
  

  • 能准确的判断基本类型和引用类型　

    Object.prototype.toString.call('abc')     //"[object String]"
    Object.prototype.toString.call(123)       //"[object Number]"
    Object.prototype.toString.call(true)      //"[object Boolean]"
    Object.prototype.toString.call(undefined) //"[object Undefined]"
    Object.prototype.toString.call(null)      //"[object Null]"
    
    Object.prototype.toString.call({})        //"[object Object]"
    Object.prototype.toString.call([])        //"[object Array]"
    Object.prototype.toString.call(function(){}) //"[object Function]"

  • 常用的类型判断函数集合

    var valide = (function(){
        // 是否是字符串
        function isString(value){
            return Object.prototype.toString.call(value) == "[object String]";
        }
        // 是否是数字
        function isNumber(value){
            return Object.prototype.toString.call(value) == "[object Number]";
        }
        // 是否undefined
        function isUndefined(value){
            return Object.prototype.toString.call(value) == "[object Undefined]";
        }
        // 是否是null
        function isNull(value){
            return Object.prototype.toString.call(value) == "[object Null]";
        }
        // 是否是布尔值
        function isBoolean(value){
            return Object.prototype.toString.call(value) == "[object Boolean]";
        }
        // 是否是对象
        function isObject(value){
            return Object.prototype.toString.call(value) == "[object Object]";
        }
        // 是否数组
        function isArray(value){
            return Object.prototype.toString.call(value) == "[object Array]";
        }
        // 是否是函数
        function isFunction(value){
            return Object.prototype.toString.call(value) == "[object Function]";
        }
        // 是否是正则表达式
        function isRegExp(value){
            return Object.prototype.toString.call(value) == "[object RegExp]";
        }
        // 是否是日期对象
        function isDate(value){
            return Object.prototype.toString.call(value) == "[object Date]";
        }
    })();

• constructor属性
  

  • constructor属性始终指向创建当前对象的构造函数

    string".constructor == String   //true
    true.constructor == Boolean   //true
    (123).constructor == Number   //true
    {}.constructor == Object   //true
    [].constructor == Array   //true

  • 一个常用的函数

    function isArray(arr){
        return typeof arr == "object" && arr.constructor == Array;
    }