重学JavaScript - 数组
作者:狐狸家的鱼
GitHub:surRimn
整理自MDN文档
数组
数组是一种类列表对象,长度和元素类型不固定。
描述
访问数组
JavaScript
数组的索引是从0开始的,第一个元素的索引为0,最后一个为数组长度减一。
如果指定的索引是一个无效值,不会报错,而是返回undefined
。
以数字开头的属性不能用点号引用,必须用方括号。
正则匹配结果所返回的数组
RegExp.exec
、String.match
、String.replace
都会返回这样的数组。
属性
Array.length
:Array
构造函数的length
属性,其值为1get Array[]
:返回Array
构造函数Array.prototype
:通过数组的原型对象可以为所有的数组对象添加属性
方法
Array.from()
:从类数据对象或者迭代对象中创建一个新的数组实例Array.isArrau()
:判断某个变量是否是一个数组对象Array.of()
:根据一组参数来创建新的数组实例,支持任意的参数数量和类型
数组实例
所有数组实例都会从Array,prototypr
继承属性和方法。修改Array
的原型会影响到所有的数组实例。
属性
Array.prototype.constructor
:所有的数组实例都继承了这个属性,它的值就是Array
,表面了所有的数组都是由Array
构造出来的 Array.prototype.length
:这个值为 0,因为它是个空数组
方法
- 修改器方法: 会改变调用它们的对象自身的值
- 访问方法:绝对不会改变调用它们的对象的值,只会返回一个新的数组或者返回一个其它的期望值。
- 迭代方法:数组遍历,不要尝试在遍历过程中对原数组进行任何修改
修改器方法 | 含义 |
---|---|
Array.prototype.pop() |
在数组内部,将元素序列拷贝到另一端元素序列上,覆盖原有的值 |
Array.prototype.push() |
在数组的末尾增加一个或多个元素,并返回数组的新长度 |
Array.prototype.reverse() |
颠倒数组中元素的排列顺序,即原先的第一个变为最后一个,原先的最后一个变为第一个 |
Array.prototype.shift() |
删除数组的第一个元素,并返回这个元素 |
Array.prototype.sort() |
对数组元素进行排序,并返回当前数组 |
Array.prototype.splice() |
在任意的位置给数组添加或删除任意个元素 |
Array.prototype.unshift() |
在数组的开头增加一个或多个元素,并返回数组的新长度 |
访问方法 | 含义 |
---|---|
Array.prototype.concat() |
返回一个由当前数组和其它若干个数组或者若干个非数组值组合而成的新数组 |
Array.prototype.join() |
连接所有数组元素组成一个字符串 |
Array.prototype.slice() |
抽取当前数组中的一段元素组合成一个新数组 |
Array.prototype.toString() |
返回一个由所有数组元素组合而成的字符串。遮蔽了原型链上的 Object.prototype.toString() 方法 |
Array.prototype.toLocaleString() |
返回一个由所有数组元素组合而成的本地化后的字符串。遮蔽了原型链上的 Object.prototype.toLocaleString() 方法 |
Array.prototype.indexOf() |
返回数组中第一个与指定值相等的元素的索引,如果找不到这样的元素,则返回 -1 |
Array.prototype.lastIndexOf() |
返回数组中最后一个(从右边数第一个)与指定值相等的元素的索引,如果找不到这样的元素,则返回 -1 |
迭代方法 | 含义 |
---|---|
Array.prototype.forEach() |
为数组中的每个元素执行一次回调函数 |
Array.prototype.every() |
如果数组中的每个元素都满足测试函数,则返回 true ,否则返回 false |
Array.prototype.some() |
如果数组中至少有一个元素满足测试函数,则返回 true ,否则返回 false |
Array.prototype.filter() |
将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回 |
Array.prototype.map() |
返回一个由回调函数的返回值组成的新数组 |
Array.prototype.reduce() |
从左到右为每个数组元素执行一次回调函数,并把上次回调函数的返回值放在一个暂存器中传给下次回调函数,并返回最后一次回调函数的返回值 |
Array.prototype.reduceRight() |
从右到左为每个数组元素执行一次回调函数,并把上次回调函数的返回值放在一个暂存器中传给下次回调函数,并返回最后一次回调函数的返回值 |
示例简单列表
创建数组
let person = [1, 2, 3];
通过索引访问数组元素
let first = person[0];//
let last = person[person.length - 1];//
遍历数组
person.forEach((item, index, array) => { })
添加元素到数组的末尾
let new = person.push(4);//[1, 2, 3, 4]
删除数组末尾的元素
person.pop();//[1, 2, 3]
删除数组最前面(头部)元素
person.shift();//[2, 3]
添加元素到数组的头部
person.unshift(1);//[1, 2, 3]
找出某个元素在数组中的索引
person.indexOf(1);//
通过索引删除某个元素
第一个参数代表开始索引位置,第二个参数代表个数
person.splice(1, 1);//[1, 3, 4]
从一个索引位置删除多个元素
person.splice(0, 2);//[4]
复制一个数组
let newPerson = person.slice();
重学JavaScript - 数组的更多相关文章
- 2.重学javascript 对象和数组
什么是对象,其实就是一种类型,即引用类型. 一.创建Object类型有两种. ①使用new运算符 <script type="text/javascript"> var ...
- 1.重学javascript (一)
一.script标签解析 <script>xxx</script>这组标签,是用于在html 页面中插入js的主要方法.它主要有以下 几个属性: 1.charset:可选.表示 ...
- 重学JavaScript - 映射与集合
作者:狐狸家的鱼 GitHub:surRimn 整理自MDN文档 带键的集合 映射 Map对象 一个Map对象在迭代时会根据对象中元素的插入顺序来进行 — 一个 for...of 循环在每次迭代后会返 ...
- 复习 Array,重学 JavaScript
1 数组与对象 在 JavaScript 中,一个对象的键只能有两种类型:string 和 symbol.下文只考虑键为字符串的情况. 1.1 创建对象 在创建对象时,若对象的键为数字,或者由 字母+ ...
- 重学JavaScript之面向对象的程序设计(继承)
1. 继承 ES 中只支持实现继承,而且其实现继承主要依靠原型链来实现的. 2. 原型链 ES中 描述了 原型链的概念,并将原型链作为实现继承的主要方法.其基本思想是利用原型让一个引用类型继承另一个引 ...
- 重学JavaScript之匿名函数
1. 什么是匿名函数? 匿名函数就是没有名字的函数,有时候也称为< 拉姆达函数>.匿名函数是一种强大的令人难以置信的工具.如下: function a(a1, a2, a3) { // 函 ...
- 重学js之JavaScript 面向对象的程序设计(创建对象)
注意: 本文章为 <重学js之JavaScript高级程序设计>系列第五章[JavaScript引用类型]. 关于<重学js之JavaScript高级程序设计>是重新回顾js基 ...
- 【跟着大佬学JavaScript】之数组去重(结果对比)
前言 数组去重在面试和工作中都是比较容易见到的问题. 这篇文章主要是来测试多个方法,对下面这个数组的去重结果进行分析讨论.如果有不对的地方,还请大家指出. const arr = [ 1, 1, &q ...
- 【从0到1学javascript】javascript数据结构----数组
javascript中对数组的定义 数组是一种特殊的对象,用来表示偏移量的索引是该对象的属性,索引可以是整数.这些数字索引在内部被转换成字符串类型.这是因为javascript对象中的属性名必须是字符 ...
随机推荐
- Java开发笔记(八十二)注解的基本单元——元注解
Java的注解非但是一种标记,还是一种特殊的类型,并且拥有专门的类型定义.前面介绍的五种内置注解,都可以找到对应的类型定义代码,例如查看注解@Override的源码,发现它的代码定义是下面这样的: @ ...
- Vue.js实现登录功能
编写html,通过vue-resource.js库向后台提交数据 <!DOCTYPE html> <html lang="en"> <head> ...
- Django之无名分组,有名分组
在Django 2.0版本之前,在urls,py文件中,用url设定视图函数 urlpatterns = [ url(r'login/',views.login), ] 其中第一个参数是正则匹配,如下 ...
- 基于Xamarin Android实现的简单的浏览器
最近做了一个Android浏览器,当然功能比较简单,主要实现了自己想要的一些功能……现在有好多浏览器为什么还要自己写?当你使用的时候总有那么一些地方不如意,于是就想自己写一个. 开发环境:Xamari ...
- CSS 三条横线等分
.header_qian { width: 1.5rem; height: 1.5rem; background: rgba(250, 250, 250,0.7); border-radius: 50 ...
- HTML/CSS快速入门
Web概念 JavaWeb 使用java语言开发基于互联网的项目 软件架构 C/S架构:Client/Server 客户端/服务器 用户本地有一个客户端程序,在远程有一个服务端程序 如QQ,英雄联盟. ...
- C#中try catch finally 用法
1.将预见可能引发异常的代码包含在try语句块中. 2.如果发生了异常,则转入catch的执行. catch有几种写法: catch 这将捕获任何发生的异常. catch(Exception e) ...
- centos修改默认启动级别
Linux分为7个启动级别: 0 - 系统停机状态 1 - 单用户工作状态 2 - 多用户状态(没有NFS) 3 - 多用户状态(有NFS) 4 - 系统未使用,留给用户 5 - 图形界面 6 - 系 ...
- vtop工具使用分析
vtop工具可以为esxtop提供图形界面,并且可以显示实时统计数据,对于我们监控esxi主机的需求匹配度很高,同时,相对于vcenter中的数据统计选项实时性更高,操作简便,可作为工作使用 为便于我 ...
- scrapy formRequest 表单提交
scrapy.FormRequest 主要用于提交表单数据 先来看一下源码 参数: formdata (dict or iterable of tuples) – is a dictionary ( ...