js 实现继承

news/2024/7/19 13:03:48 标签: js, 继承, call, prototype, apply
    1. 对象冒充
        实例:
            var Parent = function (username) {
                this.username = username
                this.getUserName = function () {
                    console.log('username:' + username)
                }
            }

            var Child = function (username, age) {
              this.method = Parent
              this.method(username)
              delete this.method

              this.getAge = function () {
                console.log('age:' + age)
              }
            }

            var p = new Parent('Tim')
            var s = new Child('Little Time', 5)

            p.getUserName()
            s.getUserName()
            s.getAge()

    

    2. call方式
        call方法是Function类中的方法
      call方法的第一个参数的值赋值给类(即方法)中出现的this
      call方法的第二个参数开始依次赋值给类(即方法)所接受的参数
        实例:
            var Parent = function (username) {
              this.username = username
              this.read = function () {
                console.log('read your ' + username)
              }
            }

            var Child = function (username, age) {
              Parent.call(this, username)
              this.age = age
              this.getAge = function () {
                console.log('appear your age :' + age)
              }
            }

            var p = new Parent('Tom')
            var s = new Child('little tom', 12)

            p.read()
            s.read()
            s.getAge()

  

 3. apply方式
    apply方法接受2个参数,
    第一个参数与call方法的第一个参数一样,即赋值给类(即方法)中出现的this
    第二个参数为数组类型,这个数组中的每个元素依次赋值给类(即方法)所接受的参数
        实例:
            var Parent = function (username) {
              this.username = username
              this.getName = function () {
                console.log('username:' + username)
              }
            }

            var Child = function (username, age) {
              Parent.apply(this, new Array(username))
              this.age = age
              this.getAge = function () {
                console.log('age:' + age)
              }
            }

            var p = new Parent('Shary')
            var s = new Child('little shary', 19)

            p.getName()
            s.getName()
            s.getAge()

    

    4. 原型链方式
        即子类通过prototype将所有在父类中通过prototype追加的属性和方法都追加到Child,从而实现了继承
        实例:
            var Parent = function () {}

            Parent.prototype.username = 'parent'
            Parent.prototype.getName = function () {
              console.log('username:' + this.username)
            }

            var Child = function () {}
            Child.prototype = new Parent()
            Child.prototype.getAge = function (age) {
              console.log('age:' + age)
            }

            var p = new Parent()
            p.getName()
            var s = new Child()
            s.getName()
            s.getAge(70)

 


http://www.niftyadmin.cn/n/1162524.html

相关文章

vue 可拖拽table

Element UI下的示例&#xff1a; <template><div style"width:800px"><el-table :data"tableData"borderrow-key"id"align"left"><el-table-column v-for"(item, index) in col":key"col_${inde…

Android 环境下报错You have not accepted the license agreements of the following SDK components:

报错信息类似于&#xff1a; A problem occurred configuring project :app. > You have not accepted the license agreements of the following SDK components: [Android SDK Build-Tools 26.0.3, Android SDK Platform 26]. Before building your project, you nee…

使用AnyProxy监听移动端网络请求

AnyProxy是阿里公司分享的一款nodeJS中间件。其作用是可以用来监听移动端的接口访问以及参数请求&#xff0c;用通俗的语言这个叫做抓包。通过node的npm对AnyProxy本地化全局安装npm install -g anyproxy即可。可以通过npm config get prefix查看npm的安装目录&#xff0c;全局…

JS对象的引用复制和数据复制

JS对象分为两类&#xff0c;一类为基础类型对象&#xff0c;包括字符串(String)&#xff0c;数值(Number)&#xff0c;布尔值(Boolean)&#xff0c;null(空)&#xff0c;undefined(未定义)。另一类为合成对象&#xff0c;又叫做引用类型对象&#xff0c;包括数组(Array)&#x…

获取当前页面url的各类参数

Location 对象Location 对象包含有关当前 URL 的信息Location 对象是 Window 对象的一个部分&#xff0c;可通过 window.location 属性来访问Location的各种属性&#xff1a;window.location.hash > 设置或返回从井号 (#) 开始的 URL&#xff08;锚&#xff09;window.locat…

链接远程服务器

大多数情况下除服务器以外的个人PC多数采用的是window系统&#xff0c;在使用window系统连接远程云服务器时&#xff0c;需要根据云服务器的搭载系统采取不同的连接策略。 window系统连接搭载window系统的云服务器时&#xff0c;可以通过系统自带的远程连接功能创建连接。 win…

centos 中文乱码

centos是否有中文乱码的情况&#xff0c;简单的输入指令help即可查看是否有乱码情况出现。 一般出现乱码有两种可能&#xff0c;一是系统没有安装中文语言包&#xff0c;一是系统安装有中文语言包&#xff0c;但是没有应用。 通过输入执行locale -a | grep "zh_CN"…

centos系统安装及配置

文件 > 新建虚拟机 > 自定义 > 硬件兼容性采用推荐 > 选择centos镜像 > 虚拟机命名并且选择安装目录(非C盘外) > 配置处理器(根据实际情况配置&#xff0c;一般配置两个处理器&#xff0c;每个处理器双核&#xff0c;共四核&#xff0c;够用) > …