Javascript数组Array基础介绍


Posted in Javascript onMarch 13, 2016

Javascript,一门神奇的语言,它的数组也同样独特。我们要去其糟粕,取其精华,把常用的最优实践总结出来。如有错误,请指出。

javascript数组是一种类数组的对象,拥有对象的特性。当属性名是小而连续的整数时,应该使用数组,否则,使用对象。

数组来源

所有的数组都是Array构造出来的,我们来测试一下constructor这个属性。

var arr = [];
arr.constructor === Array; // true
arr.constructor === Array.prototype.constructor; // true

创建数组

//数组字面量方式
var arr1 = [1, 2, 3]; // [1,2,3]

//构造函数方式
var arr2 = new Array();    // [] 空数组
var arr3 = new Array('9');   // ["9"] 一个字符串元素
var arr4 = new Array(9);    // [] 数组长度length为9
var arr5 = new Array([9]);   // [[9]] 相当于二维数组
var arr6 = new Array(1, 2, 3); // [1, 2, 3]
var arr7 = new Array(1, function f(){}, {o : 6}, null,undefined,true);
// 数组可以存储任意混合数据类型

由于arr4的方式,当只有一个数字参数传递到Array的构造函数中,构造函数会返回设置了length属性的空数组。所以推荐使用数组字面量方式,短小而简洁。

检测对象是否为数组

var arr1 = [1, 2, 3];
typeof(arr1); // object

众所周知,typeof不能正确检测类型。

arr1 instanceof Array; //true

instanceof 方式在一个网页内是没有问题,一旦嵌套其他网页,便存在两个全局作用域,互相调用时的检测就会出问题。

Array.isArray(arr1); // true

Array.isArray() 是ECMAScript5 新增的方法,没有缺陷。唯一的问题是ie8浏览器不支持,ie9浏览器在严格模式下也不支持。

Object.prototype.toString.apply(arr1).slice(8, -1); // Array

最后一种方式是检测类型的最好方法。

数组长度

数组的length也是它的属性,增大length也不会发生越界错误。
length值等于数组最大的整数属性名加1。

var arr1 = [];
arr1[9] = 1; // 长度为10,只包含一个元素的数组

设小值将将会把属性名大于等于length的属性删除。
如果将length值设为0,相当于清空数组。

var arr2 = [1, 2, 3, 4, 5];
arr2.length = 3; // [1, 2, 3]
arr2.length = 0; // []

数组遍历

遍历数组不要使用for in循环遍历数组,因为for in会遍历原型链上的所有属性,但我们并不需要这么多。推荐使用for循环的方式。

var arr1 = [1, 2, 3];
arr1.test = 9;

//for in 方式
for(var prop in arr1){
  cosole.log(prop, arr1[prop]);
}
// 输出如下
// 0 1
// 1 2
// 2 3
// test 9

//for循环方式
for(var i = 0, len = arr1.length; i < len; i++){
  console.log(arr1[i]);
}
//输出如下
// 1
// 2
// 3

我们看到for in方式多出了一个test值,可以使用hasOwnProperty函数排除,但那会比for循环的方式慢很多。
缓存数组长度很有必要的一步,每次访问是有性能开销的(最新的浏览器在这方面做了优化)。

小结

简单介绍了Array的相关基础知识,到这里也算是能对Array有更全面的理解了。下一篇介绍Array的方法。

Javascript虽然有很多不太容易弄懂的地方,随着长时间的学习,我已经慢慢地爱上它了(因为现在没有妹子让我爱)。

