js数组操作

Js中的数组是一种特殊的对象,用来表示偏移量的索引是该对象的属性。

文章目录

        • 一、对于数组的整体性操作
        • 二、数组的存取操作
            • 查找元素
            • 数组的字符串表示
            • 由已有数组创建新数组
        • 三、可变函数
            • 为数组添加元素
            • 从数组中删除元素
            • 从数组中间添加和删除元素
            • 为数组排序
        • 四、迭代器方法
            • 不生成新数组的迭代器方法
            • 生成新数组的迭代器方法

一、对于数组的整体性操作

对于数组的操作实际操作的是数组的索引

var nums = [];
for(var i =0 ;i <=10; i++){
  nums[i] = i+1;
}
var samenums = nums;/*只是为被赋值的数组增加了一个新的引用*/
nums[0] = 400;/*当改变nums数组的值得时候samenums的值也会变*/
console.log(samenums)

![在这里插入图片描述](https://img-blog.csdnimg.cn/2019011312073816.png

这种行为称为浅复制
一个更好的方案是使用深复制

function copy(arr1,arr2){
    for(var i =0;i<arr1.length;i++){
         arr2[i] = arr1[i]
    }
}
var nums = [];
for(var i = 0;i < 10;i++){
    nums[i] = i+1;
}
var samenums = [];
copy(nums,samenums);
nums[0] = 400;
console.log(samenums)/*改变nums的值不会改变samenums的值*/

在这里插入图片描述

利用es6的数组扩展运算符实现深复制

var nums = [];
 for(var i = 0;i < 10;i++){
     nums[i] = i+1;
 }
 var samenums = [];
 samenums = [...nums];
 nums[0] = 400;
 console.log(nums)
 console.log(samenums)/*改变nums的值不会改变samenums的值*/

在这里插入图片描述
利用数组的concat()方法实现深复制

    var nums = [];
    for(var i = 0;i < 10;i++){
        nums[i] = i+1;
    }
    var samenums = [];
    samenums = nums.concat();
    nums[0] = 400;
    console.log(nums)
    console.log(samenums)/*改变nums的值不会改变samenums的值*/

在这里插入图片描述

二、数组的存取操作

查找元素

indexOf()函数是最常用的存取函数之一,用来查找传进来的参数在目标数组中是否存在。包含则返回索引,不包含则返回-1。
lastIndexOf()函数返回相同元素中最后一个元素的索引。

数组的字符串表示

join()toString()都可以将数组转换为字符串

由已有数组创建新数组

concat()方法可以合并多个数组创建一个新数组
splice()方法截取一个数组的子集创建一个新数组,splice()方法还有别的用途比如为一个数组增加或删除元素。

三、可变函数

为数组添加元素

push()数组后插入
unshift()数组前插入
也可以使用length属性为数组添加元素,但push()方法看起来更直观

var num = [1,2,3]
num[num.length] = 4
console.log(num)

js数组操作_第1张图片

从数组中删除元素

pop()方法可以删除数组末尾的元素
shift()方法可以删除数组的第一个元素

从数组中间添加和删除元素

splice()可以方法为数组添加/替换/删除元素

splice(起始索引,[[需要删除额元素个数(天假元素时该参数设为0)],要添加的数组元素])
为数组排序

reverse()方法可以将数组中的元素进行翻转
sort()方法可以对数组进行排序,但是依据的字符串排序,如果要排列的元素是数字,sort()方法的排序结果就不能让人满意了。
但是可以在sort方法中传递一个对比函数!

    var num = [1, 200, 31, 100]
    num.sort()
    console.log(num)

    function compare(num1, num2) {
        return num1 - num2;
    }

    num.sort(compare);
    console.log(num)

在这里插入图片描述

四、迭代器方法

迭代器方法可以对数组中的每个元素对应执行一个函数

不生成新数组的迭代器方法

forEach(),该方法接收一个函数作为参数,对数组中的每个元素使用该函数。

    var num = [1, 200, 31, 100]

    function square(num) {
        console.log(num, num * num)
    }

    num.forEach(square)

在这里插入图片描述
every(),该方法接收一个返回值为布尔类型的函数,对数组中的每个元素使用该函数。如果对于所有的元素,该函数均返回true,则该方法返回true。

function isEven(num) {
      return num%2 == 0;
  }
  var nums = [1, 200, 31, 100]
  var even = nums.every(isEven)
  if(even){
      console.log("all numbers are even")
  }else {
      console.log("not all numbers are even")
  }

some()方法同every方法,只要有一个元素使得该函数返回true该函数就返回true。
reduce()方法接收一个函数,返回一个值。该方法会从一个累加值开始,不断对累加值和累加值和数组中的后续元素调用该函数,直到数组中的最后一个元素,最后返回得到的累加值。

  function add(runningTotal,currentValue) {
        return runningTotal+currentValue
    }
    var nums = [1, 200, 31, 100]
    var sum = nums.reduce(add)
    console.log(sum)//332

reduce()方法也可以用来将数组中的元素连接成一个长的字符串:

  function concat(accumulatedString,item) {
       return accumulatedString+item
   }
   var nums = ["the","quick","brown","fox"]
   var sum = nums.reduce(concat)
   console.log(sum)

在这里插入图片描述

reduceRight()方法与reduce(),方法相同,她是从右到左执行。

生成新数组的迭代器方法

map()filter()两个迭代器方法可以产生新数组。
map()forEach()有点像,对数组中的每个元素使用某个函数。两者区别是map函数返回一个新的数组,该数组的元素是对原有元素应用某个函数得到的结果。

function curve(grade) {
    return grade += 5;
}
var grades = [77,65,81,92,83]
var newgrades = grades.map(curve)
console.log(grades)
console.log(newgrades)

在这里插入图片描述
利用map()函数返回数组中的每个单词的第一个字母

function first(word) {
    return word[0]
}
var words = ["for","your","information"];
var acronym = words.map(first)
console.log(acronym)
console.log(acronym.join(""))

在这里插入图片描述
filter()every()类似,传入一个返回值为布尔类型的函数。和every()方法不同的是,当对数组中的所有元素应用该函数,结果均为true时,该方法返回一个新数组,该数组包含应用该函数后结果为true的元素。

你可能感兴趣的:(数据结构and算法,javascript)