js对数组的操作非常频繁,但是每次用到的时候都会被搞混,都需要去查相关API,感觉这样很浪费时间。为了加深印象,所以整理一下对数组的相关操作。

常用的函数

concat()

连接两个或更多的数组,并返回结果。方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

var arr1 = [1, 2, 3]
var arr2 = ['a', 'b', 'c', 'd']
var arr3 = arr1.concat(arr2)
console.log(arr1, arr2, arr3)
// [1, 2, 3] ["a", "b", "c", "d"] [1, 2, 3, "a", "b", "c", "d"]
var arr4 = arr1.concat(1)
console.log(arr4)
// [1, 2, 3, 1]

join()

把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var str = arr1.join('-')
console.log(str)
// 1-2-3-4-5-6-7-8-9
var str1 = arr1.join()
console.log(str1)
// 1,2,3,4,5,6,7,8,9

pop()

删除并返回数组的最后一个元素,pop() 方法将删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.pop()
console.log(arr1, arr2)
// [1, 2, 3, 4, 5, 6, 7, 8] 9
var arr3 = []
var arr4 = arr3.pop()
console.log(arr3, arr4)
// [] undefined

shift()

删除并返回数组的第一个元素,如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值。请注意,该方法不创建新数组,而是直接修改原有的 arrayObject。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.shift()
console.log(arr1, arr2)
// [2, 3, 4, 5, 6, 7, 8, 9] 1

unshift()

向数组的开头添加一个或更多元素,并返回新的长度。unshift() 方法将把它的参数插入 arrayObject 的头部,并将已经存在的元素顺次地移到较高的下标处,以便留出空间。unshift() 方法不创建新的创建,而是直接修改原有的数组。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.unshift(0, 0, 0, 0)
console.log(arr1, arr2)
// [0, 0, 0, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 13

push()

向数组的末尾添加一个或更多元素,并返回新的长度。push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject,而不是创建一个新的数组。push() 方法和 pop() 方法使用数组提供的先进后出栈的功能。

var arr1 = [1, 2, 3, 4]
var arr2 = [5, 6, 7, 8, 9]
var arr3 = arr1.push(arr2)
console.log(arr1, arr2, arr3)
// [1, 2, 3, 4, [5, 6, 7, 8, 9]]  [5, 6, 7, 8, 9] 5
var arr4 = [1]
var arr5 = arr4.push(5, 6, 7, 8, 9)
console.log(arr4, arr5)
// [1, 5, 6, 7, 8, 9] 6

slice()

从某个已有的数组返回选定的元素,请注意,该方法并不会修改数组,而是返回一个子数组。您可使用负值从数组的尾部选取元素。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.slice(-5, -2)
console.log(arr1, arr2)
// [1, 2, 3, 4, 5, 6, 7, 8, 9] [5, 6, 7]
var arr3 = arr1.slice(2, 8)
console.log(arr3)
// [3, 4, 5, 6, 7, 8]
var arr4 = arr1.slice(5)
console.log(arr4)
// [6, 7, 8, 9]

splice()

删除元素,并向数组添加新元素。方法向/从数组中添加/删除项目,然后返回被删除的项目。该方法会改变原始数组。splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.splice(1, 5)
console.log(arr1, arr2)
// [1, 7, 8, 9]  [2, 3, 4, 5, 6]
var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr3 = arr1.splice(2, 3, [0, 0, 0, 0])
console.log(arr1, arr3)
// [1, 2, [0, 0, 0, 0], 6, 7, 8, 9]  [3, 4, 5]
var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr4 = arr1.splice(2, 3, 0, 0, 0, 0)
console.log(arr1, arr4)
// [1, 2, 0, 0, 0, 0, 6, 7, 8, 9]  [3, 4, 5]

sort()

对数组的元素进行排序,规定排序顺序。参数必须是函数。对数组的引用。请注意,数组在原数组上进行排序,不生成副本。

如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则返回一个大于 0 的值。

var arr1 = ['A', 'VCBJN', 'ksjn', 'adf', 'uuu']
var arr2 = arr1.sort()
console.log(arr1, arr2)
// ["A", "VCBJN", "adf", "ksjn", "uuu"] ["A", "VCBJN", "adf", "ksjn", "uuu"]
var arr1 = ['11', '2222', '3', '44', '555']
arr1.sort()
console.log(arr1)
// ["11", "2222", "3", "44", "555"]
var arr1 = ['11', '2222', '3', '44', '555']
arr1.sort((a, b) => a-b)
console.log(arr1)
// ["3", "11", "44", "555", "2222"]

reverse()

颠倒数组中元素的顺序。该方法会改变原来的数组,而不会创建新的数组。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.reverse()
console.log(arr1, arr2)
// [9, 8, 7, 6, 5, 4, 3, 2, 1]  [9, 8, 7, 6, 5, 4, 3, 2, 1]

toString()

把数组转换为字符串,并返回结果。当数组用于字符串环境时,JavaScript 会调用这一方法将数组自动转换成字符串。但是在某些情况下,需要显式地调用该方法。arrayObject 的字符串表示。返回值与没有参数的 join() 方法返回的字符串相同。

var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr2 = arr1.toString()
console.log(arr1, arr2)
// [1, 2, 3, 4, 5, 6, 7, 8, 9] "1,2,3,4,5,6,7,8,9"

toLocaleString()

把数组转换为本地数组,并返回结果。首先调用每个数组元素的 toLocaleString() 方法,然后使用地区特定的分隔符把生成的字符串连接起来,形成一个字符串。