Javascript 相关文章推荐
intro.js 页面引导简单用法 分享
Aug 06 Javascript
JS或jQuery获取ASP.NET服务器控件ID的方法
Jun 08 Javascript
Javascript实现检测客户端类型代码封包
Dec 03 Javascript
AngularJS单选框及多选框实现双向动态绑定
Jan 13 Javascript
纯JS代码实现一键分享功能
Apr 20 Javascript
微信小程序 列表的上拉加载和下拉刷新的实现
Apr 01 Javascript
基于vue实现swipe轮播组件实例代码
May 24 Javascript
手机注册发送验证码倒计时的简单实例
Nov 15 Javascript
Koa2 之文件上传下载的示例代码
Mar 29 Javascript
vue2.0页面前进刷新回退不刷新的实现方法
Jul 31 Javascript
JS 数组基本用法入门示例解析
Jan 16 Javascript
JS实现简单打字测试
Jun 24 Javascript
深入探究JavaScript中for循环的效率问题及相关优化
Mar 13 #Javascript
简单谈谈json跨域
Mar 13 #Javascript
详解JavaScript中数组和字符串的lastIndexOf()方法使用
Mar 13 #Javascript
Node.js编写爬虫的基本思路及抓取百度图片的实例分享
Mar 12 #Javascript
JavaScript中循环遍历Array与Map的方法小结
Mar 12 #Javascript
Node.js的Express框架使用上手指南
Mar 12 #Javascript
Node.js项目中调用JavaScript的EJS模板库的方法
Mar 11 #Javascript
You might like
使用Thinkphp框架开发移动端接口
2015/08/05 PHP
swoole_process实现进程池的方法示例
2018/10/29 PHP
javascript KeyDown、KeyPress和KeyUp事件的区别与联系
2009/12/03 Javascript
Angular2内置指令NgFor和NgIf详解
2016/08/03 Javascript
jq实现左滑显示删除按钮,点击删除实现删除数据功能(推荐)
2016/08/23 Javascript
使用jQuery卸载全部事件的思路详解
2017/04/03 jQuery
jquery将标签元素的高设为屏幕的百分比
2017/04/19 jQuery
Vue+Mock.js模拟登录和表格的增删改查功能
2018/07/26 Javascript
解决vue跨域axios异步通信问题
2019/04/17 Javascript
vue实现歌手列表字母排序下拉滚动条侧栏排序实时更新
2019/05/14 Javascript
纯JS开发baguetteBox.js响应式画廊插件
2020/06/28 Javascript
关于vue 结合原生js 解决echarts resize问题
2020/07/26 Javascript
python获取指定网页上所有超链接的方法
2015/04/04 Python
使用Python的Tornado框架实现一个Web端图书展示页面
2016/07/11 Python
python使用str &amp; repr转换字符串
2016/10/13 Python
Python 闭包的使用方法
2017/09/07 Python
Python3实现发送QQ邮件功能(附件)
2020/12/23 Python
python+matplotlib演示电偶极子实例代码
2018/01/12 Python
详解如何利用Cython为Python代码加速
2018/01/27 Python
Python实现两个list求交集,并集,差集的方法示例
2018/08/02 Python
在Python中居然可以定义两个同名通参数的函数
2019/01/31 Python
对Python中画图时候的线类型详解
2019/07/07 Python
python3通过qq邮箱发送邮件以及附件
2020/05/20 Python
Python 字典中的所有方法及用法
2020/06/10 Python
HTML5画渐变背景图片并自动下载实现步骤
2013/11/18 HTML / CSS
html5摇一摇代码优化包括DeviceMotionEvent等等
2014/09/01 HTML / CSS
斯洛伐克最大的婴儿食品和用品网上商店:Feedo.sk
2020/12/21 全球购物
保护野生动物倡议书
2014/05/16 职场文书
领导班子四风表现材料
2014/08/23 职场文书
暑假社会实践证明格式
2014/10/28 职场文书
中班教师个人总结
2015/02/05 职场文书
2015年团委副书记工作总结
2015/07/23 职场文书
2016年猴年新春致辞
2015/08/01 职场文书
100句拼搏进取的名言警句,值得一读!
2019/10/07 职场文书
Win11运行育碧游戏总是崩溃怎么办 win11玩育碧游戏出现性能崩溃的解决办法
2022/04/06 数码科技
Java对文件的读写操作方法
2022/04/29 Java/Android