一、JS声明对象或数组  JS对象:{ }  JS数组:[ ]

对象       var b={m:'123',n:'abc'};alert(b.m);alert(b.n);

一维数组     var a=[1,2,3];alert(a[1]);alert(a.length);
二维数组     var ar = [ [ 'a' , 'b'],[ 4, 5 , 6 , 5 ],[ 7, 8 , 9 ] ];alert(ar[1].length);

对象跟数组结合  var b={m:[{f:'123'},{g:'abc'}],n:[{h:'456'},{u:'098'}]};alert(b.m[0].f);

数组跟对象结合  var b=[{m:'abc',n:'fff'},{x:'123',y:'555'}];alert(b[1].x);

二、数组”(array)和“对象”(object)两者都可以用来表示数据的集合。

在javascript中,对象被定义为属性和值的集合。最直接的表现便是对象字面量:var obj={a:3,b:"hello",c:[1,2,3]}。相比传统的面向对象的语言,这种方式大大简化的对象创建。在这种情况下,javascript的对象其实就是一个关联数组。在javascript中,数组又可以认为是索引数组,即可以用整数来进行索引。数组和对象在这种情况下非常接近。

比如数组a=[1,2,3,4],和对象a={0:1,1:2,2:3,3:4},运行alert(a[1])两种结果是相同的。

这就是说,数据集合既可以用数组表示,也可以用对象表示,那么我到底该用哪一种呢?

数组和对象的区别:

(1)数组表示有序数据的集合,而对象表示无序数据的集合。——如果数据的顺序很重要,就用数组,否则就用对象。

(2)数组的数据没有”名称”(name),对象的数据有”名称”(name)。

但是:数组分为索引数组(下标为整数数字)和关联数组(下标为文本)。

例如在javascript中,可以这样定义一个对象:var a={"城市":"北京","面积":16800,"人口":1600};
但是,也可以定义成一个关联数组:
          a["城市"]="北京";
          a["面积"]=16800;
           a["人口"]=1600;

于是:在Javascript语言中,关联数组就是对象,对象就是关联数组。

因此,在javascript中,数组是一种特殊的对象,其除了具有一般对象的一些属性和方法外,还具有一些专属于数组的属性和方法:push,pop等。

当使用typeof判断数组类型时其会返回object。有一个比较直观的方法可以说明对象和数组之间的关系:

var a=[1,2,3,4];a["pro"]="hello";alert(a.length);//4

在这种情况下,数组a的长度不变,pro是a这个对象的属性而不是其元素。由于在javascript中,对象的属性可以用点号和中括号来引用,而数组的元素使用中括号来引用,因此会造成误解。

总结:

区别:

(1)创建方式不同:数组表示有序数据的集合,而对象表示无序数据的集合。数组的数据没有”名称”(name),对象的数据有”名称”(name)。

var arr = [11,22,33,44,55];
var obj = {
attr1:'01',
attr2:'02',
attr3:'03',
attr4:'04',
attr5:'05'
}

(2)调用方法不同

对象的属性可以用点号和中括号(注意中括号内是字符串表达式,要加引号)来引用,而数组的元素使用中括号来引用。

console.dir(arr[1]);
console.dir(obj.attr1);
console.dir(obj['attr1']);

(3)对象键值唯一,数组可以重复

var arr = [11,11,33,44,55];
var obj = {
attr1:'01',
attr2:'02',
attr3:'03',
attr4:'04',
attr5:'05',
attr1:"00"
}
console.dir(arr);
console.dir(obj);

(4)对象没有长度,不能用for循环

    // 对象没有长度
console.dir(arr.length); //
console.dir(obj.length); // undefined for (var i = 0; i <arr.length; i++) {
console.dir(arr[i]);
}

相同点:

(1)数组和对象都可以使用for...in 循环

for(var index in arr){
console.dir(index); // 属性
console.dir(arr[index]); // 值
}
for(var attr in obj){
console.dir(attr); // 属性
console.dir(obj[attr]); // 值
}

