首页 > 其他分享 >js 原型链 & class

js 原型链 & class

时间:2023-07-13 16:47:40浏览次数:36  
标签:console log fx1 ts js add 原型 class

https://es6.ruanyifeng.com/#docs/class

 

早期采用原型链写法

function A(){
    this.fx1 = 1
}

A.prototype.add = function(x){
    this.fx1 += 1;
    console.log(x, this.fx1)
}

A.prototype.ts = function(x){
    console.log(x, this.fx1)

    this.add()

    console.log(x, this.fx1)
}


var  a = new A();

a.add('add')
a.ts('ts')

/*
add 2
ts 2
undefined 3
ts 3
*/

 

2.类

class A{ // static在类上定义静态方法。这些方法不会被类的实例继承,也不属于类的原型对象

    fx0 = 0; // 在这里创建变量和在constructor里传教一下都要this
    constructor(x){
        this.fx1 = 1
        console.log(x, this.fx1, this.fx0)
    }

    add(x){
        this.fx1 += 1
        this.fx0 += 1
        console.log(x, this.fx1, this.fx0)
    }

}

/*
var a = new A('hi')
a.add('add')

hi 1 0
add 2 1
*/

class B extends A {
  constructor(x, y) {
    super(x); // 引用父类的构造方法, 在构造函数中调用
  }

  show(){
    super.add('b add') // super.add 和 this.add都可以调用
    //console.log(super.fx0) // undefined
  }

}
var b = new B('hi')
// b.add('add')
b.show()

 

标签:console,log,fx1,ts,js,add,原型,class
From: https://www.cnblogs.com/fxw1/p/17551298.html

相关文章

  • defined in class path resource [de/codecentric/boot/admin/server/config/AdminSe
    搭建springbootadmin监控时出现的,经排查是版本过低,换个高版本的,顺利进入网页界面<dependency><groupId>de.codecentric</groupId><artifactId>spring-boot-admin-starter-server</artifactId><version>2.7.10</version......
  • 使用nuxtjs静态部署时报错TypeError: renderContext.renderResourceHints is not a fu
    在使用nuxt框架进行静态打包部署时候每次总会有一两个界面报TypeError:renderContext.renderResourceHintsisnotafunction的错误 一开始以为是asyncData中获取的数据有问题,在各种排查后返现数据没问题,再次编译还是会有错误,最后甚至把asyncdata方法给删除掉都还是有这个错......
  • 发送请求忘记指定协议方式,日志com.jcraft.jsch.JSchException: java.net.ConnectExcep
      2023-07-1319:06:51.487-ERROR17629---[http-nio-192.168.2.206-36093-exec-8]c.t.b.p.b.c.common.util.sftp.SftpPool:com.jcraft.jsch.JSchException:java.net.ConnectException:拒绝连接(Connectionrefused)_atcom.jcraft.jsch.Util.createSocket(......
  • 一些js高阶函数的封装及常用优化技巧
    函数防抖//频繁触发、耗时操作,只执行最后一次constdebounce=function(fn,delay=300){lettimer=nullreturnfunction(...args){clearTimeout(timer)timer=setTimeout(()=>{fn.apply(this,args)},delay)}}//constdebounc......
  • js的arguments到底是什么?
    js的arguments到底是什么?类数组对象:arguments众所周知,js是一门相当灵活的语言。当我们在js中在调用一个函数的时候,我们经常会给这个函数传递一些参数,js把传入到这个函数的全部参数存储在一个叫做arguments的东西里面,那么这到底是什么东西?在js中万物皆对象,甚至数组字符串函数都......
  • 【漏洞复现】用友NC uapjs RCE漏洞(CNVD-C-2023-76801)
    产品介绍    用友NC是一款企业级ERP软件。作为一种信息化管理工具,用友NC提供了一系列业务管理模块,包括财务会计、采购管理、销售管理、物料管理、生产计划和人力资源管理等,帮助企业实现数字化转型和高效管理。漏洞概述     用友NC及NCCloud系统存在任意文件上......
  • 使用cropperjs进行头像的上传裁剪
    1.引入依赖npminstallcropperjs2.使用import'cropperjs/dist/cropper.css';importCropperfrom'cropperjs';3.页面及样式,这边我是参考这位up主的(https://blog.csdn.net/weixin_41897680/article/details/123606376),不过这位up主是使用的vue3,我将他修改成了vue2的语......
  • 求js数组最大值
    1letarr=[1,2,3,4,5]23letmax=arr.reduce((prev,cur)=>{4returnMath.max(prev,cur)5})67console.log(max)//expectedoutput:5 //找出数组中最大/小的数字constnumbers=[5,6,2,3,7];//使用Math.min/Math.max以及apply函数......
  • 深入浅出Ext JS:一个完整的EXT应用
    在本文中,我们将综合运用前面所学的知识,开发一个简单的学生信息管理系统(如图12-1所示)。该系统的主要功能包括:显示学生信息、添加学生信息、修改学生信息,以及删除学生信息。这些功能的实现非常简单,我们在这里将演示如何在EXT中实现这些常用功能。......
  • 如何实现redis lua 返回json的具体操作步骤
    RedisLua返回JSON介绍Redis是一种高性能的键值存储数据库,而Lua是一种轻量级的脚本语言。Redis提供了一种强大的功能,即使用Lua脚本来对数据进行复杂的操作。在一些情况下,我们可能需要将Lua脚本返回的结果以JSON的格式返回给客户端,这样客户端可以更方便地处理和解析数据。本文......