js 构造函数 & 静态方法 & 原型 & 实例方法

ES5

"use strict";

/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-10-10
* @modified
*
* @description 构造函数 静态方法 & 构造函数的原型 实例方法
* @description 构造函数上添加只有构造函数可以访问的静态方法
* @description 在构造函数的原型上添加只有实例才可以访问的实例方法 require
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://www.cnblogs.com/xgqfrms/p/13790093.html
* @solutions
*
* @best_solutions
*
*/ const log = console.log; // ES5 constructor
// const func = function (id, name) {
function func (id, name) {
// log(`func.name =`, func.name);
// func.name = func
this.name = name;
this.id = id;
this.getId = () => this.id;
}
// ƒ (id) {
// this.id = id;
// this.getId = () => this.id;
// } // 在构造函数上添加只有构造函数可以访问的静态方法 func._getName
func._getName = function(f) {;
log(`${f.name} =`, f);
// f3 = func {name: "f3", id: "3", getId: ƒ}
return f.name;
}
// ƒ (f) {;
// log(`${f.name} =`, f);
// // f3 = func {name: "f3", id: "3", getId: ƒ}
// return f.name;
// } // 在构造函数的原型上添加只有实例才可以访问的实例方法 require
func.prototype.require = function () {
// 调用构造函数的静态方法 func._getName
const name = func._getName(this);
log(`${name}'s name =`, name);
// f3's name = f3
return this.getId();
}
// ƒ () {
// // 调用构造函数的静态方法 func._getName
// const name = func._getName(this);
// log(`${name}'s name =`, name);
// // f3's name = f3
// return this.getId();
// } const f3 = new func(`3`, `f3`);
// func {id: "3", getId: ƒ}
f3.id;
// "3"
f3.getId();
// "3" f3.require();
// f3 = func {name: "f3", id: "3", getId: ƒ}
// f3's name = f3
// "3" func._getName(f3);
// f3 = func {name: "f3", id: "3", getId: ƒ}
// "f3" // func.require();
// Uncaught TypeError: func.require is not a function

ES6

"use strict";

/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-10-10
* @modified
*
* @description 构造函数 静态方法 & 构造函数的原型 实例方法
* @description 构造函数上添加只有构造函数可以访问的静态方法
* @description 在构造函数的原型上添加只有实例才可以访问的实例方法 require
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://www.cnblogs.com/xgqfrms/p/13790093.html
* @solutions
*
* @best_solutions
*
*/ const log = console.log; // ES6 class constructor
class func {
constructor(id, name) {
// log(`func.name =`, func.name);
// func.name = func
this.name = name;
this.id = id;
this.getId = () => this.id;
}
} // 在构造函数上添加只有构造函数可以访问的静态方法 func._getName
func._getName = function(f) {;
log(`${f.name} =`, f);
// f3 = func {name: "f3", id: "3", getId: ƒ}
return f.name;
} // 在构造函数的原型上添加只有实例才可以访问的实例方法 require
func.prototype.require = function () {
// 调用构造函数的静态方法 func._getName
const name = func._getName(this);
log(`${name}'s name =`, name);
// f3's name = f3
return this.getId();
} const f3 = new func(`3`, `f3`);
// func {id: "3", getId: ƒ}
f3.id;
// "3"
f3.getId();
// "3" f3.require();
// f3 = func {name: "f3", id: "3", getId: ƒ}
// f3's name = f3
// "3" func._getName(f3);
// f3 = func {name: "f3", id: "3", getId: ƒ}
// "f3" // func.require();
// Uncaught TypeError: func.require is not a function

refs

http://www.ruanyifeng.com/blog/2015/05/require.html



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


