JavaScript对象原型链原理解析


Posted in Javascript onJanuary 22, 2020

这篇文章主要介绍了JavaScript对象原型链原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

一个js对象,除了自己设置的属性外,还会自动生成proto、class、extensible属性,其中,proto属性指向对象的原型。

对象的属性也有writable、enumerable、configurable、value和get/set的配置方法。

JavaScript对象原型链原理解析

对象的创建方式有三种:

一、使用字面量直接创建。

二、基于原型链创建。

JavaScript对象原型链原理解析

分析上图,要点如下:

1.可以new运算符新建对象,foo为自定义函数,即是对象。

2.可以设置foo.prototype上的属性。

3.变量z在原型链上,为foo.prototype的属性,并非obj的自有属性。

4.原型链为obj->foo.prototype->Object.prototype->null。

JavaScript对象原型链原理解析

分析上图,要点如下:

1.若定义与原型链上同名的变量,则不会覆盖原型链上的变量,而是在对象本身新增副本。

2.delete运算符不会影响原型链上已有的变量,只会删除对象自身的属性。

三、使用Object.create创建。

JavaScript对象原型链原理解析

分析上图,要点如下:

1.Object.create是基于传入的参数产生新的对象,并且入参会成为其原型链上的一部分。

2.Object.create(null)创建的对象直接指向null。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery 插件实现图片延迟加载效果代码
Feb 06 Javascript
javascript模块化是什么及其优缺点介绍
Sep 02 Javascript
12个超实用的JQuery代码片段
Nov 02 Javascript
分享12个非常实用的JavaScript小技巧
May 11 Javascript
EasyUI加载完Html内容样式渲染完成后显示
Jul 25 Javascript
JavaScript基本类型值-Number类型
Feb 24 Javascript
Java与JavaScript中判断两字符串是否相等的区别
Mar 13 Javascript
详解JS中遍历语法的比较
Apr 07 Javascript
JavaScript变量类型以及变量作用域详解
Aug 14 Javascript
React操作真实DOM实现动态吸底部的示例
Oct 23 Javascript
vue实现给div绑定keyup的enter事件
Jul 31 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
Aug 13 Javascript
Node.js学习之内置模块fs用法示例
Jan 22 #Javascript
ES6学习笔记之字符串、数组、对象、函数新增知识点实例分析
Jan 22 #Javascript
ES6学习笔记之let与const用法实例分析
Jan 22 #Javascript
vue中js判断长时间不操作界面自动退出登录(推荐)
Jan 22 #Javascript
Vue设置长时间未操作登录自动到期返回登录页
Jan 22 #Javascript
JavaScript设计模型Iterator实例解析
Jan 22 #Javascript
Vue开发环境跨域访问问题
Jan 22 #Javascript
You might like
php引用计数器进行垃圾收集机制介绍
2012/09/19 PHP
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
PHP的Socket网络编程入门指引
2015/08/11 PHP
thinkPHP5框架auth权限控制类与用法示例
2018/06/12 PHP
Laravel 自带的Auth验证登录方法
2019/09/30 PHP
javascript 限制输入和粘贴(IE,firefox测试通过)
2008/11/14 Javascript
jquery修改网页背景颜色通过css方法实现
2014/06/06 Javascript
一系列Bootstrap导航条使用方法分享
2016/04/29 Javascript
深入理解JavaScript单体内置对象
2016/06/06 Javascript
微信小程序 检查接口状态实例详解
2017/06/23 Javascript
jquery在vue脚手架中的使用方式示例
2017/08/29 jQuery
webpack构建react多页面应用详解
2017/09/15 Javascript
select获取下拉框的值 下拉框默认选中方法
2018/02/28 Javascript
react router4+redux实现路由权限控制的方法
2018/05/03 Javascript
微信小程序实现收藏与取消收藏切换图片功能
2018/08/03 Javascript
使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)
2018/10/23 Javascript
如何在vue里面优雅的解决跨域(路由冲突问题)
2019/01/20 Javascript
JavaScript使用localStorage存储数据
2019/09/25 Javascript
js函数和this用法实例分析
2020/03/13 Javascript
Vue Render函数创建DOM节点代码实例
2020/07/08 Javascript
vue 项目软键盘回车触发搜索事件
2020/09/09 Javascript
[01:14:12]2018DOTA2亚洲邀请赛4.7 总决赛 LGD vs Mineski 第二场
2018/04/09 DOTA
Python Web框架Pylons中使用MongoDB的例子
2013/12/03 Python
python通过pip更新所有已安装的包实现方法
2017/05/19 Python
Django 使用logging打印日志的实例
2018/04/28 Python
python多进程提取处理大量文本的关键词方法
2018/06/05 Python
如何安装2019Pycharm最新版本(详细教程)
2019/09/26 Python
Python连接Oracle之环境配置、实例代码及报错解决方法详解
2020/02/11 Python
Django+RestFramework API接口及接口文档并返回json数据操作
2020/07/12 Python
python 30行代码实现蚂蚁森林自动偷能量
2021/02/08 Python
GUESS西班牙官方网上商城:美国服饰品牌
2017/03/15 全球购物
美国温暖商店:The Warming Store
2018/12/15 全球购物
投资合作协议书范本
2014/04/17 职场文书
一年级班主任工作总结2014
2014/11/08 职场文书
机器人总动员观后感
2015/06/09 职场文书
Python何绘制带有背景色块的折线图
2022/04/23 Python