资讯专栏INFORMATION COLUMN

JavaScript 之 核心语法 [ 数组 ]

mumumu / 3321人阅读

摘要:数组描述表示可以储存一个或多个数据值的有序集合数组中储存的数据中可以称为元素数组中可以储存任何类型的数据语法字面量方式数组名称元素,元素,构造函数方式数组名称元素元素函数方式数组名称元素元素长度表示数组的长度数组中储存元素的个数当使用

数组 描述

表示可以储存一个或多个数据值的有序集合

数组中储存的数据中可以称为元素

数组中可以储存任何类型的数据

语法

字面量方式 - var 数组名称 = [ 元素, 元素 , ... ]

构造函数方式 - var 数组名称 = new Array( 元素, 元素, ... )

函数方式 - var 数组名称 = Array( 元素, 元素, ... )

length(长度)

表示数组的长度(数组中储存元素的个数)

当使用构造函数方式或函数方式来定义数组,数组中的元素只有一个,并且为number类型时,表示定义数组的长度

字面量方式不能定义数组的长度

定义数组 字面量方式
/* 字面量方式 */
var arr1 = [];// 定义数组 - 数组中没有任何元素,称为空数组
console.log( arr1 );// 显示 - []
var arr2 = [ 100, "啊哈哈", true ];
console.log( arr2 );// 显示 - [ 100, "啊哈哈", true ]
var arr9 = [10];// 不能定义数组的长度
console.log( arr9 );// 显示 - [ 10 ]
构建函数方式
/* 构造函数方式 */
var arr3 = new Array();
console.log( arr3 );// 显示 - []
var arr4 = new Array( 100, "呀吼吼吼", true );
console.log( arr4 );// 显示 - [ 100, "呀吼吼吼", true ]
var arr5 = new Array( 10 );// 定义数组的长度
console.log( arr5 );// 显示 - [ <10 empty items> ]
函数方式
/* 函数方式 */
var arr6 = Array();
console.log( arr6 );// 显示 - []
var arr7 = Array( 100, "我的苍天呐", true );
console.log( arr7 );// 显示 - [ 100, "我的苍天呐", true ]
var arr8 = Array( 10 );// 定义数组的长度
console.log( arr8 );// 显示 - [ <10 empty items> ]
数组的类型

可以分为索引数组和关联数组

索引数组

表示数组中储存元素的位置用数字值来表示

数字值(也可以叫索引值)是从 0 开始

可以根据索引值来添加数组中的元素

JavaScript中定义数组的默认类型为索引数组

/* 索引数组 */
/* 定义一个空数组 */
var arr1 = [];
console.log( arr1 );// 显示 []
/* 为空数组中添加元素 */
arr1[0] = 100;// 根据索引值添加
arr1[1] = "啊哈哈";
arr1[2] = true;
console.log( arr1 );// 显示 [ 100, "啊哈哈", true ]
稀疏数组

是索引数组的另一种表现形式

稀疏数组的数组长度和数组中的有效内容不一致

稀疏数组的位置允许不连续,没有定义的位置默认为空(undefined)

/* 稀疏数组 */
var arr2 = [];
/* 为空数组中添加元素 */
arr2[0] = 100;// 允许不按照索引值的顺序进行添加
arr2[4] = 300;
arr2[8] = 500;
console.log( arr2 );// 显示 [ 100, <3 empty items>, 300, <3 empty items>, 500 ]
console.log( arr2.length );// 显示 9(有效数据只有三个)
关联数组

表示数组中储存元素的位置用字符串来表示

数组的长度(length)对关联数组没有效果

/* 关联数组 */
var arr3 = [];
/* 为空数组中添加元素 */
arr3["name"] = "啊哈哈";// 使用字符串方式添加元素
arr3["nian"] = 100;
arr3["gong"] = "深山";
console.log( arr3 );// 显示 [ name: "啊哈哈", nian: 100, gong: "深山" ]
console.log( arr3.length );// 显示 0(length无效)
数组的调用

表示提取数组中数据值进行显示

如果访问的元素位置未定义过 或 位置为空,提取的数据为 undefined ,语法不报错

索引数组

通过索引值来提取对应的元素

/* 索引数组 */
var arr1 = [ "啊哈哈", 100, true ];
/* 调用具体位置的元素 */
console.log( arr1[0] );// 显示对应数据内容  啊哈哈
/* 调用未定义位置的元素 */
console.log( arr1[4] );// 显示 undefined
稀疏数组

