詳解JavaScript中的數(shù)組合并方法和對象合并方法
1 數(shù)組合并
1.1 concat 方法
var a=[1,2,3],b=[4,5,6]; var c=a.concat(b); console.log(c);// 1,2,3,4,5,6 console.log(a);// 1,2,3 不改變本身
1.2 循環(huán)遍歷
var arr1=['a','b'];
var arr2=['c','d','e'];
for(var i=0;i<arr2.length;i++){
arr1.push(arr2[i])
}
console.log(arr1);//['a','b','c','d','e']
1.3 apply
合并數(shù)組arr1和數(shù)組arr2,使用Array.prototype.push.apply(arr1,arr2) or arr1.push.apply(arr1,arr2);
var arr1=['a','b']; var arr2=['c','d','e']; Array.prototype.push.apply(arr1,arr2); //或者 arr1.push.apply(arr1,arr2);<br>console.log(arr1) //['a','b','c','d','e']
2 對象合并
2.1 $.extend()
var obj1= {'a': 1};
var obj2= {'b': 1};
var c = $.extend(obj1, obj2);
console.log(obj1); // {a: 1, b: 1} obj1已被修改
//或者 <br>var obj3 = $.extend({}, obj1, obj2) <br>console.log(obj3); //{a: 1, b: 1} 不會改變obj1,obj2
2.2 遍歷賦值
var obj1={'a':1};
var obj2={'b':2,'c':3};
for(var key in obj2){
if(obj2.hasOwnProperty(key)===true){ <br> //此處hasOwnProperty是判斷自有屬性,
使用 for in 循環(huán)遍歷對象的屬性時,原型鏈上的所有屬性都將被訪問會避免原型對象擴展帶來的干擾
obj1[key]=obj2[key];
}
}
console.log(obj1);//{'a':1,'b':2,'c':3};
2.3 Obj.assign()
可以把任意多個的源對象自身的可枚舉屬性拷貝給目標對象,然后返回目標對象。
Object.assign(target, ...sources)
//a. 復(fù)制一個對象<br>var obj = { a: 1 ,b:2};
var copyObj = Object.assign({}, obj);
console.log(copyObj); // { a: 1,b:2 }<br><br>//b.合并多個對象
var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };
var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 }, 且目標對象自身也會改變?!?/pre>
2.4 對象的深拷貝和淺拷貝
2.4.1 淺拷貝
var obj1={'a':1};
var obj2={'b':{'b1':22,'b2':33}};
$.extend(obj1, obj2); //obj1拷貝了obj2的屬性
console.log(obj1) // {'a':1,'b'{'b1':22,'b2':33}}
console.log(obj1.b.b1) // 22
obj2.b.b1=44; //obj2重新賦值
console.log(obj1.b.b1) // 44 obj1.b僅拷貝了對象的指引,所以受原obj2的影響
2.4.2 深拷貝
var obj1={'a':1};
var obj2={'b':{'b1':22,'b2':33}};
$.extend(true,obj1, obj2); //第一個參數(shù)設(shè)為true表示深復(fù)制
console.log(obj1) // {'a':1,'b'{'b1':22,'b2':33}}
console.log(obj1.b.b1) // 22
obj2.b.b1=44; //obj2重新賦值
console.log(obj1.b.b1) // 22 obj1拷貝了obj2的所有屬性以及值,并不受obj2的影響
總結(jié)
以上所述是小編給大家介紹的JavaScript中的數(shù)組合并方法和對象合并方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
全面總結(jié)Javascript對數(shù)組對象的各種操作
最近有個同事問了個問題,關(guān)于數(shù)組,對象和類數(shù)組的,仔細說起來都是基礎(chǔ),其實都沒什么好講的,不過看到還是有很多朋友有些迷糊,決定還是寫出來吧,下面這篇文章主要給大家介紹了Javascript對數(shù)組對象的各種操作,需要的朋友可以參考借鑒。2017-01-01
Extjs顯示從數(shù)據(jù)庫取出時間轉(zhuǎn)換JSON后的出現(xiàn)問題
后臺從數(shù)據(jù)庫取出時間,JSON格式化后再傳到gridpanel,這時時間變成了:/Date(32331121223)/這樣的格式,本文將詳細介紹解決Extjs顯示從數(shù)據(jù)庫取出時間轉(zhuǎn)換JSON后的出現(xiàn)問題2012-11-11
Javascript 生成指定范圍數(shù)值隨機數(shù)
查手冊后才知道, 介紹的信息少得可憐吶, 沒有介紹生成 m-n 范圍的隨機數(shù)..., 就只是給你一個 Math.random() 了事.2009-01-01
JavaScript Map實現(xiàn)原理與底層結(jié)構(gòu)詳解
哈希表(也稱為哈希表)是一種基于鍵直接訪問內(nèi)存存儲位置的數(shù)據(jù)結(jié)構(gòu)。也就是說,它通過計算一個鍵值函數(shù)來加速查找,該函數(shù)將要查詢的數(shù)據(jù)映射到表中的某個位置。該映射函數(shù)稱為散列函數(shù),記錄數(shù)組稱為散列表2022-09-09
Echarts圖表點擊x軸y軸切換圖表二級數(shù)據(jù)實例代碼
最近項目用到了Echarts圖進行數(shù)據(jù)展示,所以下面這篇文章主要給大家介紹了關(guān)于Echarts圖表點擊x軸y軸切換圖表二級數(shù)據(jù)的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-04-04
使用JavaScriptCore實現(xiàn)OC和JS交互詳解
JavaScriptCore是webkit的一個重要組成部分,主要是對JS進行解析和提供執(zhí)行環(huán)境。下面這篇文章主要給大家介紹了使用JavaScriptCore實現(xiàn)OC和JS交互的相關(guān)資料,文中介紹的非常詳細,需要的朋友可以參考學(xué)習(xí),下面來一起看看吧。2017-03-03

