数组

简介

数组:值的有序集合。

元素:数组的每个值。数组元素可以是任意类型

索引:每个元素在数组中的位置,以数字表示。数组索引基于零的32位数值:第一个元素的索引为0,最大的索引为4 924 967 294(2^32 - 2),数组最大能容纳4 924 967 295个元素。

数组长度:每个数组都有一个length属性,代表数组中元素的个数。区别于常规的JavaScript对象。其值比数组中最大的索引大1。

稀疏数组:索引不连续的数组。数组元素之间可以有空缺。length属性值大于元素的个数。

JavaScript数组是JavaScript对象的特殊形式,数组索引实际上和碰巧是整数的属性名差不多。通常,数组的实现是经过优化的,用数字索引来访问数组元素一般来说比访问常规的对象属性要快很多。

创建数组

1. 数组直接量

在方括号中将数组元素用逗号隔开即可。

数组直接量的语法允许有可选的结尾的逗号,所以, [,,] 只有两个元素,length为2。**

2. 构造函数Array()

  • 调用时没有参数:创建一个没有任何元素的空数组,等同于数组直接量arrayObject
  • 调用时有一个数值参数:创建指定长度的数组,参数即长度。生成的数组都是稀疏数组。
  • 显式指定两个或多个数组元素或者数组的一个非数值元素:以这种形式,构造函数的参数将会成为新数组的元素。使用数组字面量比这样使用 Array() 构造函数要简单多了。

数组元素的读和写

使用[ ]操作符来访问数组中的一个元素。数组的引用位于方括号的左边。方括号中是一个返回非负整数的任意表达式。

数组是特殊的对象。对象也可以用arrayObject来访问对象的属性。当使用小于232的非负整数作为属性名时数组会自动维护其*length*属性值。所有的索引都是属性名,但只有0~232-1之间的整数属性名才是索引。

注意,可以使用负数或非整数来索引数组。这种情况下,数值转换为字符串,字符串作为属性名来用。名字不是非负整数,只能当做常规的对象属性,而不是索引。如果使用非负整数的字符串,就当做索引,而不是对象属性。浮点数和一个整数相等时也一样。

数组索引是对象属性名的一种特殊类型。这意味着JavaScript数组没有“越界”错误。当查询对象中不存在的属性时,不会报错,只会得到 undefined 值。

ECMAScript 5中数组可以定义元素的gettersetter方法。如果一个数组确实继承了元素或使用了元素的gettersetter方法,你应该期望他使用非优化的代码路径:访问这种数组的元素的时间会与常规对象属性的查找时间相近。

稀疏数组

可以用 delete 操作符来生产稀疏数组。

足够稀疏的数组在实现上比稠密的数组更慢、内存利用率更高,查找元素的时间与常规对象属性的查找时间一样长。

注意:数组直接量中省略值时会创建稀疏数组。省略的元素在数组中是不存在的。可以用 in 操作符来检测。

数组长度

设置length属性为一个小于当前长度的非负整数n时,当前数组中那些索引值大于或等于n的元素将被删除。

ECMAScript 5中,可以用 Object.defineProperty() 让数组的length属性变成只读的。

数组元素的添加和删除

  • 添加

    1. 为新索引赋值
    2. 使用 push() 方法在数组末尾增加一个或多个元素,并返回新的长度。不创建新数组,能改变原数组长度。
    3. unshift() 方法在数组的开头添加一个或多个元素,并且将其他元素依次移到更高的索引处。返回新的长度。不创建新数组,能改变原数组长度。
  • 删除

    1. 使用 delete 运算符来删除数组元素:
      删除数组元素与为其赋 undefined值是类似的。注意:对一个数组元素使用 delete 不会修改数组的length属性,也不会将其他元素从高索引处移下来填充已删除元素留下的空白。如果从一个数组中删除一个元素,就会变成稀疏数组。

    2. 设置lenght属性来删除数组尾部的元素:

    3. 使用 pop() 方法(它和 push() 一起使用):
      该方法用于删除并返回数组的最后一个元素。把数组长度减1,能改变数组长度。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。

    4. shift() 方法(它和 unshift() 一起使用):
      该方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。如果数组为空,则不进行任何操作,返回 undefined 值。该方法不创建新的数组,能改变数组长度。

    5. splice() 方法:
      向/从数组中添加/删除项目,然后返回被删除的项目。能改变数组长度。

      语法:

      arrayObject.splice(index,howmany,item1,...,itemx)
      
      参数 描述
      index 必需。整数,规定添加/删除项目的位置,使用负数可以从数组结尾处规定位置。
      howmany 必需。要删除的项目数量。如果设置为0,则不会删除项目。
      item1,...,itemx 可选。向数组添加的新项目。

      slice() 方法的区别:
      slice() 方法可以从已有的数组中返回选定的元素。可提取字符串的某个部分,并以新的字符串返回被提取的部分。不能改变原始数组。返回新数组。

      语法:

      array.slice(start, end)
      
      参数 描述
      start 可选。规定从何处开始选取。如果是负数,从尾部开始算起。即-1指最后一个元素,-2指倒数第二个元素,以此类推。
      end 可选。规定从何处结束选取。如果没有指定该参数,则切分的数组包含从start到数组结束所有的元素。如果是负数,则从数组尾部开始算起。

