今天听了微软MVP讲师苏鹏老师的《Ajax与Atlas开发系列课程》第8讲《设计高质量的Ajax应用》,有一些收获,现在与大家共享:
1.提高软件用户体验的5个方面:
a 响应度:也就是软件在用户操作后要及时给出反馈信息,要么是执行的结果,要么执行时间很长时,给出当前正在执行的操作信息,告知用户等待。
b 性能:软件执行的效率要高,软件运算结果的时间让用户可以接受,时间太长,用户会选择放弃该软件。
c 一致性:软件为用户提供的操作该项要统一,在一个软件系统中同一类操作的执行方法应该一致的,这个问题主要在团队开发时容易产生。
d 易用性:软件的使用要符合用户的操作习惯,而不是满足程序员的操作习惯。
e 可用性:软件的功能性要完整,否则将不会被用户所接受。
2.提Javascript程序执行效率的方法:
a 注意循环的执行效率
1// JavaScript Document
2function fibonacci(count){
3var a=1;
4var b=1;
5for(var i=0;i<count;i++){
6var total=a+b;
7a=b;
8b=total;
9}
10return b;
11}
12
13function LoopOne(count){
14var total=0;
15for (var i=0;i<fibonacci(count);i++){
16total+=i;
17}
18alert(total);
19}
20
21
22function Looptow(count){
23var total=0;
24var loopCounter=fibonacci(count);
25for (var i=0;i<loopCounter;i++){
26total+=i;
27}
28alert(total);
29}
上面有两个生成菲博纳其数列的例子(LoopOne和LoopTow)其中LoopTow比LoopOne的执行效率高,原因在于LoopOne中每次判断循环是否结束时(i<fibonacci(count))都要去调用一次fibonacci(count)函数,而LoopTow只是在循环开始时去调用一次fibonacci(count)函数(var loopCounter=fibonacci(count)),循环开始后,判断循环是否结束时,只是与变量loopCounter比较(i<loopCounter),这样减少了对fibonacci(count)函数的调用,执行效率当然要高很多。
b 注意引用层次对执行效率的影响
1// JavaScript Document
2//1
3var hourHand=myGrandFather.clock.hands.hour;
4var minuteHand=myGrandFather.clock.hands.minute;
5var secondHand=myGrandFather.clock.hands.second;
6//2
7var hands=myGrandFather.clock.hands;
8var hourHand=hands.hour;
9var minuteHand=hands.minute;
10var secondHand=hands.second;
同样是引用对象的属性给变量赋值,第2种写法比第1种写法效率高,原因在于第一种写法对对象属性的引用是三层引用,而第二种写法因为先定义了一个hands变量它指向了myGradnFather.clock.hands对象,当后面再给变量赋值时,其引用关系就变成了一层,引用层次越少,执行效率越高。
3.防止Javascript程序内存泄漏:
虽然有垃圾回收机制,但这不能完全保证程序使用的内存被完全回收,代码中还应该注意把对象的所有引用都注销,如以下代码:
1// JavaScript Document
2function Person(name){
3this.name=name;
4this.pets=new Array();
5}
6
7Person.prototype.addPet=function(pet){
8this.pets[pet.name]=pet;
9if (pet.assignOwner){
10pet.assignOwner(this);
11}
12}
13
14this.removePet(petName)=function{
15var orphan=this.pets[petName];
16this.pets[petName]=null;
17if (orphan.unassignOwner){
18orphan.unassignOwner(this);
19}
20}
21
22//定义宠物猫
23function Cat(name){
24this.name=name;
25}
26Cat.prototype.assignOwner=function(person){
27}
28Cat.prototype.unassignOwner=function(person){
29}
30//定义宠物狗
31function Dog(name){
32this.name=name;
33}
34Dog.prototype.assignOwner=function(person){
35this.owner=person;
36}
37Dog.prototype.unassignOwner=function(person){
38this.owner=person;
39}
40
41//定义人类
42 var jim=new Person("jim");
43 jim.addPet(new Cat("whiskers"));//这里系统内建了一个猫
44 var fido=new Dog("fido");
45 jim.addPet(fido);
46
47 jim.removePet("whiskers");
48 jim.removePet("fido");
49 jim=null;
50 //到此为止我们的jim先生还在吗?
51 fido=null;
虽然显示的把人对象jim设为了null(jim=null),但此时jim对象在内存中依然存在,因为在对象fido的ower中还有对jim的引用,所以垃圾回收机制还不会把jim对象占用的内存回收,要让垃圾回收机制回收jim占用的内存,必须加一句fido=null,这时所有对jim的引用已经清除,内存回收机制此时才会把jim占用的内存回收。