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 播放器 控制
Jan 22 Javascript
Javascript的闭包
Dec 31 Javascript
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
Nov 05 Javascript
javascript中字符串拼接详解
Sep 26 Javascript
整理Javascript流程控制语句学习笔记
Nov 29 Javascript
JS判断输入字符串长度实例代码(汉字算两个字符,字母数字算一个)
Aug 02 Javascript
jQuery.ajax 跨域请求webapi设置headers的解决方案
Aug 08 Javascript
80%应聘者都不及格的JS面试题
Mar 21 Javascript
微信小程序开发之数据存储 参数传递 数据缓存
Apr 13 Javascript
微信小程序实现点击返回顶层的方法
Jul 12 Javascript
VSCode搭建React Native环境
May 07 Javascript
在vue中动态修改css其中一个属性值操作
Dec 07 Vue.js
关于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实现MVC开发得最简单的方法――模型
2007/04/10 PHP
Ajax实时验证用户名/邮箱等是否已经存在的代码打包
2011/12/01 PHP
php mysql 判断update之后是否更新了的方法
2012/01/10 PHP
php常用Output和ptions/Info函数集介绍
2013/06/19 PHP
php获取当前时间的毫秒数的方法
2014/01/26 PHP
PHP实现事件机制实例分析
2015/06/26 PHP
学习php设计模式 php实现单例模式(singleton)
2015/12/07 PHP
php中curl和soap方式请求服务超时问题的解决
2018/06/11 PHP
JavaScript 对象、函数和继承
2009/07/07 Javascript
js中将URL中的参数提取出来作为对象的实现代码
2011/08/16 Javascript
判定是否原生方法的JS代码
2013/11/12 Javascript
jquery插件jTimer(jquery定时器)使用方法
2013/12/23 Javascript
javascript 使用for循环时该注意的问题-附问题总结
2015/08/19 Javascript
常用的Javascript设计模式小结
2015/12/09 Javascript
ECharts仪表盘实例代码(附源码下载)
2016/02/18 Javascript
Angularjs 依赖压缩及自定义过滤器写法
2017/02/04 Javascript
node.js express中app.param的用法详解
2017/07/16 Javascript
浅谈ECMAScript6新特性之let、const
2017/08/02 Javascript
vue.js中父组件调用子组件的内部方法示例
2017/10/22 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
2018/07/06 Javascript
NodeJs生成sitemap站点地图的方法示例
2019/06/11 NodeJs
Angular 中使用 FineReport不显示报表直接打印预览
2019/08/21 Javascript
vue-froala-wysiwyg 富文本编辑器功能
2019/09/19 Javascript
JavaScript数组排序小程序实现解析
2020/01/13 Javascript
vue实现简易计算器功能
2021/01/20 Vue.js
python 判断自定义对象类型
2009/03/21 Python
对于Python的Django框架使用的一些实用建议
2015/04/03 Python
编写Python小程序来统计测试脚本的关键字
2016/03/12 Python
Flask框架Flask-Login用法分析
2018/07/23 Python
Python实现的登录验证系统完整案例【基于搭建的MVC框架】
2019/04/12 Python
python中使用ctypes调用so传参设置遇到的问题及解决方法
2019/06/19 Python
python禁用键鼠与提权代码实例
2019/08/16 Python
Python:type、object、class与内置类型实例
2019/12/25 Python
法拉利英国精品店:Ferraris Boutique UK
2019/07/20 全球购物
国际商务专业学生个人的自我评价
2013/09/28 职场文书
世界名著读书笔记
2015/06/25 职场文书