javascript很好很强大-->(1)javascript面象对象初探

最近买了thin老大的书.里面提到了jQuery这个脚本库.开始动了凡心.决定一窥究竟.
目标:研究jQuery源代码.

当然我们得先补习一些javascript基础.
像if{}else{} while(){} 这些c语言的东西.就不是我们讨论的重点了.

第一部份: 第一个类

<script type="text/javascript">
    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);
很明显.第三种不值的推荐.会使我们产生误解

第二部份: 给类添加成员方法

<script type="text/javascript">
    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

第三部份: 添加属于对象的属性 

<script type="text/javascript">
    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)

<script type="text/javascript">
    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)

<script type="text/javascript">
    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很强大