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 相关文章推荐
23个超流行的jQuery相册插件整理分享
Apr 25 Javascript
javascript之bind使用介绍
Oct 09 Javascript
jquery如何把参数列严格转换成数组实现思路
Apr 01 Javascript
js实现可得到不同颜色值的颜色选择器实例
Feb 28 Javascript
jquery实现图片水平滚动效果代码分享
Aug 26 Javascript
jQuery设置单选按钮radio选中/不可用的实例代码
Jun 24 Javascript
零基础轻松学JavaScript闭包
Dec 30 Javascript
Vue.js中轻松解决v-for执行出错的三个方案
Jun 09 Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 Javascript
bootstrap table合并行数据并居中对齐效果
Oct 17 Javascript
Node.js 如何利用异步提升任务处理速度
Jan 07 Javascript
vue使用swiper实现中间大两边小的轮播图效果
Nov 24 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
从零开始的异世界生活:第二季延期后,B站上架了第二部剧场版
2020/05/06 日漫
了解Joomla 这款来自国外的php网站管理系统
2010/03/11 PHP
php数组添加与删除单元的常用函数实例分析
2015/02/16 PHP
php+mysql实现的二级联动菜单效果详解
2016/05/10 PHP
phpfpm的作用和用法
2019/10/10 PHP
javaScript 读取和设置文档元素的样式属性
2009/04/14 Javascript
js实现图片从左往右渐变切换效果的方法
2015/02/06 Javascript
JavaScript中获取HTML元素值的三种方法
2016/06/20 Javascript
Bootstrap面板(Panels)的简单实现代码
2017/03/17 Javascript
基于Bootstrap的标签页组件及bootstrap-tab使用说明
2017/07/25 Javascript
详解javascript中的babel到底是什么
2018/06/21 Javascript
vue 录制视频并压缩视频文件的方法
2018/07/27 Javascript
轻量级富文本编辑器wangEditor结合vue使用方法示例
2018/10/10 Javascript
Node.js中文件系统fs模块的使用及常用接口
2020/03/06 Javascript
vue实现购物车的监听
2020/04/20 Javascript
微信小程序收藏功能的实现代码
2020/06/19 Javascript
vue-quill-editor插入图片路径太长问题解决方法
2021/01/08 Vue.js
Python中的包和模块实例
2014/11/22 Python
在Python中使用第三方模块的教程
2015/04/27 Python
requests和lxml实现爬虫的方法
2017/06/11 Python
python数据结构链表之单向链表(实例讲解)
2017/07/25 Python
python正则表达式及使用正则表达式的例子
2018/01/22 Python
python使用sqlite3时游标使用方法
2018/03/13 Python
python保存文件方法小结
2018/07/27 Python
Python aiohttp百万并发极限测试实例分析
2019/10/26 Python
LightInTheBox法国站:中国跨境电商
2020/03/05 全球购物
销售业务员岗位职责
2014/01/29 职场文书
连锁超市项目计划书
2014/09/15 职场文书
2014医学院领导干部四风对照检查材料思想汇报
2014/09/16 职场文书
2015年度绩效考核工作总结
2015/05/27 职场文书
升学宴家长致辞
2015/07/27 职场文书
禁毒心得体会范文
2016/01/15 职场文书
课改心得体会范文
2016/01/25 职场文书
年终工作总结范文
2019/06/20 职场文书
一篇文章弄懂MySQL查询语句的执行过程
2021/05/07 MySQL
关于PostgreSQL JSONB的匹配和交集问题
2021/09/14 PostgreSQL