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 相关文章推荐
表格 隔行换色升级版
Nov 07 Javascript
brook javascript框架介绍
Oct 10 Javascript
javascript jscroll模拟html元素滚动条
Dec 18 Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
Apr 09 Javascript
javascript-表格排序(降序/反序)实现介绍(附图)
May 30 Javascript
window.open打开页面居中显示的示例代码
Dec 27 Javascript
jquery的live使用注意事项
Feb 18 Javascript
JavaScript阻止回车提交表单的方法
Dec 30 Javascript
JavaScript设计模式经典之工厂模式
Feb 24 Javascript
canvas滤镜效果实现代码
Feb 06 Javascript
javascript cookie的基本操作(添加和删除)
Jul 24 Javascript
js实现点击展开隐藏效果(实例代码)
Sep 28 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获取用户IPv4或IPv6地址的代码
2012/11/15 PHP
模板引擎smarty工作原理以及使用示例
2014/05/25 PHP
php 伪造ip以及url来路信息方法汇总
2014/11/25 PHP
php有效防止同一用户多次登录
2015/11/19 PHP
HTML中嵌入PHP的简单方法
2016/02/16 PHP
php单链表实现代码分享
2016/07/04 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
PHP基于ip2long实现IP转换整形
2020/12/11 PHP
jquery trim() 功能源代码
2011/02/14 Javascript
固定网页背景图同时保持图片比例的思路代码
2013/08/15 Javascript
iframe子页面获取父页面元素的方法
2013/11/05 Javascript
JavaScript中的字符串操作详解
2013/11/12 Javascript
JavaScript之AOP编程实例
2015/07/17 Javascript
jquery zTree异步加载简单实例讲解
2016/02/25 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
javascript数组去重常用方法实例分析
2017/04/11 Javascript
一篇文章,教你学会Vue CLI 插件开发
2019/04/17 Javascript
vue2.0 实现富文本编辑器功能
2019/05/26 Javascript
JS面试题中深拷贝的实现讲解
2020/05/07 Javascript
[02:36]DOTA2上海特锦赛 回忆电竞生涯的重要瞬间
2016/03/25 DOTA
Python实现对excel文件列表值进行统计的方法
2015/07/25 Python
分享Python开发中要注意的十个小贴士
2016/08/30 Python
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
python实现微信定时每天和女友发送消息
2019/04/29 Python
对Django中内置的User模型实例详解
2019/08/16 Python
Python读取多列数据以及用matplotlib制作图表方法实例
2020/09/23 Python
Python 调用 ES、Solr、Phoenix的示例代码
2020/11/23 Python
Timex手表官网:美国运动休闲手表品牌
2017/01/28 全球购物
First Aid Beauty官网:FAB急救面霜
2018/05/24 全球购物
Roxy荷兰官方网站:冲浪、滑雪板、服装和配件
2019/10/22 全球购物
核心价值观演讲稿
2014/05/13 职场文书
我的中国梦口号
2014/06/16 职场文书
婚前协议书标准版
2014/10/19 职场文书
辞职书格式样本
2015/02/26 职场文书
SpringBoot中获取profile的方法详解
2022/04/08 Java/Android
SQLyog的下载、安装、破解、配置教程(MySQL可视化工具安装)
2022/09/23 MySQL