javascript数组详解


Posted in Javascript onOctober 22, 2014

如果你是一个有经验的开发者,你可能会认为这个问题比较简单,但是有的时候,我们会感觉这个问题比较有趣。

首先我们来看看数组的定义:“An array is just a list of values which can be accessed by using an integer as the “key”. The list starts at 0 and goes up from there.”,下面我们用对象来描述数组的定义:

var arr = ["benjamin", "zuojj"];

//=>

var arr = {

    "0": "benjamin",

    "1": "zuojj"

};

看上面的例子,总感觉缺少了什么,OK,数组的长度:

 var arr = {

    "0"      : "benjamin",

    "1"      : "zuojj",

    "length" : 2

};

我们知道,在Javascript语言中,数组是一个特殊的对象,我们可以使用访问数组的方式来访问对象的属性,同时,数组也可以像对象那样添加属性。看下例:

var arr = {

    "0"      : "benjamin",

    "1"      : "zuojj",

    "length" : 2

};

//Outputs: "benjamin"

console.log(arr[0]);

//Outputs: 2

console.log(arr.length);
var arr = ["benjamin", "zuojj"];

arr.url = "3water.com";

//Outputs: "3water.com"

console.log(arr.url);

//Outputs: 2

console.log(arr.length);

下面我们来看看数组的方法,数组有很多可操作的方法,如indexOf/slice/splice/sort等,我们知道实际上这些方法存在于Array.prototype中。看下面的例子:

var arr = ["benjamin", "zuojj"];

//Outputs: 1

console.log(arr.indexOf("zuojj"));

arr.indexOf = function(str) {

    return "It is customed indexOf!";

}

//Outputs: "It is customed indexOf!"

console.log(arr.indexOf("zuojj"));

事实上,我们可以使用对象重载所有的数组方法。看下面的push方法的例子:

var arr = {

    length: 0,

    push: function(val) {

        //赋值

        this[this.length] = val;

        //更新数组长度

        this.length += 1;

        //返回数组长度

        return this.length;

    }

}

arr.push("zuojj");

arr.push("benjamin");

//Object {0: "zuojj", 1: "benjamin", length: 2, push: function}

console.log(arr);

但是有一个是不能从新实现的,数组的字面量定义:

var arr = ["benjamin", "zuojj"];

但是我们可以使用构造函数来代替:

var arr = new Array("benjamin", "zuojj");

如果不适用字面量定义数组,那么我们可以重定义数组的定义,以我们自己的方式。

var myArr = new CustomArray("benjamin", "zuojj");

现在你知道javascript中数组是如何工作的了吧,希望对大家有所帮助。

Javascript 相关文章推荐
javascript 简单抽屉效果的实现代码
Mar 09 Javascript
10个很棒的jQuery代码片段
Sep 24 Javascript
果断收藏9个Javascript代码高亮脚本
Jan 06 Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
May 28 Javascript
jquery实现下拉框多选方法介绍
Jan 03 Javascript
5分钟打造简易高效的webpack常用配置
Jul 04 Javascript
bootstrap modal+gridview实现弹出框效果
Aug 15 Javascript
JS实现留言板功能[楼层效果展示]
Dec 27 Javascript
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
Aug 24 Javascript
微信小程序使用swiper组件实现类3D轮播图
Aug 29 Javascript
vue-i18n结合Element-ui的配置方法
May 20 Javascript
Node.JS如何实现JWT原理
Sep 18 Javascript
Javascript 数组排序详解
Oct 22 #Javascript
Javascript中arguments对象详解
Oct 22 #Javascript
Javascript中的默认参数详解
Oct 22 #Javascript
js style动态设置table高度
Oct 21 #Javascript
js读写json文件实例代码
Oct 21 #Javascript
一个JavaScript防止表单重复提交的实例
Oct 21 #Javascript
javascript Deferred和递归次数限制实例
Oct 21 #Javascript
You might like
纯php打造的tab选项卡效果代码(不用js)
2010/12/29 PHP
PHP+Mysql+jQuery查询和列表框选择操作实例讲解
2015/10/22 PHP
Ajax实现对静态页面的文章访问统计功能示例
2016/10/10 PHP
用JTrackBar实现的模拟苹果风格的滚动条
2007/08/06 Javascript
屏蔽F1~F12的快捷键的js函数
2010/05/06 Javascript
js常用代码段收集
2011/10/28 Javascript
原生JS实现加入收藏夹的代码
2013/10/24 Javascript
javascript编写实用的省市选择器
2015/02/12 Javascript
js中函数声明与函数表达式
2015/06/03 Javascript
在 Express 中使用模板引擎
2015/12/10 Javascript
JQuery导航菜单选择特效
2016/04/11 Javascript
javascript基础知识讲解
2017/01/11 Javascript
js通过指定下标或指定元素进行删除数组的实例
2017/01/12 Javascript
node.js与C语言 实现遍历文件夹下最大的文件,并输出路径,大小
2017/01/20 Javascript
JS常用倒计时代码实例总结
2017/02/07 Javascript
在 Node.js 中使用 async 函数的方法
2017/11/17 Javascript
js canvas实现红包照片效果
2018/08/21 Javascript
详解Vue前端生产环境发布配置实战篇
2019/05/07 Javascript
[01:50]2014DOTA2西雅图邀请赛 专访欢乐周宝龙
2014/07/08 DOTA
[04:52]2015国际邀请赛LGD战队晋级之路
2015/08/14 DOTA
python查找目录下指定扩展名的文件实例
2015/04/01 Python
利用Python中的输入和输出功能进行读取和写入的教程
2015/04/14 Python
Python对多属性的重复数据去重实例
2018/04/18 Python
python实时获取外部程序输出结果的方法
2019/01/12 Python
10 分钟快速入门 Python3的教程
2019/01/29 Python
Python3实现的判断环形链表算法示例
2019/03/07 Python
浅析python 通⽤爬⾍和聚焦爬⾍
2020/09/28 Python
Django正则URL匹配实现流程解析
2020/11/13 Python
.NET概念性的面试题
2012/02/29 面试题
运动会通讯稿400字
2014/01/28 职场文书
文科毕业生自荐书范文
2014/04/17 职场文书
家长会欢迎标语
2014/06/24 职场文书
小学生放飞梦想演讲稿
2014/08/26 职场文书
苹果M1芯片安装nginx 并且部署vue项目步骤详解
2021/11/20 Servers
项目中Nginx多级代理是如何获取客户端的真实IP地址
2022/05/30 Servers
python数字图像处理之对比度与亮度调整示例
2022/06/28 Python