JavaScript的数据类型及区别

刺骨的言语ヽ痛彻心扉 2023-03-13 09:26 19阅读 0赞

## JavaScript的数据类型及区别 ##

#### 一.JavaScript的数据类型分类 ####

js的数据类型分为值类型(基础类型/原始类型)和引用数据类型两大类。其中

*  值类型(基本类型/原始类型):字符串(String) 数字(Number) 布尔(Boolean) 对空(Null) 未定义(Undefined) Symbol(es6新增的，独一无二)
 *  引用数据类型(混合数据类型):对象(Object) 数组(Array) 函数(Function)

#### 1.值类型 ####

// 1.字符串 string 由单引号 或 双引号 包含的内容
        var str1="赵凡";
        var str2='赵凡Plus';
        console.log(str1,str2);
        // 字符串的拼接 +
        console.log(str1+"Pro"+str2);
    
    
        // 2.数字 number 整数型 浮点型
        var num1=10;
        console.log(num1);
        var num2=10.00;
        console.log(num2);
        // 科学计数法 e 10的多少次方
        var num3=8888e5;
        console.log(num3);
        var num3=8888e-8;
        console.log(num3);
        // 进制 
        var num4=010;//0开头的代表 八进制
        console.log(num4);
        var num5=0x11a;//0123456789abcdef 0x开头表示十六进制
        console.log(num5);
    
        // 3.布尔(值) Boolean 逻辑 只包含两个值 true false
        var bool1=true;
        var bool2=false;
        console.log(bool1);
        console.log(bool2);
        if(bool2){ 
            console.log("真")
        }else{ 
            console.log("假")
        }
    
    
        // 4.对空 null 清空变量
        var a="沈春阳";
        var b=null;
        a=null;
        console.log(a);//null
        console.log(b);
        var x=null;
        
    
        // 5.未定义 undefined 声明 未赋值
        var n;
        console.log(n);//undefined

#### 2.引用数据类型 ####

// 1.对象 object {key:value,key:value...} 键值对
        var obj1={ 
            name:"诸葛成",
            sex:"不详",
            age:22,
            hobby:function(){ 
                console.log("干啥啥不行")
            }
        }
        console.log(obj1);
        console.log("姓名："+obj1.name);
        console.log("性别："+obj1.sex);
        obj1.hobby();
    
    
        // 2.数组 array [数组项1,数组项2,...] 数组项可以使任意数据类型
        var arr1=[0,1,2,3,4,5];
        console.log(arr1);
        var arr2=[0,"hello",true];
        console.log(arr2);
        // 数组的索引值 从0开始
        console.log(arr2[0]);
        console.log(arr2[1]);
    
    
        // 3.函数 function 方法 功能
        var func1=function(){ 
            // 执行代码块
            console.log("这是一个方法")
        }
        // 调用方法/函数
        func1();

#### 3.值类型数据与引用数据类型的区别 ####

// 值类型：string number boolean null undefined symbol
        var m = 10;
        var n = m;
        console.log(m);
        console.log(n);
        m = 20;
        console.log(n); //10
        console.log(m); //20
    
    
    
        // 引用类型：object array function
        var obj1 = { 
            name: "王选东"
        }
        console.log(obj1); //{name:"王选东"}
        var obj2 = obj1;
        console.log(obj2); //{name:"王选东"}
    
        obj2.name = "王大炮";
        console.log(obj2); //{name:"王大炮"}
        console.log(obj1); //{name:"王大炮"}

**根据以上代码可以看出，变量的数据类型为值类型时，两个变量其中一个改变不会影响两外一个值，而变量的数据数据类型为引用数据类型时，两个变量其中一个变量改变会影响另一个变量的值。**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MTU1NjEx_size_16_color_FFFFFF_t_70_pic_center]

#### 4.数据类型的判断 ####

// 判断数据类型 typeof 返回数据类型
        var num=0;
        console.log(typeof(num));//number
        var str="";
        console.log(typeof str);//string
        var bool=false;
        console.log(typeof bool);//boolean
        var x=null;
        console.log(typeof x);//object null 空对象
        var y;
        console.log(typeof y);//undefined
    
        var obj={ name:"张三"};
        console.log(typeof obj);//object
        var arr=[1,2,3,4,5];
        console.log(typeof arr);//object
        var func=function(){ };
        console.log(typeof func);//function
    
    //使用 typeof 运算符时采用引用类型存储值会出现一个问题，无论引用的是什么类型的对象，它都返回 "object"。
    
    //与 typeof 方法不同的是，instanceof方法要求开发者明确地确认对象为某特定类型。通常来讲，使用 instanceof 就是判断一个实例是否属于某种类型。
    
        // instanceof 操作符
        console.log(arr instanceof Array);
        console.log(obj instanceof Array);
    
        // Array.isArray() 是否是一个数组
        console.log(Array.isArray(arr));
        console.log(Array.isArray(obj));

#### 5.数据类型的转换 ####

// 数据类型的转换
        console.log(typeof String(num));//string
        console.log(Number(bool));//0
        console.log(Boolean(str));//false

**讲解视频链接：  
1.https://www.bilibili.com/video/BV1Lf4y1U7Cr/  
2.https://www.bilibili.com/video/BV1UC4y1H7xC/  
3.https://www.bilibili.com/video/BV1zK411W7M4/**

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MTU1NjEx_size_16_color_FFFFFF_t_70_pic_center]: /images/20230312/acfe6680484b421595e31bafb8c1c38a.png