javascript中对象和数组的异同点的更多相关文章

  1. JavaScript中对象和数组的深拷贝

    不管是在面试中还是我们的项目中经常会用到数组或者对象的深拷贝,下面我就自己总结的分享给大家. 首先要知道什么是深拷贝?什么是浅拷贝? 深拷贝:源对象与拷贝对象互相独立,其中任何一个对象的改动都不会对另 ...

  2. javascript中对象字面量的理解

    javascript中对象字面量与数组字面量 第一部分 我们知道JavaScript中的数据类型有基本数据类型和引用类型,其中Object类型就是非常常用的类型.那么如果创建一个Object类型的实例 ...

  3. javascript中对象的深度克隆

    记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...

  4. javaScript(8)---对象和数组

    javaScript(8)---对象和数组 学习要点: 1.Object类型 2.Array类型 3.对象中的方法 什么是对象,其实就是一种类型,即引用类型.而对象的值就是引用类型的实例.在ECMAS ...

  5. javaScript遍历对象、数组总结(转载)

    javaScript遍历对象.数组总结  转载来源 https://www.cnblogs.com/chenyablog/p/6477866.html 在日常工作过程中,我们对于javaScript遍 ...

  6. JavaScript中对象的属性

    在JavaScript中,属性决定了一个对象的状态,本文详细的研究了它们是如何工作的. 属性类型 JavaScript中有三种不同类型的属性:命名数据属性(named data properties) ...

  7. JavaScript中对象转换为原始值的规则

    JavaScript中对象转换为原始值遵循哪些原则? P52 对象到布尔值对象到布尔值的转换非常简单:所有的对象(包括数字和函数)都转换为true.对于包装对象亦是如此:new Boolean(fal ...

  8. JavaScript 遍历对象、数组总结

    在日常工作过程中,我们对于javaScript遍历对象.数组的操作是十分的频繁的,今天抽空把经常用到的方法小结一下,方便今后参考使用!   javaScript遍历对象总结     1.使用Objec ...

  9. JavaScript中常见的数组操作函数及用法

    JavaScript中常见的数组操作函数及用法 昨天写了个帖子,汇总了下常见的JavaScript中的字符串操作函数及用法.今天正好有时间,也去把JavaScript中常见的数组操作函数及用法总结一下 ...

随机推荐

  1. Linux系统处理木马病毒的思路

    一.清除木马程序步骤 1.1 执行命令,每1秒刷新一次,显示整个命令路径,而不是命令的名称. [root@linux-node1 ~]# top -d -c 1.2 查找可疑进程(比较奇怪的进程名称) ...

  2. idea 安装后需要手动设置 64位的vmoptions (为了更好的性能和体验)

  3. Entity Framework中执行Sql语句

           如果想在EF框架中执行Sql语句,其实很简单,EF里面已经提供了相关的方法(此处使用的EF为EF4.1版本).        EF中提供了两个方法,一个是执行查询的Sql语句SqlQue ...

  4. 一个web应用的诞生(5)--数据表单

    下面把角色分为两种,普通用户和管理员用户,至少对于普通用户来说,直接修改DB是不可取的,要有用户注册的功能,下面就开始进行用户注册的开发. 用户表 首先要想好用户注册的时候需要提供什么信息:用户名.密 ...

  5. selenium webdriver API详解(二)

    本系列主要讲解webdriver常用的API使用方法(注意:使用前请确认环境是否安装成功,浏览器驱动是否与谷歌浏览器版本对应) 一:获取当前页面的title(一般获取title用于断言) from s ...

  6. Python接口测试实战4(下) - 框架完善:用例基类,用例标签,重新运行上次失败用例

    如有任何学习问题,可以添加作者微信:lockingfree 课程目录 Python接口测试实战1(上)- 接口测试理论 Python接口测试实战1(下)- 接口测试工具的使用 Python接口测试实战 ...

  7. html5shiv 是一个针对 IE 浏览器的 HTML5 JavaScript 补丁,目的是让 IE 识别并支持 HTML5 元素。

    html5shiv 是一个针对 IE 浏览器的 HTML5 JavaScript 补丁,目的是让 IE 识别并支持 HTML5 元素. 各版本html5shiv.js CDN网址:https://ww ...

  8. 408. Add Binary【LintCode java】

    Description Given two binary strings, return their sum (also a binary string). Example a = 11 b = 1 ...

  9. Spring单元测试集成H2数据库

    项目源代码在:Spring-H2测试 H2简介 H2数据库是一种由Java编写的,极小,速度极快,可嵌入式的数据库.非常适合用在单元测试等数据不需要保存的场景下面. 以下时其官网的介绍: {% blo ...

  10. cinder的组件

    跟nova相似,cinder也有很多组件,每个组件负责各自的业务,然后共同协作完成volume的管理.组件之间的通信方式与nova个组件之间的通信方式相同,都是通过消息队列进行通信. cinder-a ...