1、Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。

var _this = Object.create(fn.prototype);这句代码的意思是fn的prototype属性内容作为新对象的原型内容。

2、apply方法会改变this的指向。原本fn函数中调用时,也就是这样fn(),this指向的是window,但是这样使用之后fn.apply(_this, args); _this指向的是上面新创建的对象,所以改变了fn中this的指向,新对象也就有拥有了fn中的属性 。可以理解为新对象继承了fn中的属性。args是参数,必须是数组的形式,name和age属性也就有了值。

3、return中是一个三元运算,res是否存在,如果存在就返回,不存在就返回_this 。

实例化对象有一个属性叫做__proto__(原型),构造函数上有一个属性叫做prototype(原型对象)。在构造函数实例化的时候,构造函数会把prototype上面的方法和属性,复制到实例化对象的__proto__上。所以实例化对象,继承了构造函数原型上的方法和属性。

一个函数只有通过new实例化之后,才叫做构造函数。

若构造函数中没有返回值或返回值是基本类型(Number、String、Boolean)的值,则返回新实例对象;若返回值是引用类型的值,则实际返回值为这个引用类型。

apply方法会改变this的指向。原本fn函数调用时,也就是fn()这种写法,this指向的是window,但是fn.apply(_this, args)这种写法 _this指向的是上面新创建的对象,所以改变了fn中this的指向,新对象也就有拥有了fn中的属性 。可以理解为新对象继承了fn中的属性。args是参数,必须是数组的形式,name和age属性也就有了值。

            //当使用new关键字去调用那个函数的时候,那这个函数就会被作为构造函数去进行调用,然后它会走构造函数的一套流程去执行这么一个函数
//在这里调用构造函数的样子跟其他语言去实例化一个类的方式也很像,都是使用new关键字,所以很容易造成混淆
//推荐写class //在js中创建一个对象的方式是很多的,构造函数也是其中的一种方式
// const obj = {}
// new Object();
// Object.create(); //使用new关键字调用一个函数,这个函数就会被当做构造函数进行调用
function Person(name,age){
this.name = name;
this.age = age;
}
//如果它没有返回值就会返回出一个对象
//不妨思考一下返回的对象是怎么出现的,为什么它上面有张三跟11
const p =new Person('张三',11)
console.log(p)
//p.__proto__是等于Person.prototype,这也证明了第二步,把构造函数的prototype属性作为空对象的原型。 console.log(p.__proto__ == Person.prototype) //true




            //当用new关键字调用函数的时候,发生了什么,为什么会获得一个新的对象

            // 1.创建一个空的对象
// 2.把构造函数的prototype属性(Person.prototype) 作为空对象的原型,这样空对象就可以访问到Person.prototype上面的方法了
// 3.this赋值为这个空对象
// 4.执行函数
// 5.如果函数没有返回值,则返回this(也可以说是返回之前那个空对象) //把一个函数变成构造函数:
function Constructor(fn,args){
//fn表示要作为构造函数的函数,args表示要调用fn这个构造函数时需要传递给它的一些参数 //1.创建空对象
var _this = Object.create(fn.prototype); //以fn.prototype为原型创建的一个空对象 //第一个参数表示fn函数内部的this指向的对象,第二个参数是传入fn函数的参数 //fn函数是window对象调用的,所以this指向的是window ,然后使用apply方法,改变this指向创建的Person 对象。
var res = fn.apply(_this, args);
console.log(res) //输出undefined,为什么? //如果有res就返回res,如果没有就返回创建的对象
return res ? res : _this;
} function Person1(name,age){
this.name = name;
this.age = age;
}
Person1.prototype.say = function(){
console.log('我叫' + this.name);
} var person = Constructor(Person1, ['李四',21])
console.log(person)


