常用的 遍历(数组和对象)方法 排序等

1 forEach 用于遍历【数组】

data.forEach(( item, index ) => {
    console.log('元素:', item ,';下标:', index)
})

2 Object.keys() 和 forEach() 结合遍历【对象】

Object.keys(testData).forEach((key)=>{   
    console.log(key) //键
    console.log(testData[key]) //值
}) 

另外Object.keys还有一个妙用就是获取对象的长度,在js中数组长度可用length得到,对象长度用length获取的结果是undefined,使用Object.keys(obj).length就可以得到对象长度了。

3 for…of (es6)用于遍历【数组】内的【元素】,不包括原型属性和索引名

let myArray = [1,2,4,11,6,7]
for (let value of myArray) {
    console.log(value)  //一次输出元素1、2、4、11、6、7
}

4 for…in (es5)用于遍历【对象/数组】内的【键名】,包括原型属性 (所以慎用!)

let myArray = ['a',123,{a:'1',b:'2'}] 	//或为对象myArray = {a:'1',b:'2'}
for(let index in myArray){
    console.log(index,myArray[index]) 	//输出键名 和 元素值
}

// 注意1:for..in会把某个类型的原型(prototype)中的方法与属性遍历出来
// 不想遍历原型方法和属性的话,可以在循环内部使用hasOwnPropery方法可以判断某属性是否是该对象的实例属性
if(!array.hasOwnProperty(i)){
    continue;
}

// 注意2:for..in遍历对象{}时出来的顺序不一定是对象属性原来的顺序,顺序和Object.keys相同。

5 foreach循环

var ary=["for-each 04","for-each 03","for-each 02","for-each 01"];
ary.forEach(function (i){
      console.log(i);
})

6 map 循环

//返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
// map() 方法按照原始数组元素顺序依次处理元素。
//filter方法不会改变原数组,不对空数组进行检测
const arr= [4, 9, 16, 25];
const arr1 = arr.map(item => item+2)
console.log(arr) // [4, 9, 16, 25]
console.log(arr1) // [6, 11, 18, 27]

遍历性能延伸

//倒序(数组最优遍历方式)
var i = arr.length;
while (i--) { } 
 
//对象遍历方式
var val;
for(var key in obj){
   val = obj[key]
}

sort数组排序

const array = ['a','c','b','d'];
array.sort();
console.log(array); // "a", "b", "c", "d"

reverse 数组反转

const array = ['a','c','b','d'];
array.reverse();
console.log(array); // "d", "b", "c", "a"

findIndex返回符合函数条件的数组元素下标,空数组不会执行。 findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。 findIndex() 方法为数组中的每个元素都调用一次函数执行:

//当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
//如果没有符合条件的元素返回 -1
//findIndex() 对于空数组,函数是不会执行的。
//findIndex() 并没有改变数组的原始值。
const arr= [4, 9, 16, 25];
const b = arr.findIndex(item => item>10)
const c = arr.findIndex(item => item<1)
console.log(arr)   // [4, 9, 16, 25]
console.log(b)  // 2
console.log(c)  // -1

some方法会检测数组中的元素是否满足指定条件(函数提供)。 some() 方法会依次执行数组的每个元素:

//如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
//如果没有满足条件的元素,则返回false。
//some() 不会对空数组进行检测。空数组不会执行。
//some() 不会改变原始数组。
const arr= [4, 9, 16, 25];
const b = arr.some(item => item>10)
const c = arr.some(item => item<1)
console.log(arr)   // [4, 9, 16, 25]
console.log(b)  // true
console.log(c)  // false

every检测数组中的元素是否都满足条件,有一个不满足条件的则返回false,空数组不会执行。 every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。 every() 方法使用指定函数检测数组中的所有元素:

//如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
//如果所有元素都满足条件,则返回 true。
//every() 不会对空数组进行检测。
//every() 不会改变原始数组。
const arr= [4, 9, 16, 25];
const b = arr.every(item => item>10)
const c = arr.every(item => item>1)
console.log(arr)   // [4, 9, 16, 25]
console.log(b)  // false
console.log(c)  // true

你可能感兴趣的:(js基础,javascript)