var arr1 = ['jssj', 2, 3, '测试', 5, 6, 7, 8, 9]
var arr2 = arr1.toLocaleString()
console.log(arr1, arr2)
// ["jssj", 2, 3, "测试", 5, 6, 7, 8, 9] "jssj,2,3,测试,5,6,7,8,9"

valueOf()

valueOf() 方法返回 Array 对象的原始值。该原始值由 Array 对象派生的所有对象继承。valueOf() 方法通常由 JavaScript 在后台自动调用,并不显式地出现在代码中。

toSource()

返回该对象的源代码。该原始值由 Array 对象派生的所有对象继承。toSource() 方法通常由 JavaScript 在后台自动调用,并不显式地出现在代码中。只有 Gecko 核心的浏览器(比如 Firefox)支持该方法,也就是说 IE、Safari、Chrome、Opera 等浏览器均不支持该方法。

function employee(name,job,born) {
this.name=name;
this.job=job;
this.born=born;
}
var bill = new employee("Bill Gates","Engineer",1985);
console.log(bill.toSource());
// ({name:"Bill Gates", job:"Engineer", born:1985})

转载请标注原文地址 https://lion1ou.win/2018/04/24/

JavaScript之数组的常用操作函数的更多相关文章

  1. javascript 数组的常用操作函数

    join() Array.join(/* optional */ separator) 将数组转换为字符串,可带一个参数 separator (分隔符,默认为“,”). 与之相反的一个方法是:Stri ...

  2. JavaScript之字符串的常用操作函数

    字符串的操作在js中非常繁琐,但也非常重要.在使用过程中,也会经常忘记,今天就对这个进行一下整理. String 对象 String 对象用于处理文本(字符串). new String(s); // ...

  3. JavaScript中常见的字符串操作函数及用法

    JavaScript中常见的字符串操作函数及用法 最近几次参加前端实习生招聘的笔试,发现很多笔试题都会考到字符串的处理,比方说去哪儿网笔试题.淘宝的笔试题等.如果你经常参加笔试或者也是一个过来人,相信 ...

  4. byte数据的常用操作函数[转发]

    /// <summary> /// 本类提供了对byte数据的常用操作函数 /// </summary> public class ByteUtil { ','A','B',' ...

  5. javascript中数组的常用算法深入分析

    Array数组是Javascript构成的一个重要的部分,它可以用来存储字符串.对象.函数.Number,它是非常强大的.因此深入了解Array是前端必修的功课.本文将给大家详细介绍了javascri ...

  6. pandas_一维数组与常用操作

    # 一维数组与常用操作 import pandas as pd # 设置输出结果列对齐 pd.set_option('display.unicode.ambiguous_as_wide',True) ...

  7. Java实例 Part4:数组及其常用操作

    目录 Part4:数组及其常用操作 Example01:将二维数组的行列交换 Example02:使用选择排序法对数组进行排序 Example03:使用冒泡排序法对数组进行排序 Example04:使 ...

  8. php课程 4-17 数组键值操作函数有哪些

    php课程 4-17  数组键值操作函数有哪些 一.总结 一句话总结:多看学习视频 1.php中数组的键值操作函数有哪6个? • array_values();获取数组中的值• array_keys( ...

  9. Python--set常用操作函数

    python提供了常用的数据结构,其中之一就是set,python中的set是不支持索引的.值不能重复.无需插入的容器. 简单记录下set常用的操作函数: 1.新建一个set: set("H ...

随机推荐

  1. canvas学习笔记1

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  2. 1、Android-活动(上)

    1.1.活动是什么 活动(Activity)是最容易吸引用户的地方,他是一种可以包含用户界面的组件 主要用于和用户进行交互 一个用户可以包含零个或多个活动,不包含活动的程序少见 1.2.活动的基本用法 ...

  3. mean函数一个神代码

    cs231n上的一个代码,能求出准确率: print 'accuracy: %f' % ( np.mean(Yte_predict == Yte) ) >>> a = np.arra ...

  4. Spring(七)之基于注解配置

    基于注解的配置 从 Spring 2.5 开始就可以使用注解来配置依赖注入.而不是采用 XML 来描述一个 bean 连线,你可以使用相关类,方法或字段声明的注解,将 bean 配置移动到组件类本身. ...

  5. Maven Jetty插件使用

    本机环境 JDK8 Maven 3.5 Jetty 9.3 Eclipse Mars pom.xml配置 在你的 pom.xml 文件中添加 jetty 插件的描述信息 <build> & ...

  6. AFSoundManager

    iOS audio playing (both local and streaming) and recording made easy through a complete and block-dr ...

  7. Jfinal框架登陆页面的图形验证码

    本文转自,http://www.bubuko.com/infodetail-720511.html 验证码的工具类, 这个jfinal自带的也有,但是下面这个和Jfinal自带的有一点点小的改动,(我 ...

  8. openstack 虚拟机 迁移

    迁移. 如果 你的 云 系统 正在 使用 共享 存储, 使用 nova live- migration 命令 就可以. 首先, 要 获得 需要 被 迁移 的 实例 列表: # nova list -- ...

  9. 解决Windows下编辑脚本上传到Linux后遇到^M的方法

    Windows下编辑脚本上传到Linux后遇到^M,导致脚本无法执行,原因是因为Linux与Windows对 "回车键" 编码不同 解决方法如下: 在使用UE->文件-> ...

  10. execute immediate

    首先在这里发发牢骚,指责下那些刻板的书写方式,不考虑读者理不理解,感觉就是给专业人员用来复习用的一样,没有前戏,直接就高潮,实在受不了!没基础或基础差的完全不知道发生了什么,一脸懵逼的看着,一星差评! ...