JS開發者應懂的33個概念系列2&&3--原始型別 && 值型別和引用型別

Wendydesigner發表於2018-12-04

基本型別:undefined, null, number,string,boolean (存放棧中)
引用型別:array,object(存放堆中)

基本型別的賦值:

var a = 10;
var b = a;

a++;
console.log(a);// 11
console.log(b);// 10
複製程式碼

JS開發者應懂的33個概念系列2&&3--原始型別 && 值型別和引用型別

引用型別的賦值:

var a = {};
var b = a;

a.name = 'xiaogou';
b.age = 11;

console.log(a);// {name: "xiaogou", age: 11}
console.log(b);// {name: "xiaogou", age: 11}

console.log(a === b);// true
複製程式碼

JS開發者應懂的33個概念系列2&&3--原始型別 && 值型別和引用型別

接下來說一說拷貝了

JS開發者應懂的33個概念系列2&&3--原始型別 && 值型別和引用型別

var a = {age: 11};
function copy(obj) {
  console.log(obj === a);// true a賦值給obj,指向同一堆地址
  obj.age = 22;
  obj = {
   age: 33
  }// obj指向了另一個地址
  return obj;
}
var b = copy(a);
console.log(a);// {age: 22} 
console.log(b);// {age: 33}
複製程式碼

淺拷貝的實現方法:

方法1:

function simpleClone(originObj) {
    var targetObj = {};
    for (var prop in originObj) {
        targetObj[prop] = originObj[prop];
    }
    returnd targetObj;
}
複製程式碼

方法2:

var targetObj = Object.assign({}, originObj);
複製程式碼

深拷貝的實現方法:

方法1:

// window.json存在
var targetObj = JSON.parse(JSON.stringify(originObj));
複製程式碼

方法2:

var lodash = require('loadsh');
var targetObj = lodash.cloneDeep(originObj);
複製程式碼

方法3:

// 遞迴拷貝
function deepClone(originObj) {
    var targetObj = originObj.constructor === Array ? [] : {};
    for (var prop in originObj) {
        var value = originObj[prop];
        // 防止造成死迴圈
        if (value === targetObj) {
            continue;
        }
        if (typeOf value === 'Object') {
            arguments.callee(value);
        } else {
            targetObj[prop] = value;
        }
    }
    return targetObj;
}
targetObj = deepClone(originObj);
複製程式碼

相關文章