js中会改变原数组和不会改变原数组的方法

js中会改变原数组的方法

1. push( ) :数组的尾部添加一个或多个元素 并返回新的长度

     // Base
     var arr = [123, 'hello', true, function () { }, {}];
     arr.push('new data')
     console.log(arr);  // [123, 'hello', true, ƒ, {…}, 'new data']
     
     // More
     var arr = [123, 'hello', true, function () { }, {}];  
     arr.push('a', 'b'); // 一次添加多个值
     console.log(arr);  // [123, 'hello', true, ƒ, {…}, 'a', 'b']

2. unshift( ) :数组的头部添加一个或者多个元素 并返回新的长度

 // Base
 var arr = [123, 'hello', true, function () { }, {}];
 arr.unshift('new data')
 console.log(arr);  // [ 'new data'，123, 'hello', true, ƒ, {…}]
 
 // More
 var arr = [123, 'hello', true, function () { }, {}];
 arr.unshift('a', 'b')  // 一次添加多个值
 console.log(arr);  // [ 'a', 'b'，123, 'hello', true, ƒ, {…}]

3. pop( ) :删除数组的最后一个元素并返回删除的元素

var arr = ["Banana", "Orange", "Apple", "Strawberry"];
arr.pop()
console.log(arr);  // ["Banana", "Orange", "Apple"]

4. shift( ) :删除数组的第一个元素并返回删除的元素

var arr = ["Banana", "Orange", "Apple", "Strawberry"];
arr.shift()
console.log(arr);  // ["Orange", "Apple", "Strawberry"]

5. reverse( ) :翻转数组的元素排序

var arr= ["Banana", "Orange", "Apple", "Strawberry"];
arr.reverse();
console.log(arr);  // ['Strawberry', 'Apple', 'Orange', 'Banana']

6. splice(index, num, item1, item2...) :从索引index处删除num个元素（num必须是数字 可以为0 如果没有规定num 则从index处开始删除到数组末尾的所有元素）item1,item2,item3...表示要添加到数组的新元素

var arr= ["Banana", "Orange", "Apple", "Strawberry"];
arr.splice(2,1,"Lemon","Pear");
console.log(arr);  // ['Banana', 'Orange', 'Lemon', 'Pear', 'Strawberry']

7. sort( ) :用于对数组的元素进行排序(可以是字母或者数字 并按升序或者是降序 默认为字母升序)

