json对象数组的创建，遍历，增删改，数组的操作技巧

首先我们手动写个demo

let demo = {
    "name": 'jingjing',
    "age": 10,
    "likes": ['dancing', 'drawing', 'running'],
    "others": [
        {
            'name': 'li',
            'age': 50,
        },
        {
            'name': 'wang',
            'age': 0,
        },
    ],
}
let value = ''

遍历

1. forEach

demo.others.forEach(
    function (item, index) {
        if (item.name === 'li') {
            value = item.name
            return false;
        }
    }
)

2. for in

for (var index in demo.others) {
    if (demo.others[index].name === 'wang') {
        value = demo.others[index].name
    }else {
        // console.log('heh');
    }
}

3. for

for (var i = 0; i < demo.others.length; i++) {
    if (demo.others[i].name === 'wang') {
        value = demo.others[i].name
    }
}

添加

var add = {
    name:'liu',
    age:'22',
}
demo.others.push(add) //在最后添加
demo.others.unshift(add) //在最前面添加
demo.others.splice(1,0,add) //从下标1开始添加，不删除，添加的item

删除

delete demo.others[0]
demo.others.splice(1,1)

根据对象属性 得到/删除/修改 相应对象

1. 得到你想要的

//filter返回的饿是一个数组
var text = demo.others.filter((item) => {
    return item.name === 'wang'
})

结果⬇️

2. 删除你想要的

var text2 = demo.others.filter((item) => {
    return item.name === 'li'
}) //得到这个对象
var index = demo.others.indexOf(text2[0]) //得到这个对象的下标
index > -1 && demo.others.splice(index,1) //如果这个对象存在就删除他
console.log(demo.others);

3. 修改

var text3 = demo.others.filter((item) => {
    return item.name === 'wang'
})
text3[0].age = 100

总结一下数组的操纵技巧

1. push和pop尾部操作

push(): 在数组末尾添加元素，返回数组长度，会改变原数组
pop(): 删除数组最后一项，返回删除的元素,会改变原数组
会直接改变原数组

2. shift()和unshift()头部操作

shift(): 删除数组的第一项，返回删除元素的值,会改变原数组
unshift(): 在数组第一项前面添加元素，返回添加后数组长度，会改变原数组
两者都会改变原数组

3. splice 数组操作

splice(起始位置，操作个数，替换值(可空))

可以实现数组的插入、删除和替换
2个参数时，可以作删除操作，分别表示要删除数组第一个元素的位置和项数
3个参数时，可以做插入操作，分别表示起始位置、删除的项数（0）、插入的项
3个参数，可以作替换操作，分别表示起始位置、删除的项数、插入的项
改变原数组

4. concat

连接两个或多个数组
返回一个新的数组，不改变原数组

5. indexOf()和 lastIndexOf()

indexOf(): 接受两个参数，第一个表示要查找的元素，第二个表示起点位置索引，从数组的首位向后找，返回元素下标
lastIndexOf(): 接受两个参数，第一个表示要查找的元素，第二个表示起点位置索引，从数组末尾向前找，返回元素下标

var a = [1,3,5,7,9]
console.log(a.indexOf(9)) // 4
console.log(a.lastIndexOf(9)) // 4

6. slice()数组截取

返回数组中指定范围（下标）的数组元素组成的新数组
可以接受1或2个参数
1个参数表示的时数组的当前位置开始一直到数组末尾的所有项
2个参数则表示从起始位置至结束位置之间的所有项，但不包含结束位置项
不改变原数组

var a = [1,3,5,7,9]
a.slice(2) // [5,7,9] 从下标2开始一直截取到最后
a // [1,3,5,7,9]
a.slice(2,4)    // [5,7] // 从下标2开始截取到下标4的元素，不包含下标为4的值
a.slice()  // [1,3,5,7,9]
a.slice(1,-2) // [3,5] 终止下标为负数，出现负数时，将负数加上数组长度的值来替换该位置的数（1，3）
a.slice(-4,-1) // [3,5,7] 两个值都为负数时，都加上数组长度值（1，4）

