Javascript之旅——第二站:对象和数组

简介: 原文:Javascript之旅——第二站:对象和数组    一觉睡到中午,本来准备起来洗洗继续睡,不过想想没辙,还得继续这个系列,走过变量的第一站,第二站我们再来看看对象和数组。   一:对象     说起对象,我们不自然就想起了面向对象中自封装的一个类,同样JS中也是遵循这个守则,在web编程中几乎天天用到的就是JSON。
原文: Javascript之旅——第二站:对象和数组

 

  一觉睡到中午,本来准备起来洗洗继续睡,不过想想没辙,还得继续这个系列,走过变量的第一站,第二站我们再来看看对象和数组。

 

一:对象

    说起对象,我们不自然就想起了面向对象中自封装的一个类,同样JS中也是遵循这个守则,在web编程中几乎天天用到的就是JSON。是的,

这就是一个对象,不过这个对象下面的字段都是字符串和值类型,如下图。

1     var delivery = {
2         no: 1,
3         sendtime: "2014-11-25",
4         way: "PJS"
5     };

 

从上面可以看出delivery中只具有基本的字符串和数值类型,当然给你玩的可不仅仅就这么多,除了基本的类型,我们还可以定义一个数组类型,

函数类型字段,就像下面这样。

 1     var delivery = {
 2         no: 1,
 3         sendtime: "2014-11-25",
 4 
 5         //三个可用配送地址
 6         address: ["北京", "上海", "南京"],
 7 
 8         way: "PJS",
 9 
10         //根据逻辑是否支持配送
11         cansend: function () {
12             //logic code....
13             return true;
14         }
15     };

现在我们的delivery类刹那间就丰富起来了,有丰富的可用配送地址,有是否可以配送的逻辑运算,是不是有了C#中的类的感觉?可能有人会说,

C#中有索引器,有属性,有事件等等这些,其实这些都是编译器给的语法糖,真的一点都不好玩,本质上都是些方法,有些人就会被这些糊弄到

了而没有看到本质的东西。

  现在对象是创建出来了,下一步就是怎么用呢?通常有两种方法:

 

<1>  "." 运算符

   这种方法,我想是人都应该知道,所以没什么好说的,比如:delivery.way。

 

<2> 索引方式

  这种不知道有多少人清楚,就是用字符串索引的方法去寻找,比如我想去找delivery中字符串为“way”的字段值?因为这个“way"字符串

可能来自用户的输入,那么这种情况在C#里面叫做后期绑定,只能用反射来寻找类的元数据,然后再输出强类型way的值,但是在JS中肯定

是没有元数据的,不过大概也是用了类似反射的方法动态绑定的,说了这么多,我们来看看例子。

 

可能有些人想问,JS在内部是不是用哈希做的,我只能说遗憾的是,不像C#可以反编译或者看看IL,但是在JS中你是没法看到底层做了些

什么,不过我觉得看似哈希,其实跟C#反射差不多,毕竟key都是string,而value却是各种类型都有,string,function,int,array等等,

有值类型,有引用类型,这些大杂烩都放到value,我觉的不好操作是一点,也不符合设计规范,既然觉得不是hash,在内部在寻找”way“的

时候只能采用遍历的方式了。

 

 

二:数组

  说起数组,先要看看数组的定义,两种方式,字面量和Array构造函数,如下图:

1         var s = [1, "ctrip"];
2         var a = new Array(1, "ctrip");

不过要是你仔细观察,你也许会发现,字面量能做到的,array构造函数都能做到,字面量做不到的,array也能做到,比如初始化数组的个

数。也就是array构造函数的第一个参数。

 

因为看不到array中的底层代码,真是非常的伤心,所以我只能猜测一下,字面量[] 只是js提供给我们的语法糖,底层应该还是调用array的

第二个重载函数。

 

   第二个觉得有意思的地方就是,我们会发现一个现象,数组居然还能和对象扯到一块,最后会搞得你眼花缭乱,也许这个就是无类型的灵活

性,有利有弊吧。

  

     从图中我们可以看到,通过s.name="cnblogs"这种类对象赋值的方式,可以将key和value加入到数组中,并且你还可以通过s.name和

s["name"]输出结果值,这就说明数组本质上还是类,只不过在类里面做了一些高层封装,比如需要定时的统计length大小,也就造成了可

以用两个方式输出结果值,不过这就造成了索引数组和关联数组并存的情况了。如果在C#里面,普通的索引数组,我们知道他们在堆中的空

间具有连续性,这样就可以使用索引来达到O(1)查找,但是在js中这样各种类型混在一起,我想应该也没有办法做hash查找,因为这样hash

函数真的很难做,让我写可能写不出来,不过同样很可惜的是,看不到array的源码,所以没有发言权了。

    然后数组方面就没什么好说的了,什么for和forin遍历,数组中常用的操作方法,比如pop,push,join,unshift,shift,大家都能看不到源码,

也就只能见名识义的用吧。

目录
相关文章
|
12天前
|
存储 JavaScript 索引
JS中数组的相关方法介绍
JS中数组的相关方法介绍
|
12天前
|
JavaScript Java
JS有趣的灵魂 清空数组
JS有趣的灵魂 清空数组
|
12天前
|
JavaScript
JS 获取对象数据类型的键值对的键与值
JS 获取对象数据类型的键值对的键与值
|
21天前
|
JavaScript 前端开发
Math对象:JavaScript中的数学工具
Math对象:JavaScript中的数学工具
27 1
N..
|
29天前
|
存储 JavaScript 前端开发
JavaScript中的对象
JavaScript中的对象
N..
10 0
|
15天前
|
JavaScript 算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
|
5天前
|
JavaScript 前端开发 索引
JavaScript 数组中的增、删、改、查
JavaScript 数组中的增、删、改、查
|
6天前
|
JavaScript
【Js】检查Date对象是否为Invalid Date
【Js】检查Date对象是否为Invalid Date
9 0
|
7天前
|
存储 JavaScript 前端开发
JavaScript的引用数据类型主要包括对象
【4月更文挑战第16天】JavaScript的引用数据类型主要包括对象
16 4
|
12天前
|
JavaScript
js 字符串String转对象Object
该代码示例展示了如何将一个以逗号分隔的字符串(`&#39;1.2,2,3,4,5&#39;`)转换为对象数组。通过使用`split(&#39;,&#39;)`分割字符串并`map(parseFloat)`处理每个元素,将字符串转换成浮点数数组,最终得到一个对象数组,其类型为`object`。