通过索引值来提取对应的元素

/* 稀疏数组 */
var arr2 = [];
arr2[0] = 100;
arr2[4] = 300;
arr2[8] = 500;
/* 调用具体位置的元素 */
console.log( arr2[0] );// 显示对应数据内容  100
/* 调用未定义位置的元素 */
console.log( arr2[5] );// 显示 undefined
关联数组

通过字符串来提取对应的元素

/* 关联数组 */
var arr3 = [];
arr3["name"] = "啊哈哈";
arr3["nian"] = 100;
arr3["gong"] = "深山";
/* 调用具体位置的元素 */
console.log( arr3["name"] );// 显示对应数据内容  啊哈哈
/* 调用未定义位置的元素 */
console.log( arr3["nm"] );// 显示 undefined
数组的修改

表示对数组中的数据值进行修改

通过数组的索引值找到对应元素的位置,在通过对指定数据进行重新赋值来完成数组修改

/* 索引数组 */
var arr1 = [];
arr1[0] = 100;
arr1[1] = 200;
console.log( arr1 );// 显示 [ 100, 200 ]
/* 对指定元素数据进行修改 */
arr1[0] = 400;
console.log( arr1 );// 显示 [ 400, 200 ]

/* 关联数组 */
var arr2 = [];
arr2["name"] = "啊哈哈";
arr2["nian"] = 100;
arr2["gong"] = "深山";
console.log( arr2 );// 显示 [ name: "啊哈哈", nian: 100, gong: "深山" ]
/* 对指定元素数据进行修改 */
arr2["name"] = "呀吼吼吼";
console.log( arr2 );// 显示 [ name: "呀吼吼吼", nian: 100, gong: "深山" ]
数组的删除

表示对数组中的数据值进行删除

使用delete运算符来删除数据值

但是只删除数据值,不删除数据值所占的位置空间

数组进行删除后会变成稀疏数组

var arr = [ 100, "哈哈哈", true ];
/* 使用delete运算符来对指定数据内容进行删除 */
delete arr [ 1 ];
/* 删除后会只删除数据内容,但不会删除数据所占的位置 */
console.log( arr );//显示结果:[ 100, <1 empty item>, true ]
console.log( arr.length );//显示数组中的数据个数  3
数组的复制

表示一个数组对另一个数组进行复制

复制分为深复制和浅复制

深复制

是复制数组中的数据值

如果对复制的数据内容进行修改,不会对复制的数组中的数据值进行修改

/* 深复制:是指对数组中的数据值进行复制 */
var arr1 = [ 100, "呀吼吼", true ];
var arr2 = [];
/* 使用循环语句对数组遍历,获得数组中的数据内容 */
for ( var a = 0; a < arr1.length; a++ ) {
    arr2 [ a ] = arr1 [ a ];//将获得的数据内容复制到另一个数组中
}
/* 显示复制效果 */
console.log( arr2 );// [ 100, "呀吼吼", true ]
/* 如果对复制的数据进行修改原本的数据不会被修改 */
arr2[ 1 ] = "哇哈哈";// 修改数据
console.log( arr2 );// 修改后效果:[ 100, "娃哈哈", true ]
console.log( arr1 );// 修改后效果:[ 100, "呀吼吼", true ]
浅复制

是复制在数组中储存的内容地址

如果对复制的数据内容进行修改,会同时修改被复制的数组中的数据值

/* 浅复制:是指对数组中存放的内容地址进行复制 */
var arr3 = [ 100, "呀吼吼", true ];
var arr4 = [];
arr4 = arr3;
console.log( arr3 );//显示效果:[ 100, "呀吼吼", true ]
/* 但是要注意如果对数据进行修改会同时修改 */
arr4[ 1 ] = "哇哈哈";//修改数据
console.log( arr4 );//修改后效果:[ 100, "娃哈哈", true ]
console.log( arr3 );//修改后效果:[ 100, "娃哈哈", true ]
数组的遍历

通过循环语句来获取数组中的全部数据内容

/* for语句遍历索引数组 */
var arr1 = [ "啊哈哈", 100, true, undefined, null ];
for ( var i = 0; i < arr1.length; i++ ) {
    console.log( arr1[i] );
}
for...in语句 语法
for ( var 变量 in 数组 ) {
    语句块
}