7. reverse()

将数组中的元素倒叙排序，返回逆序的数据
不重新生成数组，而是在原先数组的基础上进行重新排列

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

8. join()转换成字符串

将数组中所有元素都转化为字符串并连接在一起，返回最后生成的字符串
可以指定一个可选的字符串在生成的字符串中来分隔数组的各个元素，默认为逗号

var a = [1,2,3,4]
console.log(a.join()); // "1,2,3,4"
console.log(a.join(""); // "1234"
console.log(a.join(" ")); // "1 2 3 4"
console.log(a.join("-")); // "1-2-3-4"

9. toString()

var a = [1,2,3,4]
console.log(a.toString()); // "1,2,3,4"

10. sort()排序

将数组中的元素排序并返回排序后的数组（按升序）
当不带参数调用sort时，数组元素以字母表的顺序排序

var a = ['aa', 'dd', 'bb', 'cc']
console.log(a.sort()); // ["aa", "bb", "cc", "dd"]
var a = [20,10,5,2,3,4]
console.log(a.sort()); // [10,2,20,3,4,5] 

在排序的时候，sort方法会去调用数组每一项的toString方法，不管数组元素是什么类型，都将转成字符串进行比较
解决上述问题:

var arr = [20,10,5,2,3,4]
  function sequence(a,b){
   return a - b;
  }
 console.log(arr.sort(sequence)); // [2,3,4,5,10,20]
//[总结]：
// A.若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
// B.若 a 等于 b，则返回 0。
// C.若 a 大于 b，则返回一个大于 0 的值

11. every()

判断数组中的每一项是否满足条件，只有当每一项都满足才返回true

var arr = [1,3,5,7,9];
var arr2 = arr.every(function(item){
return item < 10
});
console.log(arr2) // true

12. some()

判断数组中的每一项是否满足条件，只要有一项都满足就返回true

var arr = [1,3,5,7,9];
var arr2 = arr.some(function(item){
return item = 9
});
console.log(arr2) // true

13. reduce()和 reduceRight()

这两个方法都是用来迭代数组的所有项，最终会有一个返回值
reduce()：从数组的第一项开始，逐个遍历至最后一项
reduceRight(): 从数组最后一项开始，遍历至第一项
接受两个参数：（1）每项调用的函数 （2）初始值
函数里面包含四个参数：前一个值、当前值、元素索引和数组对象，该函数返回的任何值都会作为一个参数传给下一项，第一次迭代发生在数组的第二项上，因此第一个参数是数组的第一项，第二个参数就是数组的第二项
很多人不是很会用reduce，主要在于没有搞懂下面这个：
reduce中匿名函数输出项为下一次调用对匿名函数时的第一个参数
第一次调用对默认值是reduce的第二个参数，这个参数也能看出 reduce输出什么值

var arr = [1,3,5,7,9];
var sum = arr.reduceRight(function(prev, cur, index, array){
return prev + cur;
},10);
console.log(sum) // 35

在数组的原行上添加自己的方法并使用

比如我们增加了一个removeIf的删除指定的数组中的项目

Array.prototype.removeIf = function (filter) {
    let len = this.length;
    let count = 0;
    for (let i = 0; i < len; i++) {
        if (filter(this[i], i)) {
            this.splice(i, 1);
            count++;
            len--;
            i = -1;
        }
    }
    return count;
};

使用⬇️

function text10() {
    var arr = [
        {
            'name': 'li',
            'age': 50,
        },
        {
            'name': 'li',
            'age': 100,
        },
        {
            'name': 'liu',
            'age': 2,
        },
    ]
    var text2 = arr.removeIf((i) => i.name === 'li')
    console.log(arr);
    console.log('text2',text2); //[ {'name': 'liu','age': 2},]
}