Vue包含一组观察数组变异的方法，使用它们改变数组也会触发视图更新:
push() pop() shift() unshift()splice() sort() reverse()
不变异的方法:
filter() concat() slice()
原理:
-- Vue 在检测到数组变化时，并不是直接重新渲染整个列表，而是最大化复用DOM元素。替换的数组中，含有相同元素的项不会被重新渲染，
因此可以大胆的用新数组来替换旧数组，不用担心性能问题。
-- 值得注意的是：
以下变动的数组中Vue是不能检测到的，也不会触发视图更新。
1.通过索引直接设置项， 比如this.books[3]={...}
2.修改数组长度， 比如 this.books.length = 1;
两个问题都可以用splice来解决：
第一个问题 还可以用 set方法 this.$set(this.books,3,{...})
数组API总结：
/* concat()
1.不会改变现有的数组
2.连接两个或多个数组，返回被连接后的新数组 */
let a = [1,2,3];
let b = [4,5,6];
let c = [7,8,9];
let d = a.concat(b,c) //[1,2,3,4,5,6,7,8,9]
/*slice(start,end)
1.不会改变现有的数组
2.截取数组中的部分元素，并返回一个新的数组
3.start : 必填，起始下标（包含）；
end : 可选，结束下标（不包含），当结束小标不存在时，默认最后
*/
let a = [1,2,3,4,5,6]
let b = a.slice(2,4) //[3,4]
let c = a.slice(4) //[5,6]
/*push()
1.改变现有的数组(包括长度)
2.末尾添加一个或多个元素，并返回新的长度。*/
let a = [1,2,3]
let l = a.push(4,5,6,7) // 7 返回新的长度
console.log(a) //[1,2,3,4,5,6,7]
/*unshift()
1.改变现有的数组(包括长度)
2.开头添加一个或多个元素，并返回新的长度。*/
let a = [3,4,5]
let l = a.unshift(1,2) // 5 返回新的长度
console.log(a) //[1,2,3,4,5]
/*splice(index,howMany,item1,...itemN)
1.改变现有的数组(包括长度)
2.数组中添加/删除项目，然后返回被删除的‘元素组成的新数组’。
3.index : 必填，添加/删除元素的下标
howMany : 必填，要删除元素的数量，为0，不会删除元素
item.. : 选填，向数组的index下标处添加新的元素*/
let a = [1,2,3,4,5]
let b = a.splice(2,2,'ss')
console.log(b) // [3,4] 返回被删除的元素组成的新数组
console.log(a) // [1,2,'ss',5]
/*pop()
1.改变现有的数组(包括长度)
2.删除数组的最后一个元素，并返回其值*/
let a = [1,2,3]
let b = a.pop() // 3
console.log(a) // [1,2]
let c = a.pop() // 2
console.log(a) //[1]
let d = a.pop() //1
console.log(a) //[]
let e = a.pop() // undefined （这时数组已经空了，不会改变数组，返回undefined值）
console.log(a) //[]
/*shif()
1.改变现有的数组(包括长度)
2.删除数组的第一个元素，并返回其值*/
let a = [1,2,3]
let b = a.shift() // 1
console.log(a) // [2,3]
let c = a.shift() // 2
console.log(a) //[3]
let d = a.shift() //3
console.log(a) // []
let e = a.shift() //undefined （这时数组已经空了，不会改变数组，返回undefined值）
console.log(a) // []
/*sort(sortby)
1.改变现有的数组(不包括长度)
2.仅仅是对数组的元素进行排序，是对数组的引用，返回的还是原数组；
3.sortby : 可选，规定排序规则，必须是函数，该函数接收两个参数a和b
注意：@1.如果使用时没有传入sortby,将按照字符编码顺序对数组中的元素进行排序，且元素都应该转换成字符串
@2.sortby使用，比较a和b，如果a < b ,返回小于0的值，a排在b前，a = b ,返回0，a>b 返回 大于0的值*/
//数字排序
let a = [3,2,6,7,1,4,5]
let sortNumber = function(a,b){
return a-b
}
a.sort(sortNumber) //[1,2,3,4,5,6,7]
//默认字符编码排序 (排的是字符串的首字母)
let a = ['s','aa','ddy','hello','world']
a.sort() //["aa", "ddy", "hello", "s", "world"]
/*reverse()
1.改变现有的数组（不包括长度）
2.颠倒数组中元素的顺序*/
let a = [1,2,3,4,5,6,7]
a.reverse() //[7,6,5,4,3,2,1]
/*join(separator)
1.不会改变现有的数组
2.不带separaor参数时，仅仅是将数组中的所有元素放入一个字符串中，并返回结果
3.带有separaor参数时，同时会通过指定的separator(分隔符)分隔元素，在返回结果*/
let a = [1,2,3,4,5,6]
let b = a.join() // "1,2,3,4,5,6"
let c = a.join('-') // "1-2-3-4-5-6"
let d = a.join(' ') // "1 2 3 4 5 6" 空格符
console.log(a) // [1,2,3,4,5,6]
/*toString()
1.不会改变现有的数组
2.把数组转换为字符串，并返回结果*/
let a = [1,2,3,4,5]
let b = a.toString() // 1,2,3,4,5
let c = a.join();
console.log(b === c) //true
//========================================================
const arr = [
{name : 'name1',author:'aaa'},
{name : 'name2',author:'abb'},
{name : 'javascript shishi',author:'acc'},
{name : 'javascript 金翠',author:'add'},
];
/*forEach()
arr.filter(function(item){
return item.name.match(/javascript/)
})
1.*/
/*map()
1.*/
/*filter()
1.*/
/*reduce()
1.*/
/*indexOf()
1.*/