在ES5中模拟类的更多相关文章

  1. Es5中的类和静态方法 继承

    Es5中的类和静态方法 继承(原型链继承.对象冒充继承.原型链+对象冒充组合继承) // es5里面的类 //1.最简单的类 // function Person(){ // this.name='张 ...

  2. Typescript 学习笔记四:回忆ES5 中的类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  3. ES5中的类与继承

    最近在重新复习TypeScript,看到类这块的时候自然会和ES5中的类写法进行对比加深印象. 发现ES5的类与继承一些细节还是挺多的,时间久了容易忘记,特此记录下. 首先是ES5的类定义,这没什么好 ...

  4. ES5中的类

    之前小编对于类和类的基本特征(所谓的封装.继承.多态)理解一直不是很到位,同时在实际项目应用中也用的比较少,今天小编就结合ES5中的基本用法和大家聊聊,希望小伙伴会在这篇文章有属于自己的收获,并能够在 ...

  5. Typescript中的类 Es5中的类和静态方法和继承(原型链继承、对象冒充继承、原型链+对象冒充组合继承)

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...

  6. ES6中的类

    前面的话 大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScri ...

  7. koa 基础(十七)原生 JS 中的类、静态方法、继承

    1.app.js /** * 原生 JS 中的类.静态方法.继承 * es5中的类和静态方法 */ function Person(name, age) { // 构造函数里面的方法和属性 this. ...

  8. 《深入理解ES6》笔记—— JavaScript中的类class(9)

    ES5中的近类结构 ES5以及之前的版本,没有类的概念,但是聪明的JavaScript开发者,为了实现面向对象,创建了特殊的近类结构. ES5中创建类的方法:新建一个构造函数,定义一个方法并且赋值给构 ...

  9. 在 JavaScript 中使用构造器函数模拟类

    今天,我们要讲的是在 JavaScript 中使用构造器函数(construcor function)模拟类. 构造器函数简介 你可以使用 ES6 的 class 关键字来实现类,不过我建议你使用传统 ...

随机推荐

  1. Python基础之用PyQt5界面代码分离以及自定义一个槽函数

    最近开发一个项目,需要用到界面,遇到界面不能实时更新的问题,看到网上很多用槽函数,但是大多都是些button的,并不是我需要的,要么就是整数的,后来自己进行尝试,写了一个自定义的槽函数处理treewi ...

  2. jvm源码解读--03 常量池的解析ConstantPool

    先看bt栈 (gdb) bt #0 ConstantPool::allocate (loader_data=0x7fe21802e868, length=87, __the_thread__=0x7f ...

  3. 基于ifix组态软件研究控制按钮权限

    背景: 在前阵子做基于ifix生成电力监控平台时,遇到业主提出的一个需求.关于如何在控制弹窗中,点击相应的合分闸按钮时,优先弹出登录界面,当输入相应的有权限用户名和密码后,才能操作这一要求.后实现如下 ...

  4. .net core连接Liunx上MS SQL Server

    场景 由于业务要求,需要对甲方的一个在SQL Server上的财务表进行插入操作.研究了半天,因为一个小问题折腾了很久. 过程 .net core端: 1. 利用EF,就需要的导入相关的Nuget包, ...

  5. 开源ERP和其它ERP软件比较

    现在有许多企业将ERP项目,在企业中没有实施好,都归咎于软件产品不好.其实,这只是你们的借口.若想要将ERP软件真正与企业融合一体,首先得考虑企业的自身情况,再去选择适合的 ERP软件. 如果你的企业 ...

  6. 网安日记③之通过iis搭建ftp并使用通过serv-u搭建ftp

    通过iis搭建ftp并使用通过serv-u搭建ftp 安装iis的ftp访问 由于在安装iis时勾选了ftp服务,我们直接在iis界面右键ftp服务打开属性查看本地路径 在电脑目录下打开安装目录,并在 ...

  7. SQL语句(二)数据排序和单行函数

    目录 一.排序查询 1. 基本排序 2. 多条件排序 二.单行函数 调用方法 字符函数 ①LENGTH函数 ②CONCAT函数 ③upper 和 lower ④substr ⑤instr ⑥trim ...

  8. LVM磁盘配额

    目录 一.LVM概述 1.1.逻辑卷管理 1.2.LVM机制的基本概念 二.LVM管理命令 三.磁盘配额概述 3.1.实现磁盘配额的条件 3.2.Linux磁盘限额的特点 3.3.常用命令及选项 3. ...

  9. .net 知新:【4】NuGet简介和使用

    在包管理以前我们在项目中引用第三方包通常是去下载dll放到项目中再引用,后来逐渐发展成各种包管理工具,nuget就是一种工具,适用于任何现代开发平台的基本工具可充当一种机制,通过这种机制,开发人员可以 ...

  10. .NET Core/.NET5/.NET6 开源项目汇总12:WPF组件库2

    系列目录     [已更新最新开发文章,点击查看详细] WPF(Windows Presentation Foundation)是微软推出的基于Windows 的用户界面框架,属于.NET Frame ...