js中那些方法不改變原來的陣列物件

liangklfang發表於2015-10-21

一、map方法

function fuzzyPlural(single) {
  var result = single.replace(/o/g, 'e');  
	//replace也不會修改原來陣列的值,這裡列印[foot,goose,moose,kangaroo]
	//alert(single);
//下面為新的陣列新增了一個元素,但是我們看到在map的時候沒有對新增的元素進行處理,所以map呼叫的結果還是沒有變化:["feet", "geese", "meese", "kangareese"]
	//但是可以知道words結果已經變化了!
	//words[4]="metoo";
//雖然下面通過修改length為3將陣列截斷了,從而相當於刪除了第四個元素,但是map方法並不會檢測到這種變化,所以在map方法呼叫的結果陣列長度還是為4,只是最後一個元素變成了空了!但是這種刪除會影響外層的words,使得他的長度變成了3!
	//但是在具體的fuzzyPlural只會呼叫三次!(通過alert(single)就可以知道,因為這裡已經把陣列截斷了,但是返回的陣列長度還是4,一個為空!)
	words.length=3;
  if( single === 'kangaroo'){
    result += 'se';
  }		
  return result; 
}
var words = ["foot", "goose", "moose", "kangaroo"];
alert(words.map(fuzzyPlural));
//map方法不修改原陣列的值,words經過map呼叫以後,還是沒有發生變化!
alert(words);
// ["feet", "geese", "meese", "kangareese"]
note:map方法的呼叫不會修改原來的陣列,同時從上面分析來說replace方法也不會改變原來呼叫的字串!同時我們上面用到了把length減少來刪除陣列元素的方法,但是這種方法比較笨拙,只能從陣列尾部刪除資料,同時陣列也有delete刪除方法,但是這種方法的不當之處在於他會在原來的陣列中留下空洞,也就是原來的物件只是變成了undefined,而不是真正的刪除。於是我們建議用splice方法,第一個引數是開始刪除的下標,第二個引數是要刪除的個數!同時要注意parseInt方法parseInt("1",0);會變成1!

二、concat方法

var num1 = [1, 2, 3];
var num2 = [4, 5, 6];
var num3 = [7, 8, 9,"c"];
var nums = num1.concat(num2, num3);
//為老陣列新增一個元素,看新陣列是否會發生變化
//列印[1,2,3,4,5,6,7,8,9,c]
alert(nums);
num3[4]="xxxx";
//發現新陣列沒有發生變化
alert(nums);
//為num1新增一個元素
num1[3]="cccc"
//新陣列也沒有發生變化!
alert(nums);

note:對新陣列的任何操作不會影響老陣列,反之亦然!因為這個方法會建立當前陣列的一個副本,然後將接受的引數新增到這個副本的末尾!所以互不影響!

三、slice方法

// 使用slice方法從myCar中建立一個newCar.
var myHonda = { color: "red", wheels: 4, engine: { cylinders: 4, size: 2.2 } };
var myCar = [myHonda, 2, "cherry condition", "purchased 1997"];
var newCar = myCar.slice(0, 2);
// 輸出myCar, newCar,以及各自的myHonda物件引用的color屬性.
print("myCar = " + myCar.toSource());
print("newCar = " + newCar.toSource());
print("myCar[0].color = " + myCar[0].color);
print("newCar[0].color = " + newCar[0].color);
// 改變myHonda物件的color屬性.
myHonda.color = "purple";
print("The new color of my Honda is " + myHonda.color);
//輸出myCar, newCar中各自的myHonda物件引用的color屬性.
print("myCar[0].color = " + myCar[0].color);
print("newCar[0].color = " + newCar[0].color);
note:slice不會修改原來的陣列,但是如果slice得到的結果陣列包含了引用物件,那麼如果修改原來的引用物件,那麼除了原來的物件被修改以外,通過slice獲取的結果的陣列也會發生變化,這就是引用物件在slice中的表現!同時在上面的這篇部落格裡面我們要學到可以把類陣列物件轉化為陣列物件有三種方法,Array.prototype.slice.call和[].slice.call,以及slice=Function.prototype.call.bind(Array.prototype.slice)然後通過slice(arguments)來完成!第三種用法還有一種去除兩端空格的方法,a.map(Function.prototype.call,String.prototype.trim)

四、filter,forEach,some,every(只要有一個元素不滿足就會終止迴圈)等

相關文章