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 相关文章推荐
JavaScript获得选中文本内容的方法
Dec 02 Javascript
原生JS实现加入收藏夹的代码
Oct 24 Javascript
jquery中get,post和ajax方法的使用小结
Feb 04 Javascript
jquery使用remove()方法删除指定class子元素
Mar 26 Javascript
Eclipse引入jquery报错如何解决
Dec 01 Javascript
js获取html的span标签的值方法(超简单)
Jul 26 Javascript
微信小程序 购物车简单实例
Oct 24 Javascript
浅析javascript中的Event事件
Dec 09 Javascript
JavaScript中英文字符长度统计方法示例【按照中文占2个字符】
Jan 17 Javascript
ES6中class类用法实例浅析
Apr 06 Javascript
使用vue构建一个上传图片表单
Jul 04 Javascript
解决JS外部文件中文注释出现乱码问题
Jul 09 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
PHP HTML代码串截取代码
2008/12/29 PHP
PHP XML数据解析代码
2010/05/26 PHP
php 中的4种标记风格介绍
2012/05/10 PHP
PHP如何通过AJAX方式实现登录功能
2015/11/23 PHP
postfixadmin忘记密码后的修改密码方法详解
2016/07/20 PHP
PHP+AJAX 投票器功能
2017/11/11 PHP
PHP常量及变量区别原理详解
2020/08/14 PHP
jQuery 使用手册(七)
2009/09/23 Javascript
parentElement,srcElement的使用小结
2014/01/13 Javascript
jquery+css实现动感的图片切换效果
2015/11/25 Javascript
vue中使用element-ui进行表单验证的实例代码
2018/06/22 Javascript
vue实现瀑布流组件滑动加载更多
2020/03/10 Javascript
JS实现公告上线滚动效果
2021/01/10 Javascript
Django中传递参数到URLconf的视图函数中的方法
2015/07/18 Python
关于Python中Inf与Nan的判断问题详解
2017/02/08 Python
python3中set(集合)的语法总结分享
2017/03/24 Python
python3.4.3下逐行读入txt文本并去重的方法
2018/04/29 Python
python3模块smtplib实现发送邮件功能
2018/05/22 Python
Django框架使用内置方法实现登录功能详解
2019/06/12 Python
python 的 scapy库,实现网卡收发包的例子
2019/07/23 Python
django多文件上传,form提交,多对多外键保存的实例
2019/08/06 Python
Python任务调度模块APScheduler使用
2020/04/15 Python
python中if及if-else如何使用
2020/06/02 Python
Python实现ElGamal加密算法的示例代码
2020/06/19 Python
CSS3 制作旋转的大风车(充满童年回忆)
2013/01/30 HTML / CSS
纬创Java面试题笔试题
2014/10/02 面试题
写自荐信有哪些不宜?
2013/10/17 职场文书
工作室成员个人发展规划范文
2014/01/24 职场文书
《绿色蝈蝈》教学反思
2014/03/02 职场文书
12岁生日演讲稿
2014/05/14 职场文书
物流管理专业求职信
2014/05/29 职场文书
信用卡催款律师函
2015/05/27 职场文书
致运动员的广播稿
2015/08/19 职场文书
小学五年级班主任工作经验交流材料
2015/11/02 职场文书
2016五四青年节活动总结范文
2016/04/06 职场文书
学校就业保障协议书
2019/06/24 职场文书