JavaScript高级进阶——数据类型、值类型与引用类型的区别

数据类型

基本数据类型:string、number、boolean、null、undefined
复杂(引用)数据类型:Array、Object、function

var str = 'str';
var num = 123;
var bool = true;
var n = null;
var unde = undefined;
var arr = [1, 2, 3];
var obj = { name: 'may'};
var f = function() { }
// 利用typeof来检测数据类型
console.log(typeof arr);  // object
console.log(typeof f);    // function

Array类型

第一种 使用Array构造函数

var arr1 = new Array();
arr[0] = '1';
arr[1] = '2';
var arr2 = new Array('a', 'b', 'c');

第二种 使用字面量表示法

var arr3 = [1, 2, 3, 4];
var arr4 = [1, '2', true, [1, 2], {id: 1}];

Object类型

第一种object构造函数

var obj = new Object();
obj.name = "abc";
obj.action = function() {
    console.log(this.name)
};
obj.name;
obj.action();

第二种 字面量

// 简单字面量
var obj2 = {};
obj.name = 'may';
obj.age= 18;
obj.action= function(){};

//嵌套字面量
var obj3 = {
    name: 'may',
    age: 18,
    action: function() {
        return this.name
    }
}

第三种 工厂方式

function createObj(name) {
    var obj4 = new Object();
    obj4.name = name;
    obj4.action = function(){
        console.log(this.name)
    };
    return obj4;
}
var a = createObj('may');
a.name;

第四种 构造函数 首字母大写 驼峰命名

function CreateObj2(name) {
    this.name = name;
    this.action = function(){
        console.log(this.name)
    };
}
var a1 = new CreateObj2('may')

function类型

//函数声明    优先解析
fun(123);  //可执行
function fun(name) {
    return name;
};
// 函数表达式
fun2(123);  //不可执行
var fun2 = function(name){
    return name;
};
fun2(123);  //可执行

值类型和引用类型的区别

// 值类型   深拷贝
var a = 10;
var b = a;    //10
a = 20;
console.log(b);   //10

// 引用类型  指向存储地址  浅拷贝
var arr5 = [1, 2, 3, 4, 5];
var arr6 =arr5;  //[1, 2, 3, 4, 5]
arr6[1] = 99;    //[1, 99, 3, 4, 5]
console.log(arr5);   //[1, 99, 3, 4, 5]
var o = {name: 'may'};
var o2 = o;   //{name: 'may'}
o2.name = 'anna';
console.log(o)  //{name: 'annna'}

猜你喜欢

转载自blog.csdn.net/weixin_43729824/article/details/84438490