```javascript
 // 字母排序
    var arr = ["Banana", "Orange", "Apple", "Strawberry"];
    arr.sort();
    console.log(arr);  // ['Apple', 'Banana', 'Orange', 'Strawberry']
     
     
    // 数字升序
    var num = [40, 99, 21, 66, 25, 10];
    num.sort(function(a,b){
          return a-b
     });
    console.log(num);  // [10, 21, 25, 40, 66, 99]
     
     
    // 数字降序
    var num = [40, 99, 21, 66, 25, 10];
    num.sort(function(a,b){
           return b-a
     });
    console.log(num);  // [99, 66, 40, 25, 21, 10]

js中不会改变原数组的方法

1. concat( ) :用于连接两个或多个数组

var arr1 = [1, 2, 3]
var arr2 = ['a', 'b', 'c']
var arr3 = [{ name: 'Lisa', age: 18 }, { name: 'Jack', age: 20 }]
var result = arr1.concat(arr2, arr3)
console.log(result);   // [1, 2, 3, 'a', 'b', 'c',  {name: 'Lisa', age: 18}, {name: 'Jack', age: 20}]

2. every( ) :用于检测数组所有的元素是否都符合指定条件 每一个都满足条件 返回true 有一个不满足 就会返回false 并且剩下的元素不会再进行检测 返回值为布尔值

 var arr=[12, 5, 4, 66, 21, 99]
 var result = arr.every(function (item) {
       return item >20
   })
 console.log(result);  // false

3. some( ) :用于检测数组中的元素是否满足指定条件 有一个元素满足条件 返回true 剩下的元素不会再进行检测 如果没有满足条件的元素 则返回false 返回值为布尔值

var arr = [12, 5, 4, 66, 21, 99]
var result = arr.some(function (item) {
     return item > 20
   })
console.log(result); // true

4. filter( ) :'过滤 筛选' 创建一个新的数组 新数组中的元素是通过检查指定数组中符合条件的所有元素 结果为true则保存新的数组中 结果为false则过滤掉

  var arr = [10, 236, 'hi', true, function () { }, { name: '张三' }];
  var result = arr.filter(function (item) {
            return typeof item == 'number' || typeof item == 'boolean' || item instanceof Function;
        });
  console.log(result);  // [10, 236, true, ƒ ()]

5. map( ) :'映射' 返回一个新数组 数组中的元素为原始数组元素调用函数处理后的值

var arr =[1, 2, 3, 4, 5, 6]
var result = arr.map(function (item) {
    return item + 'hi'
})
console.log(result);  // ['1hi', '2hi', '3hi', '4hi', '5hi', '6hi']

6. reduce( ) :接收一个函数作为累加器 数组中的每个值（从左到右）开始缩减 最终计算为一个值

语法：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

total为初始值 currentValue为当前元素  currentIndex为当前元素的索引 arr为数组本身  initialValue为传递给函数的初始值

 var arr = [1, 2, 3, 4, 5, 6]
 var result = arr.reduce(function (total,currentValue,currentIndex,arr) {
        return total + currentValue
    },10)
 console.log(result);  // 31

7. indexOf( ) :返回数组中某个指定的元素位置 (从索引为0开始 检查数组中是否包含有某个值 有则返回匹配到的第一个索引 没有则返回-1）

var arr = ["Banana", "Orange", "Apple", "Strawberry"];
var result = arr.indexOf('Orange');
console.log(result);  // 1

8. lastIndexOf( ) :返回一个指定的元素在数组中最后出现的位置 从该字符串的后面向前查找 (有则返回匹配到的第一个索引 没有则返回-1）

var arr = ["Banana", "Orange", "Apple", "Strawberry", "Apple", "Orange"];
var result = arr.lastIndexOf('Orange');
console.log(result);  // 5

9. forEach( ) :用于调用数组的每个元素，并将元素传递给回调函数 (循环遍历数组 参数是一个函数“回调函数” 函数的3个参数（1.当前元素 2.数组的索引 3.数组本身）)

var arr = [10, 236, 'hi', true, 'hello'];
arr.forEach(function (item, index, arr1) {
        console.log('index为' + [index], 'item为' + item);  
        // index为0 item为10  
        // index为1 item为236 
        // index为2 item为hi 
        // index为3 item为true 
        // index为4 item为hello
  })

10. join(separator) :用于把数组中的所有元素转换一个字符串 （separator表示要使用的分隔符 如果省略 则使用逗号隔开 如果为空字符串 则使用空格隔开 ）

// 填写参数
var arr = ["Banana", "Orange", "Apple", "Pear"];
var result = arr.join(" and ");
console.log(result);  // Banana and Orange and Apple and Pear
 
// 不写参数
var arr = ["Banana", "Orange", "Apple", "Pear"];
var result = arr.join();
console.log(result);  // Banana,Orange,Apple,Pear

11. slice(start,end) :从已有的数组中返回选定的元素 (start表示从哪里开始 如果为负数 就从倒数的第几个元素开始提取 end表示从哪里结束 如果没有指定 那么切分的数组从start到结束的所有元素 如果为负数 表示在原数组中的倒数第几个元素结束抽取)

 var arr = ["Banana", "Orange", "Apple", "Strawberry", 'Pear', 'Lemon'];
 var result = arr.slice(1, 3);
 console.log(result);   // ['Orange', 'Apple']
  
 
 var arr = ["Banana", "Orange", "Apple", "Strawberry", 'Pear', 'Lemon'];
 var result = arr.slice(-3);  // slice(-3) 表示提取原数组中的倒数第三个元素到最后一个元素（包含 最后一个元素）
 console.log(result);   // ['Strawberry', 'Pear', 'Lemon']
 
 
 var arr = ["Banana", "Orange", "Apple", "Strawberry", 'Pear', 'Lemon'];
 var result = arr.slice(-2,-1);  // slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）
 console.log(result);    // ['Pear']

12. toString( ) :将数组中的元素用逗号拼接成字符串 返回拼接后的字符串

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

13. valueOf( ) :返回数组对象的原始值

var arr = ["Banana", "Orange", "Apple", "Pear"];
arr.valueOf(); 
console.log(arr);  // ['Banana', 'Orange', 'Apple', 'Pear']