zoukankan      html  css  js  c++  java
  • JavaScript继承

    继承有什么作用?

    继承可以让子类拥有父类的方法和属性,然后在这个基础上进行方法和属性调用,可以提高代码的复用性和效率。

    1. 下面两种写法有什么区别?

    //方法1
    function People(name, sex) {
        this.name = name;
        this.sex = sex;
        this.printName = function () {
            console.log(this.name);
        }
    }
    
    var p1 = new People('java', '男');
    
    //方法2
    function Person(name,sex) {
        this.name = name;
        this.sex = sex;
    }
    
    Person.prototype.printName = function () {
        console.log(this.name);
    }
    var p2 = new Person('javascript','女');
    • 写法1 把printName方法放在了构造函数里,每次new一个对象的时候,都会实例化当前对象的printName方法。如果当前new10个People对象,都会重复实例化当前printName方法10次,这样重复非常浪费空间。

    • 写法2 在每次new一个对象的时候,都不会重复实例化printName方法,因为printName方法在原型链上,如果当前new10个People对象,原型链上printName不会重复实例化,所有的对象都会共用原型链上的方法,这样就会节约空间。

    2. 如下代码中call的作用是什么?

    function Person(name, sex) {
        this.name = name;
        this.sex = sex;
    }
    function Male(name,sex,age) {
        Person.call(this, name, sex); //这里的call是什么作用?
        this.age = age;
    }
    var mal = new Male('java', '女', 2);
    mal.hasOwnProperty('printName'); //false

    call 调用Person函数 第一个参数this指向Male,使Male函数实现构造函数继承,获取Person下的属性

    hasOwnProperty()方法会返回一个布尔值,指示对象是否具有指定的属性作为自身(不继承)属性。

    3.实现一个完整的继承

    function Person(name, sex) {
        this.name = name;
        this.sex = sex;
    }
    
    Person.prototype.printName = function () {
        console.log(this.name);
    }
    
    function Male(name, sex, age) {
        Person.call(this, name, sex); //这里的call是什么作用?
        this.age = age;
    }
    
    Male.prototype = new Person();
    Male.prototype.getAge = function () {
        console.log(this.age);
    }
    
    var mal = new Male('javascript', '女', 2);
    mal.printName();
    mal.getAge();
  • 相关阅读:
    一行命令搞定node.js 版本升级
    doesn't contain a valid partition table 解决方法
    debian kill 进程等命令
    FastDFS配置说明(中英文)
    FastDFS问题汇总
    FastDFS常见命令
    FastDFS安装配置手册
    windows 与Linux 互传文件
    FtpClient中文乱码问题解决
    windows 配置host
  • 原文地址:https://www.cnblogs.com/sxhlf/p/6845360.html
Copyright © 2011-2022 走看看