JS数组的相关操作(循环、查找、过滤、排序等)

1. for…in…

注意点: 在企业开发中不推荐使用for…in循环来遍历数组

		let arr = [1, 3, 5, 7, 9];
        for(let key in arr){
            // console.log(key); // 数组索引
            console.log(arr[key]);
        }

不推荐的原因

for…in循环是专门用于遍历对象的, 但是对象的属性是无序的, 所以forin循环就是专门用于遍历无序的东西的, 所以不推荐使用forin循环来遍历数组

2. for…of…

利用ES6中推出的for of循环来遍历数组

	for(let value of arr){
        console.log(value);
    }

3. forEach

forEach方法会自动调用传入的函数
每次调用都会将当前遍历到的元素和当前遍历到的索引和当前被遍历的数组传递给这个函数

arr.forEach(function (currentValue, currentIndex, currentArray) {
   // console.log(currentValue, currentIndex, currentArray); // 数组每一项的值，索引，当前数组
   console.log(currentValue);
});

自己写forEach

		Array.prototype.myForEach = function (fn) {
            // this === [1, 3, 5, 7, 9]
            for(let i = 0; i < this.length; i++){
                fn(this[i], i, this);
            }
        };
        arr.myForEach(function (currentValue, currentIndex, currentArray) {
            console.log(currentValue, currentIndex, currentArray);
        });

4.findIndex

findIndex方法: 定制版的indexOf, 找到返回索引, 找不到返回-1

		let arr = [1, 3, 5, 7, 9];
        let index = arr.findIndex(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            if(currentValue === 3){
            // if(currentValue === 10){
                return true;
            }
        });
        console.log(index);

自己写findIndex

		Array.prototype.myFindIndex = function (fn) {
            for(let i = 0; i < this.length; i++){
                let result = fn(this[i], i, this);
                if(result){
                    return i;
                }
            }
            return -1;
        }

5.find

• findIndex方法返回索引, find方法返回找到的元素
• find方法如果找到了就返回找到的元素, 如果找不到就返回undefined

		let arr = [3, 2, 6, 7, 6];
		let value = arr.find(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            // if(currentValue === 3){
            if(currentValue === 10){
                return true;
            }
        });
        console.log(value);

自己写find

 		Array.prototype.myFind = function (fn) {
            for(let i = 0; i < this.length; i++){
                let result = fn(this[i], i, this);
                if(result){
                    return this[i];
                }
            }
            return undefined;
        }

6.filter

将满足条件的元素添加到一个新的数组中

		let arr = [1, 2, 3, 4, 5];
        let newArray = arr.filter(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            if(currentValue % 2 === 0){
                return true;
            }
        });
        console.log(newArray); // [2, 4]

自己写filter

		Array.prototype.myFilter = function (fn) {
            let newArray = [];
            for(let i = 0; i < this.length; i++){
                let result = fn(this[i], i, this);
                if(result){
                    newArray.push(this[i]);
                }
            }
            return newArray;
        }

7.map

将满足条件的元素映射到一个新的数组中

		let arr = [1, 2, 3, 4, 5];
		let newArray = arr.map(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            if(currentValue % 2 === 0){
                return true;
            }
        });
        console.log(newArray); // [undefined, 2, undefined, 4, undefined]

自己写map

		Array.prototype.myMap = function (fn) {
            let newArray = new Array(this.length);
            newArray.fill(undefined);
            for(let i = 0; i < this.length; i++){
                let result = fn(this[i], i, this);
                if(result != undefined){
                    newArray[i] = this[i];
                }
            }
            return newArray;
        }

8.sort

sort—MDN

• 如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；
• 如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变。
• 如果 compareFunction(a, b) 大于 0 ， b 会被排列到 a 之前
  注意点:

如果元素是字符串类型, 那么比较的是字符串的Unicode编码

		let arr = ["c", "a", "b"];
		arr.sort();
		console.log(arr); // ['a','b','c']

		arr.sort(function (a, b) {
            if(a > b){
                return -1;
            }else if(a < b){
                return 1;
            }else{
                return 0;
            }
        });
        console.log(arr);

		let arr = [3, 4, 2, 5, 1];
        // arr.sort();
        arr.sort(function (a, b) {
            // if(a > b){
            //     return -1;
            // }else if(a < b){
            //     return 1;
            // }else{
            //     return 0;
            // }
            // 规律: 如果数组中的元素是数值类型
            //       如果需要升序排序, 那么就返回a - b;
            //       如果需要降序排序, 那么就返回b - a;
            // return a - b;
            return b - a;
        });
        console.log(arr);

		let arr = ["1234", "21", "54321", "123", "6"];
        arr.sort(function (str1, str2) {
            // return str1.length - str2.length; // 字符串是特殊的数组，也有length
            return str2.length - str1.length;
        });
        console.log(arr);

		let students = [
            {name: "zs", age: 34},
            {name: "ls", age: 18},
            {name: "ww", age: 22},
            {name: "mm", age: 28},
        ];
        students.sort(function (o1, o2) {
            // return o1.age - o2.age;
            return o2.age - o1.age;
        });
        console.log(students);

学习笔记❥(^_-)