• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > JavaScript中数组Array方法详解

JavaScript中数组Array方法详解

作者:陌年古城 字体:[增加 减小] 来源:互联网 时间:2017-05-11

陌年古城通过本文主要向大家介绍了javascript array,javascript inarray,javascript new array,javascript中array,javascript array add等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的。

1、Array.join()方法

Array.join()方法将数组中所有元素都转化为字符串并连接在一起,返回最后生成的字符串。可以指定一个可选的符号或字符串在生成的字符串中来分隔数组的各个元素。如果不指定分隔符,默认使用逗号。注意:此方法不会改变原始数组

var arr = ['a', 'b', 'c'];
console.log(arr.join()); // a,b,c
console.log(arr.join(" ")); // a b c
console.log(arr.join("")); // abc
console.log(arr.join("slf")); // aslfbslfc
var arr2 = new Array(10);
console.log(arr2.join("-")); // ---------
</div>

扩展:Array.join()方法是String.split()方法的逆向操作,后者是将字符串分割成若干块来创建一个数组。

2、Array.reverse()方法

Array.reverse()方法将数组中的元素颠倒顺序,返回逆序的数组。它采取了替换;换句话说,它不通过重新排列的元素创建新的数组,而是在原先的数组中重新排列它们。注意:此方法会改变原始数组。

var arr = ['a', 'b', 'c'];
console.log(arr.reverse()); // ['c', 'b', 'a']
console.log(arr); // ['c', 'b', 'a']
</div>

3、Array.sort()方法

Array.sort()方法将数组中的元素排序并返回排序后的数组。当不带参数调用sort()方法时,数组元素以字母表顺序排序。注意:此方法会改变原始数组。

var arr = ['ba', 'b', 'ac'];
console.log(arr.sort()); // ['ac', 'b', 'ba']
console.log(arr); // ['ac', 'b', 'ba']
</div>

如果数组包含undefined元素,它们会被排到数组的尾部。

var arr = new Array(4);
arr[0] = 'ba';
arr[1] = 'b';
arr[2] = 'zc';
arr[3] = undefined;
console.log(arr.sort()); // ['ac', 'b', 'ba', undefined]
console.log(arr); // ['ac', 'b', 'ba', undefined]
</div>

如果想按照其他方式而非字母表顺序进行数组排序,则必须给sort()方法传递一个比较函数。该函数决定了它的两个参数在排好序的数组中的先后顺序。假设第一个参数在前,比较函数应该返回一个小于0的数值。反之,假设第一个参数在后,函数应该返回一个大于0的数值。并且,假设两个值相等(它们的顺序无关紧要),函数应该返回0。例如,用数值大小而非字母表顺序进行数组排序,代码如下:

var arr = new Array(4);
arr[0] = 45;
arr[1] = 12;
arr[2] = 103;
arr[3] = 24;
console.log(arr.sort()); // [103, 12, 24 45]
console.log(arr.sort(function(a, b){return b-a;})); // [103, 45, 24, 12]
</div>

有时候需要对一个字符串数组执行不区分大小写的字母表排序,这时可以使用比较函数,首先将参数都转化为小写字符串(使用toLowerCase()方法),再开始比较。

var arr = ['abc', 'Def', 'BoC', 'FED'];
console.log(arr.sort()); // ["BoC", "Def", "FED", "abc"]
console.log(arr.sort(function(s, t){
  var a = s.toLowerCase();
  var b = t.toLowerCase();
  if (a < b) return -1;
  if (a > b) return 1;
  return 0;
})); // ["abc", "BoC", "Def", "FED"]
</div>

4、Array.concat()方法

Array.concat()方法创建并返回一个新数组,它的元素包括调用concat()的原始数组的元素和concat()的每个参数。如果这些参数中的任何一个自身是数组,则连接的是数组的元素,而非数组本身。但要注意,concat()不会递归扁平化数组的数组。注意:此方法
不会修改原始数组。

var arr = ['abc', 'Def', 'BoC', 'FED'];
console.log(arr.concat(1, 2)); // ["abc", "Def", "BoC", "FED", 1, 2]
console.log(arr.concat(1, 2, [4, 5])); // ["abc", "Def", "BoC", "FED", 1, 2, 4, 5]
console.log(arr.concat(1, 2, [4, ['slf', 5]])); // ["abc", "Def", "BoC", "FED", 1, 2, 4, Array[2]]
console.log(arr); // ["abc", "Def", "BoC", "FED"]
</div>

5、Array.slice()方法

Array.slice()方法返回指定数组的一个片段或子数组。它的两个参数分别指定了片段的开始和结束的位置。返回的数组包含第一个参数指定的位置和所有到第二个参数指定的位置(但不含第二个参数指定的位置)之间的所有数组元素。如果只指定一个参数,返回的数组将包含从开始位置到数组结尾的所有元素。如参数中出现负数,它表示相对于数组中最后一个元素的位置。例如,参数-1指定了最后一个元素,而-3指定了倒数第三个元素。注意,此方法不会修改原始数组。

var arr = ['abc', 'Def', 'BoC', 'FED', 'slf'];
console.log(arr.slice(1, 2)); // ["Def"]
console.log(arr.slice(3)); // ["FED", 'slf']
console.log(arr.slice(0, -1)); // ['abc', 'Def', 'BoC', 'FED']
console.log(arr.slice(-3, -1)); // ['BoC', 'FED']
console.log(arr); // ['abc', 'Def', 'BoC', 'FED', 'slf']
</div>

