資訊專欄INFORMATION COLUMN
github源碼：https://github.com/fypShirley...
看下面的示例了解賦值和引用的區別：賦值：
var a = 5;
var b = a;
b+=3;
console.log(b)//8
console.log(a)//5 原值沒有發生改變
引用:(對象和函數都是引用的關系)
var a = [1,2,3];
var b = a;
var c = a;
b.push(4);
console.log(b);//[1,2,3,4]
console.log(a);//[1,2,3,4] a被影響
c = [1,2,3,4,5];
console.log(c);//[1,2,3,4,5]
console.log(a);//[1,2,3,4] a不受影響
淺拷貝：
var obj0= {a:10};
var obj1= {a:{b:10}};
function copy(obj){//淺拷貝
var newObj = {};
for(var attr in obj){
newObj[attr] = obj[attr];
}
return newObj;
}
var obj2 = copy(obj0);
var obj3 = copy(obj1);
obj3.a.b = 20;
console.log(obj0.a);//10 a不受影響
console.log(obj1.a.b);//20 受影響了，還是引用
深拷貝：
先看一個遞歸 :
function test(n){
if(n == 1){
console.trace()
return 1;
}
return n*test(n-1);
}
console.log(test(4))//1*2*3*4 -> 24
深拷貝利用遞歸的思想：
function deepCopy(obj){//一層層進入，拿到值
if(typeof obj != "object"){
return obj;
}
console.trace();
var newObj = {};
for(var attr in obj){
newObj[attr] = deepCopy(obj[attr]);//遞歸
}
return newObj;
}
var obj4= {a:{b:10}};
var obj5 = deepCopy(obj4);
obj5.a.b = 20;
console.log(obj4.a);//a->{b:10},原數據沒有改變
console.log(obj5.a);//a->{b:20},
再一個深/淺拷貝的對比
//先聲明一個對象parent:
var parent = {
numbers: [1, 2, 3],
letters: ["a", "b", "c"],
obj: {prop: 1 },
bool: true
};
// 淺拷貝函數：
function extendCopy(p) {//傳地址
var c = {};
for (var i in p) {
c[i] = p[i];
}
c.uber = p;
return c;
}
// 深拷貝函數：
function deepCopy(p, c) {//傳值
//在拷貝每個屬性之前，建議使用 hasOwnProperty()來確認不會誤拷貝不需要的繼承屬性。
c = c || {};
for (var i in p) {
//console.log(p.hasOwnProperty(i))
if (p.hasOwnProperty(i)) {
if (typeof p[i] === "object") {
c[i] = Array.isArray(p[i]) ? [] : {};
deepCopy(p[i], c[i]);
} else {
c[i] = p[i];
}
}
}
return c;
}
var mydeep = deepCopy(parent);
mydeep.numbers.push(5);
console.log(mydeep.numbers)//[1,2,3,5]
console.log(parent.numbers)//[1,2,3]原數據沒有改變
myshallow.numbers.push(6);
console.log(myshallow.numbers)//[1,2,3,6]
console.log(parent.numbers)//[1,2,3,6原數據改變
console.log(mydeep.numbers)//[1,2,3]
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/92749.html
摘要：上一篇你不知道的筆記寫在前面這是年第一篇博客，回顧去年年初列的學習清單，發現僅有部分完成了。當然，這并不影響年是向上的一年在新的城市穩定連續堅持健身三個月早睡早起游戲時間大大縮減，學會生活。 上一篇：《你不知道的javascript》筆記_this 寫在前面 這是2019年第一篇博客，回顧去年年初列的學習清單，發現僅有部分完成了。當然，這并不影響2018年是向上的一年：在新的城市穩定、...
摘要：一篇文章徹底說清的深拷貝淺拷貝這篇文章的受眾第一類業務需要急需知道如何深拷貝對象的開發者。這篇文章分享的目的更多還是希望用一篇文章整理清楚深淺拷貝的含義遞歸實現思路以及小伙伴們如果使用了這種黑科技一定要清楚這樣寫的優缺點。 一篇文章徹底說清JS的深拷貝and淺拷貝 這篇文章的受眾 第一類,業務需要,急需知道如何深拷貝JS對象的開發者。 第二類,希望扎實JS基礎,將來好去面試官前秀操作...
摘要：一篇文章徹底說清的深拷貝淺拷貝這篇文章的受眾第一類業務需要急需知道如何深拷貝對象的開發者。這篇文章分享的目的更多還是希望用一篇文章整理清楚深淺拷貝的含義遞歸實現思路以及小伙伴們如果使用了這種黑科技一定要清楚這樣寫的優缺點。 一篇文章徹底說清JS的深拷貝and淺拷貝 這篇文章的受眾 第一類,業務需要,急需知道如何深拷貝JS對象的開發者。 第二類,希望扎實JS基礎,將來好去面試官前秀操作...
摘要：一篇文章徹底說清的深拷貝淺拷貝這篇文章的受眾第一類業務需要急需知道如何深拷貝對象的開發者。這篇文章分享的目的更多還是希望用一篇文章整理清楚深淺拷貝的含義遞歸實現思路以及小伙伴們如果使用了這種黑科技一定要清楚這樣寫的優缺點。 一篇文章徹底說清JS的深拷貝and淺拷貝 這篇文章的受眾 第一類,業務需要,急需知道如何深拷貝JS對象的開發者。 第二類,希望扎實JS基礎,將來好去面試官前秀操作...
閱讀 3063·2021-11-24 10:34
閱讀 3322·2021-11-22 13:53
閱讀 2630·2021-11-22 12:03
閱讀 3598·2021-09-26 09:47
閱讀 3005·2021-09-23 11:21
閱讀 4772·2021-09-22 15:08
閱讀 3289·2021-07-23 10:59
閱讀 1258·2019-08-29 18:31
