数据类型
请牢记,JS只包含一种数据类型,这种数据类型与你熟悉语言的double几乎是一样的,因为整数如果进行除法运算的话,可能运算结果会与你的预期有出入。同时也请牢记在JS中的数据位移以及位运算比较都是很消耗资源的运算,因为运算前必须先将double转换成整数,运算后再将整数重新转换为double
数组
在JS中只存在于一种数组,我们称为arrays,当你想使用类似其他语言的lists,arrays,vectors,sets或者tuples时,arrays是你唯一的选择,注意array的容量大小是可动态改变的,而且数组的每一个元素也可以是不同的类型。
你可以像这样声明一个数组:
view source
print?
1
vararray1 = [];//empty array
2
vararray2 = [1,"hello",null, ["bye", 0]];//array with stuff in it
看上去确实很简单,但我还是要建议你参考 array functions in Javascript去了解更多关于JS中的数组用法。
对象
因为对象的多变性,对象在JS中可以说是最有特性的元素了,JS里的对象类似一个关联的字典集合,在左边你能看到字典的关键词,与之对应在右边你能看到该关键词对应的值,这个值甚至是其他对象或者一个方法。
在JAVA/C#中,你肯定要使用大量的类,但在JS中,你可以更简洁地使用对象完成同样的目的。
比如这是一个Person类
view source
print?
1
classPerson
2
{
3
publicstringname ="John";
4
publicintage = 25;
5
publicstringoccupation ="programmer";
6
}
在JS中,你可以使用对象完成同样的任务
view source
print?
1
varperson = {
2
name:"John",
3
age: 25,
4
occupation:"programmer"
5
};
但如果你要实现更加复杂的类呢?比如有构造方法,私有字段以及方法的时候你该怎么做呢?
view source
print?
01
classPerson
02
{
03
privatestringname;
04
privateintage;
05
privatestringoccupation;
06
07
publicPerson(stringname,intage,stringoccupation)
08
{
09
this.name = name;
10
this.age = age;
11
this.occupation = occupation;
12
}
13
14
publicstringGetDescription()
15
{
16
returnname +" is a "+ age +" year old person that earns money as a "+ occupation +".";
17
}
18
}
比如现在你可以实例化一个Person然后获取他的描述
view source
print?
在JS中没有类而只有简洁的对象。我们这里看看如何使用对象来完成上面的功能:
view source
print?
1
Person John =newPerson("John", 25,"programmer");
2
stringbiographyOfJohn = John.GetDescription();
01
functionPerson(name, age, occupation) {
02
return{
03
name: name,
04
age: age,
05
occupation: occupation,
06
getDescription:function() {
07
returnname +" is a "+ age +" year old person that earns money as a "+ occupation +".";
08
}
09
};
10
}
现在,你也可以通过下面的代码来初始化一个Person然后也获取他的描述了
view source
print?
方法
JS的方法与C#/JAVA是不一样的,C#/JAVA的方法是直接属于类的,你可以为某个方法分配变量,传递参数,获取方法的返回值或者之际将方法作为数组的元素以及对象的某个值。
在JS中,有两种定义方法的标准语法:
view source
print?
1
varJohn = Person("John", 25,"programmer");
2
varbiographyOfJohn = John.getDescription();
1
functionname(arguments) {
2
//function body
3
returnreturnValue;
4
}
或
view source
print?
这两个不同语法的唯一区别就是第一个将自动将自己置于程序的全局,这样你能够在定义方法的代码前就能直接调用该方法 ( Read more about hoisting in Javascript) 而如果你使用第二个语法规格的话,你必须在调用方法前事先定义方法。
范围
JS只针对方法才有可使用的范围限制,显然这与C#/JAVA的块区域是不一样的,所以如果你写下如下代码你可能会碰到一些问题
view source
print?
1
varname =function(arguments) {
2
//function body
3
returnreturnValue;
4
}
通过使用块,你期望x只是这个块的局部变量而不会影响到外面的同名变量x。但是在JS中,内部的x是会改变外部的同名变量x的。
不过不用担心,代码质量检测工具( JSHint)能够找出这些问题并提醒你。
全局变量
请尽量确保你使用'var'关键字来定义变量,如果不这么做的话,JS将自动认定这些变量就是全局变量。而这将会导致很多很难检测出来的BUG。
view source
print?
1
varx = 45;
2
if(condition) {
3
varx = 35;
4
}
1
varglobalVar ="global variable";
2
otherGlobalVar ="other global variable";
3
4
functiondoStuff() {
5
alsoGlobal ="unfortunately, this is also a global variable";
6
}
上面示例中,所有变量都是定义为全局变量的,globalVar正常, otherGlobalVar就是一个不好定义方式的典型,而 alsoGlobal这种定义方式显然是一个更糟糕的方式,这将导致出无法预测的BUG。
再啰嗦一句,请确保使用 JSHint,可以为你省不少事!
文档对象模型
DOM(文档对象模型)不算是JS独有的东西,但对于JS与网页通信是非常重要的,但悲剧的是为了在不同的浏览器下正常工作,你可能要做非常烦人的工作,一般情况下我就直接建议你使用DOM抽象框架 jQuery.
总结:
我能确信你肯定在开发过程中会碰到更多的JS各个方面的问题,但我希望这篇文章能尽量的讲述到其中大量的典型问题,如果你打算好好研究JS的话,这里有几个非常好的站点值得你去取经:
· MDN Javascript Documentation
· Eloquent Javascript
· Crockford's Javascript
· jQuery