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 相关文章推荐
jquery中ajax学习笔记一
Oct 16 Javascript
jQuery中append()方法用法实例
Dec 25 Javascript
JS实现跟随鼠标立体翻转图片的方法
May 04 Javascript
微信企业号开发之微信考勤百度地图定位
Sep 11 Javascript
详解PHP中pathinfo()函数导致的安全问题
Jan 05 Javascript
JavaScript实现单击网页任意位置打开新窗口与关闭窗口的方法
Sep 21 Javascript
js通过Date对象实现倒计时动画效果
Oct 27 Javascript
vue.js配合$.post从后台获取数据简单demo分享
Aug 11 Javascript
Vue-cli@3.0 插件系统简析
Sep 05 Javascript
jQuery实现为动态添加的元素绑定事件实例分析
Sep 07 jQuery
vue 页面回退mounted函数不执行的解决方案
Jul 26 Javascript
js实现Element中input组件的部分功能并封装成组件(实例代码)
Mar 02 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中对xml读取的相关函数的介绍一
2008/06/05 PHP
用C/C++扩展你的PHP 为你的php增加功能
2012/09/06 PHP
php查找字符串出现次数的方法
2014/12/01 PHP
php利用smtp类实现电子邮件发送
2015/10/30 PHP
YII2框架中使用yii.js实现的post请求
2017/04/09 PHP
PHP实现将几张照片拼接到一起的合成图片功能【便于整体打印输出】
2017/11/14 PHP
innerHTML,outerHTML,innerTEXT三者之间的区别
2007/01/28 Javascript
总结AJAX相关JS代码片段和浏览器模型
2007/08/15 Javascript
Dom 是什么的详细说明
2010/10/25 Javascript
整理一些JavaScript的IE和火狐的兼容性注意事项
2011/03/17 Javascript
jQuery 设置 CSS 属性示例介绍
2014/01/16 Javascript
javascript实现跨域的方法汇总
2015/06/25 Javascript
javascript实现简单的进度条
2015/07/02 Javascript
jQuery满意度星级评价插件特效代码分享
2015/08/19 Javascript
JavaScript实现标题栏文字轮播效果代码
2015/10/24 Javascript
Easyui form combobox省市区三级联动
2016/01/13 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
2016/06/17 Javascript
js遍历map javaScript遍历map的简单实现
2016/08/26 Javascript
es6系列教程_ Map详解以及常用api介绍
2017/09/25 Javascript
JavaScript设计模式之缓存代理模式原理与简单用法示例
2018/08/07 Javascript
vue完成项目后,打包成静态文件的方法
2018/09/03 Javascript
vue element中axios下载文件(后端Python)
2019/05/10 Javascript
原生JavaScript实现的无缝滚动功能详解
2020/01/17 Javascript
JS绘图Flot如何实现可选显示曲线图功能
2020/10/16 Javascript
初步解析Python下的多进程编程
2015/04/28 Python
python matplotlib绘图,修改坐标轴刻度为文字的实例
2018/05/25 Python
PyCharm在新窗口打开项目的方法
2019/01/17 Python
django2.0扩展用户字段示例
2019/02/13 Python
Python零基础入门学习之输入与输出
2019/04/03 Python
使用Python实现企业微信的自动打卡功能
2019/04/30 Python
在HTML5中如何使用CSS建立不可选的文字
2014/10/17 HTML / CSS
PHP开发的一般流程
2013/08/13 面试题
造价工程师个人求职信
2013/09/21 职场文书
体育教师工作总结的自我评价
2013/10/10 职场文书
安全生产先进个人总结
2015/02/15 职场文书
自我检讨书怎么写
2015/05/07 职场文书