Ⅰ JS數組循環遍歷常用的9種方法
首先定義一個數組
const arr = [1,2,3,4,5,6];
第一種：for循環
for (let i = 0;i<arr.length;i++){
console.log(arr[i]);
}
for(j=0,len=arr.length;j<len;j++){}//這種方法基本上是所有循環遍歷方法中性能最高的一種
第二種 for of (需要ES6支持) 性能要好於forin，但仍然比不上普通for循環
for (let value of arr){
console.log(value);
}
第三種 for in 它的效率是最低的
for (let i in arr){
console.log(arr[i]);
}
第四種 foreach() 實際上性能比普通for循環弱
1、箭頭函數寫法
arr.forEach(value =>{
console.log(value);
})
2、普通函數寫法
arr.forEach(function(value){
console.log(value);
})
第五種 entries()
for (let [index, value] of arr.entries()) {
console.log(value);
}
第六種 keys()
for (let inx of arr.keys()){
console.log(arr[inx]);
}
第七種 rece()
1、箭頭函數
arr.rece((pre,cur)=>{
console.log(cur);
})
2、普通函數
arr.rece(function(pre,cur){
console.log(cur);
})
第八種 map() 但實際效率還比不上foreach
1、箭頭函數
arr.map(value=>{
console.log(value);
})
2、普通函數
arr.map(function(value){
console.log(value);
})
第九種 values()
for (let value of arr.values()){
console.log(value);
}
Ⅱ js遍歷數組some()方法
題目描述：在一個二維數組中（每個一維數組的長度相同），每一行都按照從左到右遞增的順序排序，每一列都按照從上到下遞增的順序排序。請完成一個函數，輸入這樣的一個二維數組和一個整數，判斷數組中是否含有該整數。一個簡單的數組遍歷題。
答案：js語言：
functionFind(target, array){returnarray.some(arr => arr.some(e => e === target))}
解釋：
外面的some方法是對每個一維進行遍歷，裡面的some方法是對每個一維的每一個元素進行遍歷，判斷是否嚴格等於要找的target元素，復雜度為n方。
=>是es6語法中的arrow function
例：(x) => x + 6 相當於
function(x){
return x + 6;
};
那麼e => e === target表示返回嚴格等於target的元素e
some()方法用於檢測數組中的元素是否滿足指定條件
some() 方法會依次執行數組的每個元素：
如果有一個元素滿足條件，則表達式返回 true , 剩餘的元素不會再執行檢測。
如果沒有滿足條件的元素，則返回false。
注意： some() 不會對空數組進行檢測。
注意： some() 不會改變原始數組。
這里小記一下some以及類似的every，對比一下其他遍歷方法
some() 有一個元素滿足條件，即返回true
const a = [1, 2, 3]console.log(a.some(v => v > 5)) //falseconsole.log(a.some(v => v < 2)) //true
every() 所有元素滿足條件，即返回true
const a = [1, 2, 3]console.log(a.every(v => v < 5)) //trueconsole.log(a.every(v => v < 2)) //false
filter() 返回包含滿足條件元素的數組
const a = [1, 2, 3]
console.log(a.filter(v => v < 3)) // [1, 2]
map() 返回一個新數組
const a = [1, 2, 3]
console.log(a.map(v => v + 5)) // [6, 7, 8]
forEach() 僅循環，無返回值，本質上相當於for
const a = [1, 2, 3]
a.forEach(v => console.log(v)) // 1 2 3
Ⅲ js遍歷多維數組（面向對象）
//實現一個 Array each方法 實現遍歷多維數組
var arr = [1,2,3,[4,[5,6]]]; //arr.length
Array.prototype.each = function(fn){
try{
//1 目的 遍歷數組的每一項 //計數器 記錄當前遍歷的元素位置
this.i || (this.i=0);
//2 嚴謹的判斷什麼時候去走each核心方法
//當數組的長度大於 0 的時候 && 傳遞的參數 必須為函數
if( this.length>0 && fn.constructor == Function ){
// 循環遍歷數組的每一項
while( this.i < this.length ){
//獲取數組的每一個值
var e = this[this.i]; //數組的每一項
//如果當前元素獲取到了 並且當前元素是一個數組
if(e && e.constructor == Array ){
//直接遞歸操作
e.each(fn);
}else{
//如果不是數組 （那就是一個單個元素）
//var obj = true;
//fn.apply(obj,[e]);
//這的目的就是為了把數組的當前元素 傳遞給fn函數，並且讓函數執行
fn.call(e,e);
}
this.i++
}
this.i == null ; //釋放內存 垃圾回收機制回收變數
}
}catch(err){
//do something
}
return this;
}
arr.each(function(item){
console.log(item)
});
Ⅳ js數組遍歷的常用的幾種方法以及差異和性能優化
<script type="text/javascript">
/*對比:
1、map速度比foreach快
2、map會返回一個新數組，不對原數組產生影響,foreach不會產生新數組，foreach返回undefined
3、map因為返回數組所以可以鏈式操作，foreach不能
4, map里可以用return ,而foreach里用return不起作用，foreach不能用break，會直接報錯*/
/*方法一:*/
var arr1 = [1, 2, 3, 4, 5, 6];
for(var i = 0, len = arr1.length; i < len; i++) { //優化性能處理
console.log(arr1[i], 'for遍歷出來的數據'); //每個item 1,2,3,4,5,6
}
/*方法二:*/
/*forEach方法中的function回調支持3個參數，第1個是遍歷的數組內容；第2個是對應的數組索引，第3個是數組本身*/
var arr2 = [{
name: 'bob',
age: 20
},
{
name: 'tom',
age: 18
},
{
name: 'sos',
age: 19
}
]
arr2.forEach((val, i) => { //沒有返回值的，對原來數組也沒有影響
console.log(val, '遍歷出來的每個obj')
});
/*方法三:*/
var fruits = [1, 2, 3, 4, 5, 6, 7, 8];
let arr = fruits.map((item, index) => {
console.log(item, 'top')
console.log(index, 'top')
return item * 8
})
console.log(arr, 'newarr') //[8, 16, 24, 32, 40, 48, 56, 64] "newarr"
var a = fruits.indexOf("Apple", 4);
console.log(a)
//for 和 forEach都是普通循環，map 帶返回值並且返回一個新數組；
/*
*當前元素的值,當期元素的索引值,當期元素屬於的數組對象;
語法:array.map(function(currentValue,index,arr), thisValue)
map() 方法返回一個新數組，數組中的元素為原始數組元素調用函數處理後的值。
map() 方法按照原始數組元素順序依次處理元素。
注意： map() 不會對空數組進行檢測。
注意： map() 不會改變原始數組。
* */
/*方法四:*/
/*兼容寫法：
不管是forEach還是map在IE6 - 8 下都不兼容（ 不兼容的情況下在Array.prototype上沒有這兩個方法）, 那麼需要我們自己封裝一個都兼容的方法：*/
/**
* forEach遍歷數組
* @param callback [function] 回調函數；
* @param context [object] 上下文；
*/
Array.prototype.myForEach = function myForEach(callback, context) {
context = context || window;
if('forEach' in Array.prototye) {
this.forEach(callback, context);
return;
}
//IE6-8下自己編寫回調函數執行的邏輯
for(var i = 0, len = this.length; i < len; i++) {
callback && callback.call(context, this[i], i, this);
}
}
/**
* map遍歷數組
* @param callback [function] 回調函數；
* @param context [object] 上下文；
*/
Array.prototype.myMap = function myMap(callback, context) {
context = context || window;
if('map' in Array.prototye) {
return this.map(callback, context);
}
//IE6-8下自己編寫回調函數執行的邏輯var newAry = [];
for(var i = 0, len = this.length; i < len; i++) {
if(typeof callback === 'function') {
var val = callback.call(context, this[i], i, this);
newAry[newAry.length] = val;
}
}
return newAry;
}
</script>
Ⅳ JS中幾種包含for的遍歷方式
數組的常用遍歷方法常用有：for、map、forEach
letarr=[1,2,3,4,5];
arr.forEach((i)=>{
console.log(i);//12345});
}
letarr=['a','b','c','d'];
letnewArr=arr.map((val,key)=>{
if(val=='c'){
returnval;
}
});
console.log(newArr);//[undefined,undefined,'c',undefined];
letarr=[10,20,30,40,50];
for(letiteminarr){
console.log(item);//'0''1''2''3''4'}
}
如果是對象數據（可枚舉屬性）
letobj={name:'xiaoming',age:15}
for(letiteminobj){
console.log(item);//nameage
}【秉著學習的態度，如有錯誤請指正】
Ⅵ js中遍歷數組對象的幾種方式
concat()連接兩個或更多的數組，並返回結果。
join()把數組的所有元素放入一個字元串。元素通過指定的分隔符進行分隔。
pop()刪除並返回數組的最後一個元素
push()向數組的末尾添加一個或更多元素，並返回新的長度。
reverse()顛倒數組中元素的順序。
shift()刪除並返回數組的第一個元素。
slice()從某個已有的數組返回選定的元素等等。