JS面向對象高級特性

時間 2019-11-10

原文原文鏈接

對象的建立能夠經過兩種方式，第一種經過對象初始化的方法： javascript

 var person={
                name:"xingoo",
                age:26,
                say:function(){
                    console.log("say something");
                },
                action:function(){
                    console.log("do something");
                }
            };

            console.log(person.name);
            console.log(person.age);
            person.say();
            person.action();

第二種方式經過構造函數建立：
html

 function student(name,age){                this.name = name;                this.age = age;                this.say = function(){
                    console.log("say something");
                }                this.action = function(){
                    console.log("do something");
                }
            }            var xingoo = new student("xingoo",27);
            console.log(xingoo.name);
            console.log(xingoo.age);
            xingoo.say();
            xingoo.action();

對象的屬性

對象的屬性分爲對象屬性、私有屬性和類屬性。java

　　對象屬性須要建立對象後才能使用；閉包

　　私有屬性在內部能夠直接使用，在外部須要經過閉包才能使用。app

　　類屬性能夠經過對象名稱直接使用。ide

function func(){                this.objPro1 = "對象屬性";
                func.prototype.objPro2 = "對象屬性";                var privatePro = "私有屬性";
            }
            func.classPro = "類屬性";

            console.log(func.classPro);            var f = new func();
            console.log(f.objPro1);
            console.log(f.objPro2);            <!-- 私有屬性能夠經過閉包獲取 -->

對象的方法

　　對象方法包括：對象方法，私有方法和類方法，使用相似前面的屬性。函數

 function demoFunc1(){                var privateFunc = function(){
                    console.log("this is privateFunc");
                };

                privateFunc();                this.objFunc1 = function(){
                    console.log("this is objFunc1");
                };
                demoFunc1.prototype.objFunc2 = function(){
                    console.log("this is objFunc2");
                };
            }
            demoFunc1.classFunc = function(){
                console.log("this is classFunc");
            };
            demoFunc1.classFunc();            var f = new demoFunc1();
            f.objFunc1();
            f.objFunc2();

繼承、封裝與多態

　　JS要想實現繼承，須要經過apply方法或者prototype實現。ui

　　若是單純的使用apply方法，子類的原型是子類；若是使用prototype，那麼子類的原型也將繼承父類。this

　　例以下面的代碼：spa

 function Animal(name,age){                this.name = name;                this.age =age;                this.say = function(){
                    console.log("animal say something");
                }
            }            function Cat(name,age){
                Animal.apply(this,[name,age]);
            }            <!-- Cat.prototype = new Animal();-->            var cat1 = new Cat("xingoo",3);
            console.log(cat1.name);
            console.log(cat1.age);
            cat1.say();

上面代碼中，cat的原型是cat；

若是開啓註釋的部分，能夠發現，cat類的原型也變成了Animal。

子類的方法會覆蓋父類的方法，即表現出多態性：

  function Pig(name,age){                this.say = function(){
                    console.log("i am pig");
                }
            }
            Pig.prototype = new Animal();            function Dog(name,age){                this.say = function(){
                    console.log("i am dog");
                }
            }
            Dog.prototype = new Animal();            function say(animal){                if(animal instanceof Animal){
                    animal.say();
                }
            }            var dog = new Dog();            var pig = new Pig();
            say(dog);
            say(pig);

使用到的所有代碼：

<!doctype html>

<html>

<head>

</head>

<body>

var person={

name:"xingoo",

age:26,

say:function(){

console.log("say something");

action:function(){

console.log("do something");

}

};

console.log(person.name);

console.log(person.age);

person.say();

person.action();

function student(name,age){

this.name = name;

this.age = age;

this.say = function(){

console.log("say something");

}

this.action = function(){

console.log("do something");

}

var xingoo = new student("xingoo",27);

console.log(xingoo.name);

console.log(xingoo.age);

xingoo.say();

xingoo.action();

function func(){

this.objPro1 = "對象屬性";

func.prototype.objPro2 = "對象屬性";

var privatePro = "私有屬性";

}

func.classPro = "類屬性";

console.log(func.classPro);

var f = new func();

console.log(f.objPro1);

console.log(f.objPro2);

function demoFunc1(){

var privateFunc = function(){

console.log("this is privateFunc");

};

privateFunc();

this.objFunc1 = function(){

console.log("this is objFunc1");

};

demoFunc1.prototype.objFunc2 = function(){

console.log("this is objFunc2");

};

}

demoFunc1.classFunc = function(){

console.log("this is classFunc");

};

demoFunc1.classFunc();

var f = new demoFunc1();

f.objFunc1();

f.objFunc2();

function Animal(name,age){

this.name = name;

this.age =age;

this.say = function(){

console.log("animal say something");

}

function Cat(name,age){

Animal.apply(this,[name,age]);

}

var cat1 = new Cat("xingoo",3);

console.log(cat1.name);

console.log(cat1.age);

cat1.say();

function Pig(name,age){

this.say = function(){

console.log("i am pig");

}

Pig.prototype = new Animal();

function Dog(name,age){

this.say = function(){

console.log("i am dog");

}

Dog.prototype = new Animal();

function say(animal){

if(animal instanceof Animal){

animal.say();

}

var dog = new Dog();

var pig = new Pig();

say(dog);

say(pig);

</script>

</body>

</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。