JS面向对象编程学习

学习目标：

1、掌握JS中的类（原型对象）和对象。

2、什么是成员变量和成员方法。

3、掌握构造方法的使用。

 

补充：关于双等号（==）：

 

1、如果等号两边都是字符串时，则比较内容是否相等

2、如果等号两边是数字时，则比较数值大小是否相等

3、如果等号两边是对象或者对象的函数，则比较地址是否相等（即判断两者是否引用的同一对象）

        function Person(){

        }

        var p1=new Person();

        var p2=new Person();

        alert(p1==p2);//这里结果是false，因为地址不相等

        var p3=p2;

        alert(p3==p2);//这里是true

 

 

javascript是一种基于对象的语言，你遇到的所有东西几乎都是对象！

 

var a=123;

window.alert(a.constructor);//这里会打出a的构造函数是Number

var b='abc';

//同样能打出来b的构造函数是String

function Person(){}

window.alert(Person.constructor);

//这里能打印出Person的构造函数是 function Function(){}

 

从上面可以看出，javascript中所有的东西都是对象！！！

 

 

基于对象和面向对象实际上都是以对象的概念来编写程序，从本质上讲没有区别。javascript中没有class（类），所以有人把类叫作原型对象，因为两个概念从在编程中发挥的作用看都是一个意思。

 

//定义一个类（原型对象）

function Cat(){

 

}

//看起来和函数一样的，主要是看怎么去用

Cat();//这样用，它就是一个函数

var cat1 = new Cat();//这里cat1就是一个对象（实例）了；

//定义这个对象的属性

cat1.name="小白";

cat1.age=3;

cat1.color="白色";

//从上面可以看出：

//1、JS中的对象的属性可以动态的添加

//2、属性没有限制

 

例：

function test(){

    alert(this.v);

}

var v=90;

//函数默认都是属于window对象的，window是默认的对象，所以可以不打

window.test();//这里输出为90,因为函数 是在var后面才调用的

 

 

关于用var定义和不用var定义变量的区别

例：

        //在函数外面用var和不用都可以

        var abc=89;

        function test(){

            //在函数里面，不用var，则表示用全局的abc(即外面的)

            //用了var 则表示在test()函数中定义一个新的变量

            abc=900;

        }

        alert(abc);

 

访问对象的属性有两种方法：

1、普通方式

        对象名.属性名

2、动态访问

        对象名['属性名']

    例：

        function Person(){}//定义一个类

        var p1=new Person();//创建一个对象

        p1.name="qqzone";//给对象的name属性赋值

        alert(p1.name);//这里是普通方式访问

        alert(p1['name']);//这里是动态方式访问

        var val = 'qq'+'zone';

        alert(p1[val]);//这里就体现出动态的好处了，属性名可以是字符串拼接出来的

  

JS中对象的传值是引用方式

var a=new Person();

a.name="test1";

var b=a;//把a的值赋给了b，这里其实是b引用了a【传地址】

b.name="test2";//这里b.name改变了那么a.name也一样改了

 

JS中有垃圾对象自动回收机制，也可以主动删除

1、当一个对象没有任何引用指向它的时候，就会被自动删除掉

        var a=new Person();

        var b=a;//这里对象a是被引用两次

        b=null;//这里变回1

        a=null; //这里就没有任何引用指向原来的对象了

 

2、使用delete，主动删除对象的某个属性

        var a=new Person();

        a.name='test1';

        var b=a;

        delete b.name;//删除name属性，那么通过a.name也无法访问了

        

 

 

一、如何定义一个原型对象

    1、使用构造函数来定义

            基本语法

            function 类名(){   //类名即原型对象名

                

            }

            创建对象

            var 对象名=new 类名;

            window.alert(对象名.constructor); //对象实例的构造方法

 

            如何判断一个对象是否属于某个类？

            1、使用instanceof

                if(a instanceof Person){

                    alert('yes');

                }

            2、使用constructor

                if(a.constructor == Person){

                    alert('yes');

                }   

        

    2、工厂方法，使用new Object创建对象，并添加相关属性

                function Person(){

                }

                var p1=new Person();

                p1.name='test';

    3、使用prototype（原型）

 

 

    4、构造函数及原型混合方式

 

    5、动态原型方式

 

二、this关键字

        function Person(){

            //这里定义了一个属性后，创建对象时将自动赋值给新对象

            this.name='test';

            //如果这样使用，则表示该属性是私有的

            var age = 90;

            //下面使用this，表示这是Person类的一个公开方法，可以访问私有方法

            this.show=function(){

                window.alert(age+''+name);

            }

            //这里表示是Person的一个私有的方法

            function show2(){

            }

        }

        var p1=new Person;

        var p2=new Person;

        alert(p1.name+' '+p2.name);//这里都为test，this为公开属性

        //p1.show2();  这里show2();是私有方法 ，所以如果在这里使用就会报错

 

 三、对象成员方法（函数）

        1、方法一：

           function Person(name,age){

                this.name=name;

                this.age=age;

                //输出名字，this.show就是一个公开的函数(每个对象都有)，函数名show

                this.show=function(n){//可带参数

                    alert(this.name);

                }

            }

        2、方法二：

            function Person(name){

                this.name=name;

            }

            function show(){

                alert(this.name);

            }

            p1=new Person();

            //这种方法，就不是每个对象都有的函数了

            p1.abc=show;//这里不带括号，表示把show的构造函数传给p1.abc

            p1.abc();

 

            同样也可以直接用p1.abc创建函数

            p1.abc = function show(){

                alert(this.name);

            }

        3、方法三

            function Person(name){

                this.name=name;

            }

            var p1=new Person();

            //使用prototype创建的方法是所有对象都共享的

            Person.prototype.age=function(){

                this.age="12";

            }

            var p2=new Person();

            p1.age();

            alert(p1.age);//输出12

            alert(p2.age);//这里不会输出 ，因为p2还没有运行age()，运行后就可以获取age属性;

            

 四、Object类（基类）

            Object是javascript中所有类的基类

 

        var p1=new Object();//通过Object直接创建对象，这里p1就是对象了

        p1.name='test';//给p1的属性赋值

        通过Object创建的类有以下主要属性：

        1、contructor 对象构造函数

        2、prototype  原型，获得类的prototype对象，static属性

        

            var a=10;

            //给Number类添加一个add方法

            Number.prototype.add=function(a){

                return this+a;//使用这个方法，会增加a

            }

            alert(a.add(10).add(10));//这里a.add(10)运行后结果为20，那么20.add(10)运行后结果为30

        

成员函数小结：

 

1、成员函数的参数可以是多个

2、成员函数可以没有返回值，如果有返回值，最多只返回一个

3、JS中不支持函数重载，如果有多个函数名相同，则以最后一个为准

4、在js中直接定义一个函数或变量实际上就是全局函数和全局变量，他们是属于window的

        var a=90;

        alert(this.a);//这里输出就是90，因为都属于window