js 构造函数 & 静态方法 & 原型 & 实例方法的更多相关文章

  1. 深入研究js构造函数和原型

    很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...

  2. 笔记: js构造函数与原型

    目录 构造函数与原型介绍 涉及三种引用的操作 有关原型及原型链的一些相关方法总结 @ 构造函数与原型介绍 1.函数与函数的原型对象(prototype object): 在JavaScript中,创建 ...

  3. 完整原型链详细图解之JS构造函数、原型 原型链、实例化对象

    一.首先说一下什么是构造函数: 构造函数:用来在创建对象时初始化对象.特点:构造函数名一般为大写字母开头:与new运算符一起使用来实例化对象. 举例: function Person(){} //Pe ...

  4. JS构造函数、原型对象、隐含参数this

    This 解析器再调用函数每次都会向函数内部传递一个隐含的参数this,this指向的是一个对象(函数执行的上下文对象) 1.以函数形式调用时,this永远是window. 2.以方法形式调用时,th ...

  5. js之静态方法与实例方法

    静态方法是指不需要声明类的实例就可以使用的方法. 实例方法是指必须要先使用"new"关键字声明一个类的实例, 然后才可以通过此实例访问的方法. function staticCla ...

  6. 一句话总结JS构造函数、原型和实例的关系

    "每个构造函数都有一个原型对象, 原型对象都包含一个指向构造函数的指针, 实例都包含一个指向原型对象的内部指针." --此段话摘自<JavaScript高级程序设计>. ...

  7. JS基础——构造函数VS原型

    JS是一种基于对象的语言.在使用过程中不免遇到复制对象的问题.但通常我们採用的直接赋值'obj1=obj2'这样的做法会出现数据覆盖问题. 也就是对象引用过程中引用地址一致.导致对象数据被改动的问题. ...

  8. Js类的静态方法与实例方法区分以及jQuery如何拓展两种方法

    上学时C#老师讲到对象有两类方法,静态方法(Static)和实例方法(非Static),当时不理解静态是为何意,只是强记. 后来从事前端工作,一直在对类(即对象,Js中严格来说没有类的定义,虽众所周知 ...

  9. JS构造函数的用法和JS原型

    $(function(){ var rec = new Rectangle(5, 10); //alert(rec.width + "*" + rec.height + " ...

随机推荐

  1. 计算机网络安全 —— C# 使用谷歌身份验证器(Google Authenticator)(五)

    一.Google Authenticator 基本概念  Google Authenticator是谷歌推出的一款动态口令工具,旨在解决大家Google账户遭到恶意攻击的问题,在手机端生成动态口令后, ...

  2. redis list 列表 查找 时间复杂度

    http://redisbook.com/preview/intset/content.html 列表对象 列表对象的编码可以是 ziplist 或者 linkedlist . ziplistFind ...

  3. 获取当前文件路径 import 原理 一般把模块组成的集合称为包(package)

    获取当前文件路径 testpath.py import sysprint(sys.path) [root@d mapReduceLog]# python testpath.py['/data/mapR ...

  4. LOJ2125

    LOJ2125 树上操作 题目描述 有一棵点数为 N 的树,以点 1 为根,且树有点权.然后有 M 个操作,分为三种: 把某个节点 x 的点权增加 aa . 把某个节点 x 为根的子树中所有点的点权都 ...

  5. AutoMapper源码解析

    研究AutoMapper源码前,我们先来看一下AutoMapper的作用 官网解释:AutoMapper是一个简单的小程序库,旨在解决看似复杂的问题-摆脱将一个对象映射到另一个对象的代码 解释 首先一 ...

  6. SpringMVC听课笔记(十四:异常处理)

    1. SpringMVC通过HandlerExceptionResolver处理程序的异常,包括Handler映射,数据绑定以及目标方法执行时发生的异常 2.SpringMVC提供的HandlerEx ...

  7. Excel 如何实现以万为单位 保留两位小数 且不四舍五入

    数据科学交流群,群号:189158789,欢迎各位对数据科学感兴趣的小伙伴的加入! =TEXT(INT(I18/100)*1000,"0!.00,万") 将I18替换成你要转化的单 ...

  8. k8s command & args

    命令和参数说明: command.args两项实现覆盖Dockerfile中ENTRYPOINT的功能,具体的command命令代替ENTRYPOINT的命令行,args代表集体的参数. 如果comm ...

  9. 2.centos 7清空文件和文件夹

    1.清空文件 测试文件:a.txt 1)方法一,[root@centos test]# > a.txt [root@centos test]# cat a.txt 1hjbfao hjkl23o ...

  10. 12.su 命令与sudo 服务

     1.su 命令:解决切换用户身份的需求,使得当前用户在不退出登录的情况下,顺畅地切换到其他用户. 比如从root 管理员切换至普通用户: [root@Centos test]# id uid=0(r ...