变量 - 表示得到的数组中的数据内容

/* for...in语句遍历索引数组 */
for ( var s in arr1 ) {
    console.log( arr1[s] );
}
for语句与for...in语句的对比

for语句

循环的开始和结束,可以由开发人员决定

由于稀疏数组的数组长度和数组的有效内容不一致,遍历出的数据值,不能过滤掉无效数据值

由于关联数组的数组长度无效,所以无法使用for语句进行循环遍历

for...in语句

循环只能从开始到结束

在遍历稀疏数组时可以过滤掉无效数据值,直接得到有效数据值

for...in语句可以对关联数组进行遍历

/* 稀疏数组 */
var arr2 = [];
arr2[0] = 100;
arr2[4] = 300;
arr2[8] = 500;
/* for语句遍历稀疏数组 */
for ( var a = 0; a < arr2.length; a++ ) {
    /* 得到全部数据值,包括无效数据值 */
    console.log( arr2[a]);
}
/* for...in语句遍历稀疏数组 */
for ( var b in arr2 ) {
    /* 可以得到数组中的有效数据值 */
    console.log( arr2[b] );
}

/* 关联数组 */
var arr3 = [];
arr3["name"] = "啊哈哈";
arr3["nian"] = 100;
arr3["gong"] = "深山";
/* for语句遍历关联数组 */
for ( var x = 0; x < arr3.length; x++ ) {
    /* 关联数组没有数组长度,所以无法遍历 */
    console.log( arr3[x] );
}
/* for...in语句遍历关联数组 */
for ( var y in arr3 ) {
    /* 可以遍历到数组中的数据值 */
    console.log( arr3[y] );
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/96781.html

相关文章

  • JavaScript核心语法数组

    摘要:数组一数组是什么是值得有序集合,每个元素都在数组里有唯一的位置,用数字表示,叫做索引数据用字符串表示,叫关联数组。 JS(JavaScript) 数组; 一.数组是什么; 是值得有序集合,每个元素都在数组里有唯一的位置,用数字表示,叫做索引数据;用字符串表示,叫关联数组。数组无类型;数组元素可以是类型,字符串,数字值,布尔值等数组动态的;向插入新元素,从数组中删除指定元素 二.一维数组...

    ghnor 评论0 收藏0
  • JavaScript 闯关记

    摘要:对象数组初始化表达式,闯关记之上文档对象模型是针对和文档的一个。闯关记之数组数组是值的有序集合。数组是动态的,根闯关记之语法的语法大量借鉴了及其他类语言如和的语法。 《JavaScript 闯关记》之 DOM(下) Element 类型 除了 Document 类型之外,Element 类型就要算是 Web 编程中最常用的类型了。Element 类型用于表现 XML 或 HTML 元素...

    mj 评论0 收藏0
  • 函数 - Javascript语法基础 - Javascript核心

    摘要:在定义函数的作用域外调用,得到的返回仍然是函数创建时所在的作用域的局部变量。这是因为所在的匿名函数的闭包中存放的是第一行的,而不是在循环中获得的的当前值。 原文: http://pij.robinqu.me/JavaScript_Core/JavaScript_Basics/Function.html 源代码: https://github.com/RobinQu/Pr...

    wuaiqiu 评论0 收藏0
  • 数组 - Javascript语法基础 - Javascript核心

    摘要:数组创建数组数组字面量使用构造函数数组本质上是所以要判断是不是数组,需要通过判断。数组长度使用属性获取元素的个数。例如函数的对象就是这样 原文: http://pij.robinqu.me/JavaScript_Core/JavaScript_Basics/Array.html 源代码: https://github.com/RobinQu/Programing-In-...

    molyzzx 评论0 收藏0
  • JavaScript 闯关记》对象

    摘要:属性名可以是包含空字符串在内的任意字符串,但对象中不能存在两个同名的属性。客户端中表示网页结构的对象均是宿主对象。这里的函数称做构造函数,构造函数用以初始化一个新创建的对象。通过关键字和构造函数调用创建的对象的原型就是构造函数的属性的值。 对象是 JavaScript 的数据类型。它将很多值(原始值或者其他对象)聚合在一起,可通过名字访问这些值,因此我们可以把它看成是从字符串到值的映射...

    rozbo 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<