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 相关文章推荐
JTrackBar水平拖动效果
Jul 15 Javascript
优化javascript的执行速度
Jan 23 Javascript
js和jquery中循环的退出和继续下一个循环
Sep 03 Javascript
javascript面向对象之this关键词用法分析
Jan 13 Javascript
DOM基础教程之使用DOM设置文本框
Jan 20 Javascript
javascript中offset、client、scroll的属性总结
Aug 13 Javascript
AngularJS数据源的多种获取方式汇总
Feb 02 Javascript
JS实战篇之收缩菜单表单布局
Dec 10 Javascript
微信小程序 slider的简单实例
Apr 19 Javascript
JavaScript实现计数器基础方法
Oct 10 Javascript
解决layui中onchange失效以及form动态渲染失效的问题
Sep 27 Javascript
vue组件冲突之引用另一个组件出现组件不显示的问题
Apr 13 Vue.js
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
php5中date()得出的时间为什么不是当前时间的解决方法
2008/06/30 PHP
C# Assembly类访问程序集信息
2009/06/13 PHP
php生成短域名函数
2015/03/23 PHP
PHP结合Jquery和ajax实现瀑布流特效
2016/01/07 PHP
PHP 实现字符串翻转(包含中文汉字)的实现代码
2017/04/01 PHP
8个超棒的学习 jQuery 的网站 推荐收藏
2011/04/02 Javascript
jQuery操作Select选择的Text和Value(获取/设置/添加/删除)
2013/03/06 Javascript
jQuery插件jQuery-JSONP开发ajax调用使用注意事项
2013/11/22 Javascript
js中indexof的用法详细解析
2013/12/24 Javascript
js中的json对象详细介绍
2014/10/29 Javascript
jquery实现浮动的侧栏实例
2015/06/25 Javascript
深入理解Javascript中的valueOf与toString
2017/01/04 Javascript
JS判断指定dom元素是否在屏幕内的方法实例
2017/01/23 Javascript
详解从Vue.js源码看异步更新DOM策略及nextTick
2017/10/11 Javascript
详解Require.js与Sea.js的区别
2018/08/05 Javascript
vue生成文件本地打开查看效果的实例
2018/09/06 Javascript
使用canvas实现一个vue弹幕组件功能
2018/11/30 Javascript
JS基于开关思想实现的数组去重功能【案例】
2019/02/18 Javascript
微信小程序 wx:for遍历循环使用实例解析
2019/09/09 Javascript
浅谈vue项目,访问路径#号的问题
2020/08/14 Javascript
vue实现顶部菜单栏
2020/11/08 Javascript
如何在JavaScript中等分数组的实现
2020/12/13 Javascript
用vite搭建vue3应用的实现方法
2021/02/22 Vue.js
wxPython框架类和面板类的使用实例
2014/09/28 Python
Python中的getopt函数使用详解
2015/07/28 Python
Python Numpy库datetime类型的处理详解
2019/07/13 Python
python IDLE添加行号显示教程
2020/04/25 Python
关于python中导入文件到list的问题
2020/10/31 Python
python在地图上画比例的实例详解
2020/11/13 Python
快速一键生成Python爬虫请求头
2021/03/04 Python
html5+css如何实现中间大两头小的轮播效果
2018/12/06 HTML / CSS
国际商务系学生个人的自我评价
2013/11/26 职场文书
现场活动策划方案
2014/08/22 职场文书
铁路安全反思材料
2014/12/24 职场文书
农村老人去世追悼词
2015/06/23 职场文书
python中的装饰器该如何使用
2021/06/18 Python