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中String的常用方法实例分析
Jun 13 Javascript
jquery实现简单的表单验证
Nov 17 Javascript
浅谈JS运算符&&和|| 及其优先级
Aug 10 Javascript
javascript replace()第二个参数为函数时的参数用法
Dec 26 Javascript
vue中如何实现pdf文件预览的方法
Jul 12 Javascript
微信小程序在地图选择地址并返回经纬度简单示例
Dec 03 Javascript
Vue项目部署的实现(阿里云+Nginx代理+PM2)
Mar 26 Javascript
js实现简单音乐播放器
Jun 30 Javascript
浅谈vue 二级路由嵌套和二级路由高亮问题
Aug 06 Javascript
js实现3D旋转效果
Aug 18 Javascript
token 机制和实现方式
Dec 15 Javascript
JS中一些高效的魔法运算符总结
May 06 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
PHP Session_Regenerate_ID函数双释放内存破坏漏洞
2011/01/27 PHP
一个简单的网页密码登陆php代码
2012/07/17 PHP
PHP生成各种随机验证码的方法总结【附demo源码】
2017/06/05 PHP
PHP调用API接口实现天气查询功能的示例
2017/09/21 PHP
javascript 对象定义方法 简单易学
2009/03/22 Javascript
js实现addClass,removeClass,hasClass的函数代码
2011/07/13 Javascript
Document.location.href和.replace的区别示例介绍
2014/03/04 Javascript
jquery进行数组遍历如何跳出当前的each循环
2014/06/05 Javascript
jquery uploadify 在FF下无效的解决办法
2014/09/26 Javascript
浅谈JavaScript中setInterval和setTimeout的使用问题
2015/08/01 Javascript
jquery拖动层效果插件用法实例分析(附demo源码)
2016/04/28 Javascript
js获取时间函数及扩展函数的方法
2016/10/30 Javascript
BootStrap表单验证实例代码
2017/01/13 Javascript
js中let和var定义变量的区别
2018/02/08 Javascript
简单谈谈javascript高级特性
2019/09/04 Javascript
js实现随机点名功能
2020/12/23 Javascript
[05:41]2014DOTA2西雅图国际邀请赛 小组赛7月10日TOPPLAY
2014/07/10 DOTA
Python基于动态规划算法计算单词距离
2015/07/25 Python
PyQt5响应回车事件的方法
2019/06/25 Python
python turtle库画一个方格和圆实例
2019/06/27 Python
使用python来调用CAN通讯的DLL实现方法
2019/07/03 Python
解决pycharm最左侧Tool Buttons显示不全的问题
2019/12/17 Python
python将logging模块封装成单独模块并实现动态切换Level方式
2020/05/12 Python
基于python检查矩阵计算结果
2020/05/21 Python
Python+Kepler.gl轻松制作酷炫路径动画的实现示例
2020/06/02 Python
python用什么编辑器进行项目开发
2020/06/17 Python
乌克兰香水和化妆品网站:Notino.ua
2018/03/26 全球购物
PHP如何调用MYSQL存储过程
2014/05/30 面试题
《大作家的小老师》教学反思
2014/04/16 职场文书
党员干部廉洁承诺书
2014/05/28 职场文书
省级优秀毕业生主要事迹
2014/05/29 职场文书
有关环保的标语
2014/06/13 职场文书
春游踏青活动方案
2014/08/14 职场文书
党的群众路线教育实践活动批评与自我批评范文
2014/10/16 职场文书
学生旷课检讨书500字
2014/10/28 职场文书
JS Canvas接口和动画效果大全
2021/04/29 Javascript