JS 数组

简介: JS 数组

数组


  • 数组:数据的有序列表,可以存放任意类型的数据,数组的大小可以动态调整。
  • 伪数组不属于Array,无法数组长度,允许修改值,例如:Arguments。
  • 通过 document.getElementsBy... 获得的数组都是伪数组。
  • 伪数组不能使用数组的部分方法或属性。
  • 创建数组的两种方式
  • 伪数组可以转成真数组,百度即可。


○ 数组字面量


var arr1 = []; // 创建一个空数组,数组字面量 var arr2=[1, 3, 4]; // 创建一个包含3个数值的数组,多个数组项以逗号隔开 var arr3= ["a", "b"]; // 创建一个包含2个字符串的数组


○ Array的构造函数


var arr4 = new Array(); // 创建一个 空数组 var arr5 = new Array(10); // 创建一个长度为10的数组 var arr6 = new Array("black", "white", "red"); // 创建一个包含3个字符串的数组


  • Array.isArray():HTML5中新增的。
  • push():在数组最后面插入,返回数组的长度。
  • pop():删除数组中的最后一个元素,返回被删除的元素。
  • unshift():在数组最前面插入,返回数组的长度。
  • shift():删除数组中的第一个元素,返回被删除的元素。
  • reverse():反转数组。
  • concat():把一个数组的所有参数拼接到另一个数组上面。
  • join():将数组以指定分割形式组成字符串输出,默认是以 “,” 分割。
  • slice():从当前数组截取一个新的数组,不影响原来的数组,参数start从0开始,end从1开始。


``` // 测试列表 var arr = [1,2,3,4,5];


// 从索引2的位置开始,超过元素长度返回空数组。 console.log(arr.slice(2)); // [3, 4, 5]


// 从数组尾部取2个元素,数组元素不够返回能截取的最大长度。 console.log(arr.slice(-2)); // [4, 5]


// arr.slice(开始位置,结束位置),结束位置一定要大于开始位置。 console.log(arr.slice(2,3)); // [3]


// 包左不包右,也就是索引1位置开始取,索引3位置的前一个停止,不会取索引3位置的元素。 console.log(arr.slice(1,3)); // [2, 3] ```


  • splice():删除或替换当前数组的某些元素,参数start、deleteCount、options(要替换的项目)。


``` // 测试列表 var arr = [1,2,3,4,5];


// 从索引2位置开始截取,超过元素长度返回空数组。 // console.log(arr.splice(2)); // [3, 4, 5] // console.log(arr); // [1, 2]


// 从数组尾部取2个元素,数组元素不够返回能截取的最大长度。 // console.log(arr.splice(-2)); // [4, 5] // console.log(arr); // [1, 2, 3]


// arr.splice(开始位置,截取长度)。 // console.log(arr.splice(0,3)); // [1, 2, 3] // console.log(arr); // [4, 5]


// arr.splice(开始位置,截取长度,截取之后插入的新元素,截取之后插入的新元素,...)。 // 截取之后插入的新元素:不能以数组的形式传入,否则会当成一个新元素插入,形成一个二维数组。 // console.log(arr.splice(0,3,2,3)); // [1, 2, 3] // console.log(arr); // [2, 3, 4, 5] ```


  • indexOf():从前往后查询元素索引,找到一个后立刻返回,如果没找到返回-1。
  • includes():判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
  • lastIndexOf():从后往前查询元素索引,找到一个后立刻返回,如果没找到返回-1。
  • sort():给数组排序,返回排序后的数组,默认是按字符串的Unicode码排序,还可以通过回调函数进行自定义排序规则。


``` // 测试列表 var arr = [1,21,15,2,3,4,5];


// 默认排序规则 arr.sort()


// 自定义排序规则 arr.sort(function(a,b){ // a-b 升序 // b-a 降序 return a-b; });


// 输出Unicode码 console.log('a'.charCodeAt()); ```


  • some():它的参数为函数,它会对数组中的每个元素运行传入函数,如果该函数有一项返回true,则some停止遍历返回true,否则会遍历完整个数组为止。


// 对数组中的每个元素运行以下函数,如果该函数有一项返回true,则some停止遍历返回true,否则会遍历完整个数组为止。 var bool = arr.some(function (item, index, array) { return true; });


  • every():它的参数为函数,它会对数组中的每个元素运行传入函数,如果都返回rue,every返回true,如果有一项返回false,every则停止遍历返回false。


// 对数组中的每个元素运行以下函数,如果都返回true,every返回true // 如果有一项返回false,every则停止遍历返回false。 var bool = arr.every(function (item, index, array) { return true; });


  • filter():它的参数为函数,它会对数组中的每个元素运行传入函数,该函数返回结果是true的元素组成的新数组。


// 对数组中每个元素运行以下函数,该函数返回结果是true的项组成的新数组 var newArr = arr.filter(function (item, index, array) { return true; });


  • forEach():它的参数为函数,它会对数组中的每个元素运行传入函数,遍历当前数组。


// 对数组中每个元素运行以下函数,遍历当前数组 arr.forEach(function (item, index, array) { console.log(item, index, array); });


  • map():它的参数为函数,它会对数组中的每个元素运行传入函数,返回该函数结果组成的新数组,不会影响原来的数组。


// 对数组中每个元素运行以下函数,返回该函数结果组成的新数组 var newArr = arr.map(function (item, index, array) { return item+1; });


清空数组


``` // 测试列表 var arr = [1,2,3,4,5];


// 第一种 // arr.splice(0); // arr.splice(0, arr.length);


// 第二种 // arr.length = 0;


// 第三种(这种比较常用) arr = []; ```


Instanceof


  • instanceof: 检查数据类型,只能判断对象数据类型。


``` var arr = [1,2,3]; var arr1 = Array(); var arr2 = new Array(); var str = new String('123'); var str1 = String('123'); var str2 = '123';


console.log(arr instanceof Array); // 1 console.log(arr1 instanceof Array); // 1 console.log(arr2 instanceof Array); // 1 console.log(str instanceof String); // 1 console.log(str1 instanceof String); // 0 console.log(str2 instanceof String); // 0 ```


Arguments


  • arguments:只在当前函数中使用,输出当前函数的实参数组(也就是当前传入进来的参数列表)。
  • arguments.callee:输出整个函数。


function fn(a, b) { // 形参个数 console.log(fn.length); // 实参列表 console.log(arguments); // 实参个数 console.log(arguments.length); // 输出整个函数 console.log(arguments.callee); }


相关文章
|
7天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
19 3
|
20天前
|
存储 JavaScript 索引
JS中数组的相关方法介绍
JS中数组的相关方法介绍
|
20天前
|
JavaScript Java
JS有趣的灵魂 清空数组
JS有趣的灵魂 清空数组
|
2月前
|
JavaScript 前端开发 API
常用JavaScript 数组 API大全
常用JavaScript 数组 API大全
32 0
|
2天前
|
JavaScript 前端开发 索引
JavaScript 数组的索引方法数组转换为字符串方法
JavaScript 数组的索引方法数组转换为字符串方法
|
2天前
|
JavaScript 前端开发
JavaScript 数组的添加删除和排序
JavaScript 数组的添加删除和排序
|
5天前
|
JavaScript 前端开发
js 操作数组的方法
js 操作数组的方法
15 4
|
12天前
|
JavaScript 前端开发
js数组过滤,从简单到多条!
js数组过滤,从简单到多条!
|
13天前
|
存储 JavaScript
|
13天前
|
JavaScript 前端开发 索引
JavaScript 数组中的增、删、改、查
JavaScript 数组中的增、删、改、查