6、Array.splice()方法

Array.splice()方法是在数组中插入或删除元素的通用方法。注意,splice()和slice()拥有非常相似的名字,但它们的功能却有本质的区别。splice()能够从数组中删除元素、插入元素到数组中或者同时完成这两种操作。在插入或删除点之后的数组元素会根据需要增加或减小它们的索引值,因此数组的其他部分仍然保持连续的。splice()的第一个参数指定了插入和(或)删除的起始位置。第二个参数指定了应该从数组中删除的元素的个数。如果省略第二个参数,从起始点开始到数组结尾的所有元素都将被删除。splice()返回一个由删除元素组成的数组,或者如果没有删除元素就返回一个空数组。注意:此方法会改变原始数组。(区别于concat(), splice()会插入数组本身而非数组的元素。)

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(arr.splice(7)); // [8, 9]
console.log(arr); // [1, 2, 3, 4, 5, 6, 7]
console.log(arr.splice(2, 4)); // [3, 4, 5]
console.log(arr); // [1, 2, 7]
console.log(arr.splice(2, 1, 3, 4, 5, 6)); // [7]
console.log(arr); // [1, 2, 3, 4, 5, 6]
console.log(arr.splice(3, 2, 3, [1, 2, 3])); // [4, 5]
console.log(arr); // [1, 2, 3, [1, 2, 3], 6]
</div>

7、Array.push()和Array.pop()方法

push()和pop()方法允许将数组当做栈来使用。push()方法在数组的尾部添加一个或多个元素,并返回数组新的长度。pop()方法则相反:它删除数组的最后一个元素,减小数组长度并返回它删除的值。注意:这两个方法都会修改原始数组。

var arr = [1, 2, 3];
console.log(arr.push(7)); // 4
console.log(arr); // [1, 2, 3, 7]
console.log(arr.push([2, 4])); // 5
console.log(arr); // [1, 2, 3, 7, [2, 4]]
console.log(arr.pop()); // [2, 4]
console.log(arr); // [1, 2, 3, 7]
</div>

8、Array.unshift()和Array.shift()方法

unshift()和shift()方法的行为非常类似于push()和pop()方法,不一样的是:前者是在数组的头部进行元素的插入和删除操作。unshift()在数组的头部添加一个或多个元素,并将已存在的元素移动到更高索引的位置来获得足够的空间,最后返回数组新的长度。shift()删除数组的第一个元素并返回所删除的元素,然后把所有随后的元素向前移动一个位置来填补数组头部的空缺。注意:这两个方法都会修改原始数组。

var arr = [6, 2, 3, 4, 5, 6];
console.log(arr.shift()); // 6
console.log(arr); // [2, 3, 4, 5, 6]
console.log(arr.unshift(['a', 'b'])); // 6
console.log(arr); // [['a', 'b'], 2, 3, 4, 5, 6]
console.log(arr.unshift('a', 'b')); // 8
console.log(arr); // ['a', 'b', ['a', 'b'] 2, 3, 4, 5, 6]
</div>

注意,当使用多个参数调用unshift()时,如果参数是一次性插入的而非一次一个地插入,这意味着最终的数组中插入的元素的顺序和它们在参数列表中的顺序一致。而假如元素是一次一个地插入,它们的顺序应该是反过来的。

var arr = [6, 2, 3, 4, 5, 6];
console.log(arr.unshift('a', 'b', 'c')); // 9
console.log(arr); // ['a', 'b', 'c', 6, 2, 3, 4, 5, 6]
console.log(arr.unshift(1)); // 10
console.log(arr); // [1, 'a', 'b', 'c', 6, 2, 3, 4, 5, 6]
console.log(arr.unshift(2)); // 11
console.log(arr); // [2, 1, 'a', 'b', 'c', 6, 2, 3, 4, 5, 6]
</div>

9、Array.toString()和Array.toLocaleString()方法

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • javascript 中关于array的常用方法详解
  • JavaScript原生数组Array常用方法
  • JavaScript中数组Array方法详解

相关文章

  • 2017-05-11js实现一键复制功能
  • 2017-05-11Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound的解决方法
  • 2017-05-11js实现弹窗暗层效果
  • 2017-05-11微信小程序实战之仿android fragment可滑动底部导航栏(4)
  • 2017-05-11使用vue.js实现checkbox的全选和多个的删除功能
  • 2017-05-11原生js更改css样式的两种方式
  • 2017-05-11jQuery实现单击按钮遮罩弹出对话框效果(1)
  • 2017-05-11js实现五星评价功能
  • 2017-05-11AngularJS 使用ng-repeat报错 [ngRepeat:dupes]
  • 2017-05-11jQuery制作图片旋转效果

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • JavaScript实现数组降维详解
    • 微信小程序 动态传参实例详解
    • vue-cli如何快速构建vue项目
    • 微信扫码支付零云插件版实例详解
    • JavaScript基本类型值-Number类型
    • jQuery实现用户输入自动完成功能
    • angularjs中使用ng-bind-html和ng-include的实例
    • Jquery实时监听input value的实例
    • js实现显示手机号码效果
    • JavaScript 批量创建数组的方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有