最近买了thin老大的书.里面提到了jQuery这个脚本库.开始动了凡心.决定一窥究竟.
目标:研究jQuery源代码.
当然我们得先补习一些javascript基础.
像if{}else{} while(){} 这些c语言的东西.就不是我们讨论的重点了.
第一部份: 第一个类
function Person(name,age) {
this._name = name;
this._age = age;
}
var p1 = new Person("小a",18);
document.writeln(p1._name);//小a
</script>
运行结果:小a
最明显示的特征 this与new 我们面向对象了
javascript很自由.但可别想怎样就怎样噢.会被骂的噢
下面还有几种可以达到相同的效果
1:
var p1 = new Person;
p1._name = "小a";
document.writeln(p1._name);
2:
var p1 = new Person();
p1._name = "小a";
document.writeln(p1._name);
3:
var p1 = new Person("小a");
document.writeln(p1._name);
很明显.第三种不值的推荐.会使我们产生误解
第二部份: 给类添加成员方法
function Person(name,age) {
this._name = name;
this._age = age;
this.getName = function() {
return this._name;
}
}
var p1 = new Person("小a",18);
document.writeln(p1.getName());//小a
</script>
运行结果:小a
第三部份: 添加属于对象的属性
function Person(name,age) {
this._name = name;
this._age = age;
}
var p1 = new Person("小a",18);
var p2 = new Person("小b",19);
p1._height = 1.7;
document.writeln(p1._height);//1.7
document.writeln(p2._height);//undefined
</script>
运行结果:1.7 undefined
属性_height只属于p1对象不属于p2对象
第四部份: 添加属于类的属性 即静态属性(通过prototype)
function Person(name,age) {
this._name = name;
this._age = age;
}
var p1 = new Person("小a",18);
var p2 = new Person("小b",19);
Person.prototype._height = 1.7;
document.writeln(p1._height);//1.7
document.writeln(p2._height);//1.7
document.writeln(Person.prototype._height);//1.7
</script>
运行结果:1.7 1.7 1.7
prototype是原形属性,是一个内置属性,它指定了对象所扩展的构造器函数.
可以把_height看成静态属性又可以看成公有属性,不属于任何实例化的个体,而是属于类
第五部份: 添加属于类的方法 即静态方法(通过prototype)
function Person(name,age) {
this._name = name;
this._age = age;
}
var p1 = new Person("小a",18);
var p2 = new Person("小b",19);
Person.prototype.getName = function() {
return this._name;
}
Person.prototype.setName = function(value) {
this._name = value;
}
document.writeln(p1.getName());//小a
document.writeln(p2.getName());//小b
p1.setName("a");
p2.setName("b");
document.writeln(p1.getName());//a
document.writeln(p2.getName());//b
</scipt>
运行结果:小a 小b a b
这个例子很简洁的说明了问题.其实也没说明了什么,因为它太简单了.只是说明了prototype很强大