原型继承总结

来源：互联网发布：淘宝开店在哪里申请编辑：程序博客网时间：2024/06/07 18:36

<!DOCTYPE html><!--1.原型链--><!--2. call apply-->

<!--3. object.create()-->
<!--4.只继承原型-->

<!--5.浅拷贝深拷贝--> object.assign() 实现浅拷贝

<!--本总结暂时只讨论1-2-3-->

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Title</title>

</head>

<body>

<script>    //-----------------------one part-----------------------function Person(first,last) {    this.first = first;    this.last = last;    this.fullNameinstance = function () {        return this.first+' instance '+this.last;    }}Person.prototype = {    fullName:function () {        return this.first+' proto '+this.last;    },    fullNameReversed:function () {        return this.last+','+this.first;    }};var dw = new Person("din","wan");alert(dw.fullNameinstance());alert(dw.fullName());function Goodperson(first,last) {    this.first = first;    this.last = last;    this.goodfullnameinstance = function () {        return this.first + 'good instance ' + this.last;    }};Goodperson.prototype = new Person();Goodperson.prototype.constructor = Goodperson;Goodperson.prototype.goodfullname = function () {      //这个一定要写到前面这行代码的后面  否则会出错    return this.first + ' good pro ' + this.last;};//    Goodperson.prototype = {                 这里是错误的  这是全覆盖  如果这样写后面的 good.fullname()就不能访问//        goodfullname:function () {//            return this.first + 'good' + this.last;//        }//    };var good = new Goodperson("dada","wang");alert(good.fullNameinstance());alert(good.fullName());alert(good.goodfullnameinstance());alert(good.goodfullname());//-----------------------two part-----------------------function Person(first,last) {    this.first = first;    this.last = last;    this.fullNameinstance = function () {        return this.first+' instance '+this.last;    }};Person.prototype = {    fullName:function () {        return this.last+'proto'+this.first;    },    fullNameReversed:function () {        return this.last+','+this.first;    }};var dw = new Person("din","wan");alert(dw.fullNameinstance());     //--din instance wanalert(dw.fullName());             //--din proto wanfunction Student(first,last,id) {    Person.call(this,first,last);     //call是function才有的    所以Person.prototype.call(this,first,last); 是不行的  也就是说call不能指向Person 的 prototype    this.id = id;    this.studentnameinstance = function () {        return this.first + 'student instance ' + this.last;    }};Student.prototype = new Person();//    Student.prototype = {//       getid:function () {//           return this.id;//       }//    };    //如果这样写就会有问题Student.prototype.getid = function () {    return this.id;};Student.prototype.studnetnamePro = function () {    return this.first + ' student pro ' + this.last;};var dinwan = new Student("din","wan","21");alert(dinwan.fullNameinstance());   //--din instance wanalert(dinwan.fullName());           //--din proto wanalert(dinwan.studentnameinstance());  //--din student instance wanalert(dinwan.studnetnamePro());       //--din student pro wanalert(dinwan.getid());               //--21
//----------------------------three part-------------------------------
function Shape() {
this.x = 0;
this.y = 0;
}
Shape.prototype.move = function(x,y) {
this.x += x;
this.y += y;
console.info("Shape moved.")
} ;
function Reatangle() {
Shape.call(this); //call super constructor.
}
Rectangle.prototype = Object.create(Shape.prototype);
var rect = new Rectangle();
rect instanceof Rectangle //true.
rect instanceof Shape //true.
rect.move(1,1); //Outputs,"Shape moved"
</script>

</body>

</html>

0 0