js 构造函数 & 静态方法 & 原型 & 实例方法
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 构造函数 & 静态方法 & 原型 & 实例方法的更多相关文章
- 深入研究js构造函数和原型
很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...
- 笔记: js构造函数与原型
目录 构造函数与原型介绍 涉及三种引用的操作 有关原型及原型链的一些相关方法总结 @ 构造函数与原型介绍 1.函数与函数的原型对象(prototype object): 在JavaScript中,创建 ...
- 完整原型链详细图解之JS构造函数、原型 原型链、实例化对象
一.首先说一下什么是构造函数: 构造函数:用来在创建对象时初始化对象.特点:构造函数名一般为大写字母开头:与new运算符一起使用来实例化对象. 举例: function Person(){} //Pe ...
- JS构造函数、原型对象、隐含参数this
This 解析器再调用函数每次都会向函数内部传递一个隐含的参数this,this指向的是一个对象(函数执行的上下文对象) 1.以函数形式调用时,this永远是window. 2.以方法形式调用时,th ...
- js之静态方法与实例方法
静态方法是指不需要声明类的实例就可以使用的方法. 实例方法是指必须要先使用"new"关键字声明一个类的实例, 然后才可以通过此实例访问的方法. function staticCla ...
- 一句话总结JS构造函数、原型和实例的关系
"每个构造函数都有一个原型对象, 原型对象都包含一个指向构造函数的指针, 实例都包含一个指向原型对象的内部指针." --此段话摘自<JavaScript高级程序设计>. ...
- JS基础——构造函数VS原型
JS是一种基于对象的语言.在使用过程中不免遇到复制对象的问题.但通常我们採用的直接赋值'obj1=obj2'这样的做法会出现数据覆盖问题. 也就是对象引用过程中引用地址一致.导致对象数据被改动的问题. ...
- Js类的静态方法与实例方法区分以及jQuery如何拓展两种方法
上学时C#老师讲到对象有两类方法,静态方法(Static)和实例方法(非Static),当时不理解静态是为何意,只是强记. 后来从事前端工作,一直在对类(即对象,Js中严格来说没有类的定义,虽众所周知 ...
- JS构造函数的用法和JS原型
$(function(){ var rec = new Rectangle(5, 10); //alert(rec.width + "*" + rec.height + " ...
随机推荐
- Android N wifi auto connect流程分析
定义 当有两个或者两个以上的已经保存的无线网络可以连接时,系统通过选择算法来选择一个最优网络. 在Android L,wifi的自动重连机制是由WifiAutoJoinController 类来实现, ...
- 【Azure Developer】在Azure Resource Graph Explorer中查看当前订阅下的所有资源信息列表并导出(如VM的名称,IP地址内网/公网,OS,区域等)
问题描述 通过Azure的Resource Graph Explorer(https://portal.azure.cn/#blade/HubsExtension/ArgQueryBlade),可以查 ...
- SpringIOC的注解应用
SpringIOC的注解应用 在之前的项目中,我们都是通过xml文件进行bean或者某些属性的赋值,其实还有另外一种注解的方式,在企业开发中使用的很多,在bean上添加注解,可以快速的将bean注 ...
- 每天学一点 Vue3(一) CND方式的安装以及简单使用
简介 感觉vue3的新特性很舒服,这样才是写软件的感觉嘛.打算用Vue实现自己的一些想法. Vue3还有几个必备库,比如Vue-Router(负责路由导航).Vuex(状态管理.组件间通信),还有第三 ...
- TCP/IP中的Payload概念以及由此引申出的一些问题
TCP报文一次性最大运输的货物量(Payload),大体可以这么来计算: IP报文头长度 + TCP报文头长度 + Payload长度 ≤ MTU 即左边的三者之和,要小于等于右边MTU的长 ...
- Pulsar Pub/Sub Messaging
The Apache Software Foundation Announces Apache Pulsar as a Top-Level Project : The Apache Software ...
- Python中单引号,双引号,三引号的区别
Python中的字符串一般用单引号('A'),双引号("A")和三引号('''A''')或者("""A""") 1.单引 ...
- Redis分布式锁升级版RedLock及SpringBoot实现
分布式锁概览 在多线程的环境下,为了保证一个代码块在同一时间只能由一个线程访问,Java中我们一般可以使用synchronized语法和ReetrantLock去保证,这实际上是本地锁的方式.但是现在 ...
- Zookeeper语法
ZooKeeper 是一个典型的分布式数据一致性解决方案,分布式应用程序可以基于 ZooKeeper 实现诸如数据发布/订阅.负载均衡.命名服务.分布式协调/通知.集群管理.Master 选举.分布式 ...
- ts中提示“绑定元素“routes”隐式具有“any”类型”
思考单独的.ts和typescript框架在vscode层的差异,想想只有launch.json和tsconfig.json,一个个属性过去后,发现是tsconfig.json配置项"noI ...