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 相关文章推荐
网上应用的一个不错common.js脚本
Aug 08 Javascript
javascript奇异的arguments分析
Oct 20 Javascript
js数组操作学习总结
Nov 04 Javascript
jquery采用oop模式class类的使用示例
Jan 22 Javascript
Map.vue基于百度地图组件重构笔记分享
Apr 17 Javascript
Vue 2.0在IE11中打开项目页面空白的问题解决
Jul 16 Javascript
vue实现nav导航栏的方法
Dec 13 Javascript
Javascript中从学习bind到实现bind的过程
Jan 05 Javascript
使用JS获取SessionStorage的值
Jan 12 Javascript
解决mpvue + vuex 开发微信小程序vuex辅助函数mapState、mapGetters不可用问题
Aug 03 Javascript
浅谈从React渲染流程分析Diff算法
Sep 08 Javascript
vue中使用腾讯云Im的示例
Oct 23 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/03/04 星际争霸
聊天室php&mysql(二)
2006/10/09 PHP
Adnroid 微信内置浏览器清除缓存
2016/07/11 PHP
PHP删除字符串中非字母数字字符方法总结
2019/01/20 PHP
php反序列化长度变化尾部字符串逃逸(0CTF-2016-piapiapia)
2020/02/15 PHP
使用JQuery和s3captche实现一个水果名字的验证
2009/08/14 Javascript
javascript addBookmark 加入收藏 多浏览器兼容
2009/08/15 Javascript
关于window.pageYOffset和document.documentElement.scrollTop
2011/04/05 Javascript
图片无缝滚动代码(向左/向下/向上)
2013/04/10 Javascript
JQuery操作iframe父页面与子页面的元素与方法(实例讲解)
2013/11/20 Javascript
Firefox中通过JavaScript复制数据到剪贴板(Copy to Clipboard 跨浏览器版)
2013/11/22 Javascript
javascript获取元素偏移量的方法有哪些
2014/06/24 Javascript
jQuery实现可展开合拢的手风琴面板菜单
2015/09/15 Javascript
jquery遍历table的tr获取td的值实现方法
2016/05/19 Javascript
Bootstrap基本组件学习笔记之下拉菜单(7)
2016/12/07 Javascript
jQuery插件zTree实现更新根节点中第i个节点名称的方法示例
2017/03/08 Javascript
react开发教程之React 组件之间的通信方式
2017/08/12 Javascript
node中的密码安全(加密)
2018/09/17 Javascript
轻松解决JavaScript定时器越走越快的问题
2019/05/13 Javascript
Angular5整合富文本编辑器TinyMCE的方法(汉化+上传)
2020/05/26 Javascript
js仿京东放大镜效果
2020/08/09 Javascript
python支持断点续传的多线程下载示例
2014/01/16 Python
python进程类subprocess的一些操作方法例子
2014/11/22 Python
python实现RSA加密(解密)算法
2016/02/17 Python
Python三种遍历文件目录的方法实例代码
2018/01/19 Python
python中从str中提取元素到list以及将list转换为str的方法
2018/06/26 Python
python实现字符串中字符分类及个数统计
2018/09/28 Python
pycharm激活方法到2099年(激活流程)
2020/09/22 Python
HTML5触摸事件演化tap事件介绍
2016/03/25 HTML / CSS
C#笔试题
2015/07/14 面试题
工艺员岗位职责
2014/02/11 职场文书
学雷锋活动总结范文
2014/04/25 职场文书
班级口号大全
2014/06/09 职场文书
四风问题个人对照检查材料
2014/09/26 职场文书
技术员岗位职责
2015/02/04 职场文书
http通过StreamingHttpResponse完成连续的数据传输长链接方式
2022/02/12 Python