数组遍历

  • for循环

  • for/in循环处理稀疏数组

    循环每次将一个可枚举的属性名(包括数组索引)赋值给循变量。不存在的索引将不会遍历到。

  • forEach() 方法

    用于调用数组的每个元素,并将元素传递给回调函数。对空数组不执行操作。返回值为 undefined

多维数组

JavaScript不支持真正的多维数组,但可以用数组的数组来近似表示。访问数组的数组中的元素可以使用两次arrayObject操作符即可。

数组方法

  • join

    定义和用法

    把数组的所有元素转为字符串并连接在一起

    语法
    arrayObject.join(separator)
    
    参数

    separator:可选。要使用的分隔符,默认逗号。

    参数 描述
    start 可选。规定从何处开始选取。如果是负数,从尾部开始算起。即-1指最后一个元素,-2指倒数第二个元素,以此类推。
    end 可选。规定从何处结束选取。如果没有指定该参数,则切分的数组包含从start到数组结束所有的元素。如果是负数,则从数组尾部开始算起。
    返回值

    生成的字符串

    特点

    `String.split()的逆操作

  • reverse

    定义和用法

    将数组中的元素颠倒顺序

    语法
    arrayObject.reverse()
    
    参数

    返回值

    改变后的数组

    特点

    原数组会改变

  • sort

    定义和用法

    对数组的元素进行排序

    语法
    arrayObject.sort(sortby)
    
    参数
    参数 描述
    sortby 可选。排序顺序,必须是函数。
    返回值

    排序后的数组

    特点

    原数组会改变;

    当省略参数是,数组元素以字母表顺序排列(如有必要将临时转化为字符串比较。如果数组包含 undefined 会被放到数组尾部。比较数字时要注意);

    比较函数需要两个比较值(参数)a(在前)和b(在后):若 a<b,则顺序a→b,返回值<0;若a=b,则返回0;若a>b,则顺序b→a,返回值>0。(简单的说,a-b为升序,b-a为降序)

  • concat

    定义和用法

    连接两个或更多的数组

    语法
    arrayObject.concat(arrX,arrX,...,arrX)
    
    参数
    参数 描述
    arrX 必需可为具体元素或数组对象。可以是任意多个
    返回值

    新生成的数组

    特点

    不会改变原数组

  • slice

    定义和用法

    可从已有的数组中返回选定的元素

    语法
    arrayObject.slice(start,end)
    
    参数
    参数 描述
    start(包含) 必需开始的位置。若位负数则从尾部算起,即-1为最后一个,-2为倒数第二个。
    end(不包含) 可选结束位置。负数同上。
    返回值

    包含从startend(不包含)的新数组

    特点

    不会改变原数组

  • splice

    定义和用法

    从/向数组中添加/删除元素

    语法
    arrayObject.splice(index,howmany,item1,item2,...itemX)
    
    参数
    参数 描述
    index 必需。整数,开始的位置。负数同上。
    howmany 必需。删除的数量,0为不删除。
    item1,,...,itemX 可选。要添加的新元素。
    返回值

    一个由删除元素组成的数组,如果没有删除元素操作,就返回一个空数组。

    特点

    原数组会改变;

    区别于 concat()splice会插入数组本身,不是元素。concat() 连接数组,插入的是元素。

  • push

    定义和用法

    向数组末尾添加一个或多个元素

    语法
    arrayObject.push(newelement1,..,newelementX)
    
    参数
    参数 描述
    newelement1 必需。添加数组的第一个元素。
    newelement2 可选。添加数组的第二个元素。
    newelementX 可选。添加数组的第X个元素。
    返回值

    新数组的新长度

    特点

    原数组会改变;

  • pop

    定义和用法

    从/向数组中添加/删除元素

    语法
    arrayObject.pop()
    
    参数

    返回值

    被删除的值

    特点

    原数组会改变;

  • unshift

    定义和用法

    向数组开头添加一个或多个元素

    语法
    arrayObject.unshift(newelement1,..,newelementX)
    
    参数
    参数 描述
    newelement1 必需。添加数组的第一个元素。
    newelement2 可选。添加数组的第二个元素。
    newelementX 可选。添加数组的第X个元素。
    返回值

    新数组的新长度

    特点

    原数组会改变;

    当多个参数插入是一次性的,即数组中插入的元素顺序与在参数列表中的顺序一致。

  • shift

    定义和用法

    删除并返回数组的第一个元素

    语法
    arrayObject.shift()
    
    参数

    返回值

    第一个元素的值

    特点

    原数组会改变;

  • toString

    定义和用法

    把数组中的每个元素(如有必要会调用元素的 toString() 方法)转换为字符串

    语法
    arrayObject.toString()
    
    参数

    返回值

    转成的新字符串,与没有参数的 join() 返回值一样

    特点

    不会改变原数组;

    输出不包括方括号或其他任何形式的包裹数组值的分隔符,如:[1,[2,3]].toString() // 生成1,2,3

  • toLocaleString

    定义和用法

    toString() 方法的本地化版本

    语法
    arrayObject.toLocaleString()
    
    参数

    返回值

    数组的本地字符串表示

    特点

    不会改变原数组;

    它调用元素 toLocaleString() 方法将每个数组元素转化为字符串,并使用本地化(和自定义实现的)分隔符将这些字符串连接起来生成最终的字符串

↓ ECMAScript 5 中的数组方法 ↓

  • forEach

    定义和用法

    用于调用数组的每个元素,并将元素传递给回调函数

    语法
    arrayObject.forEach(function(value, index, arr), thisValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    thisValue 可选。传递给函数的值一般用“this”值。如果省略,“undefined”会传递给“this"值。
    返回值

    undefined

    特点

    操作 arr 参数可改变原数组。

    forEach() 无法在所有元素都传递给调用的函数之前终止遍历。如果要终止必须把 forEach() 方法放在一个 try 块中,并能抛出一个异常。如果 forEach() 调用的函数抛出 forEach.break 异常,循环会提前终止。

    对空数组不会执行回调函数。

  • map

    定义和用法

    将调用的数组的每个元素传递给指定函数,并返回一个数组

    语法
    arrayObject.map(function(value, index, arr), thisValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    thisValue 可选。对象作为该执行回调时使用,传递给函数,用作“this”的值。如果省略或者传入null、undefined,则回调函数的this为全局对象。
    返回值

    新数组,它不修改调用的数组。

    特点

    操作arr参数可改变原数组。

    如果是稀疏数组,返回也是同方式的稀疏数组:具有相同的长度,相同的缺失元素。

  • filter

    定义和用法

    创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素

    语法
    arrayObject.filter(function(value, index, arr), thisValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    thisValue 可选。对象作为该执行回调时使用,传递给函数,用作“this”的值。如果省略或者传入null、undefined,则回调函数的this为全局对象。
    返回值

    返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。

    特点

    不会改变原数组;

    filter() 会跳过稀疏数组的空缺元素,返回的数组总是稠密的;

    不会对空数组进行检测。

  • every

    定义和用法

    用于检测数组所有元素是否都符合指定条件(通过函数提供)

    语法
    arrayObject.every(function(value, index, arr), thisValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    thisValue 可选。对象作为该执行回调时使用,传递给函数,用作“this”的值。如果省略或者传入null、undefined,则回调函数的this为全局对象。
    返回值

    布尔值。使用指定函数检测数组中的所有元素都满足则返回 true,只要检测到有一个元素不满足则返回 false 并且剩余的元素不会再进行检测

    特点

    不会改变原数组;

    一旦确认返回则停止遍历;

    根据数学上管理,在空数组上调用时,every() 返回 truesome() 返回 false

    不会对空数组进行检测;

  • some

    定义和用法

    用于检测数组所有元素是否都符合指定条件(通过函数提供)

    语法
    arrayObject.some(function(value, index, arr), thisValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    thisValue 可选。对象作为该执行回调时使用,传递给函数,用作“this”的值。如果省略或者传入null、undefined,则回调函数的this为全局对象。
    返回值

    布尔值。使用指定函数检测数组中的所有元素都满足则返回 false,只要检测到有一个元素不满足则返回 true 并且剩余的元素不会再进行检测

    特点

    不会改变原数组;

    一旦确认返回则停止遍历;

    根据数学上管理,在空数组上调用时,every() 返回 truesome() 返回 false

    不会对空数组进行检测;

  • reduce

    定义和用法

    使用指定的函数将数组元素进行组合,生产单个值。接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。(也可称为“注入”、“折叠”)。可以作为一个高阶函数,用于函数的conpose

    语法
    arrayObject.reduce(function(total, value, index, arr), initialValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    total:必需。初始值,或计算结束后的返回值;<br />value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    initialValue 可选。传递给函数的初始值。
    返回值

    单个值

    特点

    不会改变原数组;

    不会对空数组进行检测;

  • reduceRight

    定义和用法

    使用指定的函数将数组元素进行组合,生产单个值。接收一个函数作为累加器,数组中的每个值(从右到左)开始缩减,最终计算为一个值。(也可称为“注入”、“折叠”)。可以作为一个高阶函数,用于函数的conpose

    语法
    arrayObject.reduceRight(function(total, value, index, arr), initialValue)
    
    参数
    参数 描述
    function(value, index, arr) 必需
    total:必需。初始值,或计算结束后的返回值;<br />value:必需当前元素;
    index:可选当前元素索引值;
    arr:可选。当前元素所属的数组;
    initialValue 可选。传递给函数的初始值。
    返回值

    单个值

    特点

    不会改变原数组;

    不会对空数组进行检测;

  • indexOf

    定义和用法

    搜索整个数组中具有给定值的元素,返回找到的第一个元素的索引或者如果没有找到就返回-1。indexOf() 从头至尾搜索

    语法
    arrayObject.indexOf(item, start)
    
    参数
    参数 描述
    item 必需。查找的元素
    start 可选。整数,在数组中开始的位置。省略则从数组的开头开始搜索
    返回值

    返回搜索到的元素位置,如果没有搜到返回-1

    特点

    不会改变原数组;

    字符串也有 indexOf()lastIndexOf() 方法,与数组方法的功能类似

  • lastIndexOf

    定义和用法

    搜索整个数组中具有给定值的元素,返回找到的第一个元素的索引或者如果没有找到就返回-1。lastIndexOf() 反向搜索

    语法
    arrayObject.lastIndexOf(item, start)
    
    参数
    参数 描述
    item 必需。查找的元素
    start 可选。整数,在数组中开始的位置。省略则从数组的开头开始搜索
    返回值

    返回搜索到的元素位置,如果没有搜到返回-1

    特点

    不会改变原数组;

    字符串也有 indexOf()lastIndexOf() 方法,与数组方法的功能类似

↓ 数组类型 ↓

  • isArray

    定义和用法

    用于判断一个对象是否为数组,是返回 true,否则返回 false

    语法
    arrayObject.isArray(obj)
    
    参数
    参数 描述
    obj 必需。要判断的对象
    返回值

    布尔值。判断一个对象是否为数组,是返回 true,否则返回 false

    特点

    判断是否为数组,instanceof 在浏览器中可能有多个窗口或窗体存在,每个窗口都有自己的JavaScript环境、全局对象,证明 instanceof 操作符不能准确检测数组。

数组对象

数组区别对象的特性:

  • 当有新元素添加到数组中,自动更新length属性。
  • 设置length为一个较小的值会截断数组。
  • Array.prototype 中继承一些有用的方法。
  • 其类型属性为”Array“。

JavaScript数组方法是特意定义为通用的,因此他们不仅应用在真正的数组而且在类数组对象上都能正常工作。ES5中所有的方法都是通用的。ES3中除了 toString()toLocaleString() 以外所有方法也是通用的。(concat() 方法是一个特例:虽然可以用在类数组对象上,但它没有将那个对象扩充进返回的数组中。)既然类数组对象没有继承自 Array.prototype,那就不能在他们上面直接调用数组方法。

作为数组的字符串

在ES5中字符串的行为类似于只读的数组。除了可以用 chartAt() 方法来访问单个的字符以外,还可以使用方括号。可索引的字符串的最大的好处就是简单,用方括号代替 chartAt() 调用,这样更加简洁、可读并且可能更加高效。字符串的行为类似于数组,使得通用的数组方法可以应用到字符串上。

注:字符串是不可变值,当把它们作为数组看待是,它们是只读的。能修改数组的方法在字符串上是无效的。如果使用数组方法修改字符串会报错。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,423评论 6 491
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,147评论 2 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,019评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,443评论 1 283
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,535评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,798评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,941评论 3 407
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,704评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,152评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,494评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,629评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,295评论 4 329
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,901评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,742评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,978评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,333评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,499评论 2 348