javascript如何实现create方法


Posted in Javascript onNovember 04, 2019

这篇文章主要介绍了javascript如何实现create方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1. 背景

项目使用 easyui + jquery作为前端框架,之前基本上是些后端代码设计,前端涉略仅限于应用。

项目js是之前部门领导写的一个框架,使用面向过程方法进行编码,前端代码耦合较深,修改起来捉襟见肘。

希望以统一方式对jquery代码进行设计管理,有必要对jquery源码有一定程度了解。

理解代码最好的方式,本人感觉应该是造简化版轮子。大致理解原型链之后,本文参考引用博文时限一个create函数。

2. 实现

javascript如何实现create方法

构造函数的constructor属性在声明以后自动赋值为自身,同时People的__proto__属性赋值为Function.prototype。

javascript如何实现create方法

使用new方式和Function.call方式创建的对象在原型上存在区分。

javascript如何实现create方法

new方式对象__proto__属性指向其构造函数prototype对象,Function.call方式对象__proto__属性指向Object的prototype对象。

因此Function.call()方式创建对象只要修改__proto__属性指向,私认为等价于new方式创建对象,代码如下。

function create(){
  // 1. 创建一个空对象
  let obj = {};
  
  // 2. 获取构造函数
  let constructor = [].shift.call(arguments);

  // 3. 链接到原型
  obj.__proto__ = constructor.prototype;

  // 4. 绑定this值
  let result = constructor.apply(obj, arguments);

  // 5. 返回新对象
  return typeof result==='object' ? result : obj;
}

调用方式为

var people = create(People,'Bob',22);

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript之函数直接量(function(){})()
Jun 29 Javascript
javascript实现给定半径求出圆的面积
Jun 26 Javascript
基于javascript代码检测访问网页的浏览器呈现引擎、平台、Windows操作系统、移动设备和游戏系统
Dec 03 Javascript
vue.js入门教程之基础语法小结
Sep 01 Javascript
Node.js利用Net模块实现多人命令行聊天室的方法
Dec 23 Javascript
VueJs组件prop验证简单介绍
Sep 12 Javascript
关于预加载InstantClick的问题解决方法
Sep 12 Javascript
在Vue组件上动态添加和删除属性方法
Feb 23 Javascript
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
Oct 25 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
Nov 01 Javascript
JS简单表单验证功能完整示例
Jan 26 Javascript
node.js 微信开发之定时获取access_token
Feb 07 Javascript
关于vue里页面的缓存详解
Nov 04 #Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
Nov 04 #Javascript
解决vue更新路由router-view复用组件内容不刷新的问题
Nov 04 #Javascript
vue实现权限控制路由(vue-router 动态添加路由)
Nov 04 #Javascript
Vue路由对象属性 .meta $route.matched详解
Nov 04 #Javascript
element-ui table组件如何使用render属性的实现
Nov 04 #Javascript
Vue 解决多级动态面包屑导航的问题
Nov 04 #Javascript
You might like
重置版战役片段
2020/04/09 魔兽争霸
php实例分享之通过递归实现删除目录下的所有文件详解
2014/05/15 PHP
[原创]php实现 data url的图片生成与保存
2016/12/04 PHP
PHP pthreads v3下worker和pool的使用方法示例
2020/02/21 PHP
xtree.js 代码
2007/03/13 Javascript
使用jQuery和PHP实现类似360功能开关效果
2014/02/12 Javascript
详解JavaScript表单验证(E-mail 验证)
2016/03/31 Javascript
vue.js实现请求数据的方法示例
2017/02/07 Javascript
jQuery Form插件使用详解_动力节点Java学院整理
2017/07/17 jQuery
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
浅谈Angular 的变化检测的方法
2018/03/01 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
2018/05/04 Javascript
实例详解vue.js浅度监听和深度监听及watch用法
2018/08/16 Javascript
小程序日历控件使用方法详解
2018/12/29 Javascript
教你完全理解ReentrantLock重入锁
2019/06/03 Javascript
JavaScript使用localStorage存储数据
2019/09/25 Javascript
微信小程序实现文件预览
2020/10/22 Javascript
[02:03]风行者至宝清风环佩外观展示
2020/09/05 DOTA
[04:20]DOTA2-DPC中国联赛 正赛 VG vs LBZS 选手采访 1月19日
2021/03/11 DOTA
Python实现根据指定端口探测服务器/模块部署的方法
2014/08/25 Python
python smtplib模块实现发送邮件带附件sendmail
2018/05/22 Python
如何不用安装python就能在.NET里调用Python库
2019/07/12 Python
Django中在xadmin中集成DjangoUeditor过程详解
2019/07/24 Python
Django使用Channels实现WebSocket的方法
2019/07/28 Python
python快速编写单行注释多行注释的方法
2019/07/31 Python
Python函数装饰器原理与用法详解
2019/08/16 Python
Django model重写save方法及update踩坑详解
2020/07/27 Python
网络艺术零售业的先驱者:artrepublic
2017/09/26 全球购物
Notino希腊:购买香水和美容产品
2019/07/25 全球购物
Interrail法国:乘火车探索欧洲,最受欢迎的欧洲铁路通票
2019/08/27 全球购物
大学应届生的自我评价
2014/03/06 职场文书
大学生新学期计划书
2014/04/28 职场文书
专题组织生活会发言材料
2014/10/17 职场文书
爱晚亭导游词
2015/02/09 职场文书
python爬虫selenium模块详解
2021/03/30 Python
MySQL深度分页(千万级数据量如何快速分页)
2021/07/25 MySQL