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 28 Javascript
ExtJS Ext.MessageBox.alert()弹出对话框详解
Apr 02 Javascript
关于锚点跳转及jQuery下相关操作与插件
Oct 01 Javascript
web性能优化之javascript性能调优
Dec 28 Javascript
使用JS 清空File控件的路径值
Jul 08 Javascript
javascript中sort() 方法使用详解
Aug 30 Javascript
你所未知的3种Node.js代码优化方式
Feb 25 Javascript
第一次记录Bootstrap table学习笔记(1)
May 18 Javascript
关于vue v-for循环解决img标签的src动态绑定问题
Sep 18 Javascript
JS解惑之Object中的key是有序的么
May 06 Javascript
一文搞懂ES6中的Map和Set
May 20 Javascript
小程序实现可拖动的悬浮按钮
Sep 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 魔兽争霸
Android App中DrawerLayout抽屉效果的菜单编写实例
2016/03/21 PHP
CodeIgniter记录错误日志的方法全面总结
2016/05/17 PHP
Laravel-admin之修改操作日志的方法
2019/09/30 PHP
Javascript变量函数浅析
2011/09/02 Javascript
jquery如何把参数列严格转换成数组实现思路
2013/04/01 Javascript
如何使用Javascript正则表达式来格式化XML内容
2013/07/04 Javascript
用循环或if语句从json中取数据示例
2014/08/18 Javascript
jQuery的animate函数实现图文切换动画效果
2015/05/03 Javascript
javascript倒计时效果实现
2015/11/12 Javascript
js简单设置与使用cookie的方法
2016/01/22 Javascript
浅谈JavaScript 浏览器对象
2016/06/03 Javascript
使用JS读取XML文件的方法
2016/11/25 Javascript
jquery判断页面网址是否有效的两种方法
2016/12/11 Javascript
Vue.js实现一个漂亮、灵活、可复用的提示组件示例
2017/03/17 Javascript
vue-star评星组件开发实例
2018/03/01 Javascript
Angular使用cli生成自定义文件、组件的方法
2018/09/04 Javascript
nodejs高大上的部署方式(PM2)
2018/09/11 NodeJs
小程序实现单选多选功能
2018/11/04 Javascript
Python 爬虫学习笔记之单线程爬虫
2016/09/21 Python
TensorFlow入门使用 tf.train.Saver()保存模型
2018/04/24 Python
使用Python实现跳一跳自动跳跃功能
2019/07/10 Python
在 Python 中接管键盘中断信号的实现方法
2020/02/04 Python
Win10下安装并使用tensorflow-gpu1.8.0+python3.6全过程分析(显卡MX250+CUDA9.0+cudnn)
2020/02/17 Python
Python读取excel文件中带公式的值的实现
2020/04/17 Python
Python中zip函数如何使用
2020/06/04 Python
python中round函数如何使用
2020/06/19 Python
HTML5中使用postMessage实现两个网页间传递数据
2016/06/22 HTML / CSS
Spartoo瑞典:鞋子、包包和衣服
2018/09/15 全球购物
群众路线个人整改方案
2014/10/25 职场文书
求职意向书范本
2015/05/11 职场文书
患者身份识别制度
2015/08/06 职场文书
MySQL 常见的数据表设计误区汇总
2021/06/07 MySQL
postman中form-data、x-www-form-urlencoded、raw、binary的区别介绍
2022/01/18 HTML / CSS
详解apache编译安装httpd-2.4.54及三种风格的init程序特点和区别
2022/07/15 Servers
Python  序列化反序列化和异常处理的问题小结
2022/12/24 Python