js中那些方法不改變原來的陣列物件
一、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(只要有一個元素不滿足就會終止迴圈)等
相關文章
- js陣列物件複製拷貝不改變原來的值,深拷貝JS陣列物件
- 陣列--移除陣列中指定的元素,不改變原陣列和改變原陣列陣列
- 陣列去重,地址不改變陣列
- 重寫陣列的方法(改變原陣列)陣列
- JS 中特殊的物件-陣列JS物件陣列
- JS中陣列與物件的遍歷方法例項JS陣列物件
- iOS 陣列中那些實用的方法iOS陣列
- js 去掉陣列物件中的重複物件JS陣列物件
- JS中的Math物件,陣列,和Date物件JS物件陣列
- js 物件轉為js陣列 && Object方法JS物件陣列Object
- json中物件陣列迭代JSON物件陣列
- 你真的瞭解JS陣列的那些方法嗎?JS陣列
- Python replace方法並不改變原字串Python字串
- JS中陣列物件的基本結構JS陣列物件
- JS中遍歷陣列、物件的方式JS陣列物件
- js中給陣列中物件去重JS陣列物件
- js將一個陣列追加到原陣列中JS陣列
- js,javascript陣列物件的父級物件 – 子集物件(陣列物件相減)JSJavaScript陣列物件
- js 取陣列中某個物件的集合JS陣列物件
- JS陣列的方法JS陣列
- 陣列常用物件方法陣列物件
- js中陣列常用方法總結JS陣列
- Request 物件取陣列的方法物件陣列
- js 陣列方法JS陣列
- JS中陣列的遍歷方法(3種)JS陣列
- vue js 物件轉陣列VueJS物件陣列
- js物件陣列去重JS物件陣列
- js陣列物件去重JS陣列物件
- Js陣列物件的屬性值升序排序,並指定陣列中的某個物件移動到陣列的最前面JS陣列物件排序
- js常用的陣列方法JS陣列
- JS 陣列的迭代方法JS陣列
- js如何使用索引訪問陣列物件中的元素JS索引陣列物件
- js 在陣列物件中匹配到指定的資料JS陣列物件
- js物件陣列Date的比較JS物件陣列
- 複製物件重新賦值不改變原物件物件賦值
- 慎用JS中的slice()、concat()和assign()方法來複制陣列JS陣列
- Javascript中的陣列物件排序JavaScript陣列物件排序
- 在VUE中改變陣列、物件。頁面沒有變化Vue陣列物件