JavaScript对象原型链原理详解


Posted in Javascript onFebruary 05, 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 相关文章推荐
javascript数组使用调用方法汇总
Dec 08 Javascript
javascript 面向对象编程  function是方法(函数)
Sep 17 Javascript
判断某个字符在一个字符串中是否存在的js代码
Feb 28 Javascript
javascript制作幻灯片(360度全景图片)
Jul 28 Javascript
DIV随滚动条滚动而滚动的实现代码【推荐】
Apr 12 Javascript
深入理解jQuery中的事件冒泡
May 24 Javascript
Javascript动画效果(4)
Oct 11 Javascript
JavaScript中return用法示例
Nov 29 Javascript
微信小程序 自定义消息提示框
Aug 06 Javascript
vue组件与复用详解
Apr 08 Javascript
jQuery实现获取选中复选框的值实例详解
Jun 28 jQuery
layui之table checkbox初始化时选中对应选项的方法
Sep 02 Javascript
基于Vue的侧边目录组件的实现
Feb 05 #Javascript
Js视频播放器插件Video.js使用方法详解
Feb 04 #Javascript
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 #jQuery
JS代码优化的8点建议
Feb 04 #Javascript
9种方法优化jQuery代码详解
Feb 04 #jQuery
JS代码检查工具ESLint介绍与使用方法
Feb 04 #Javascript
使用typescript改造koa开发框架的实现
Feb 04 #Javascript
You might like
php下检测字符串是否是utf8编码的代码
2008/06/28 PHP
PHP 验证登陆类分享
2015/03/13 PHP
详解PHP编码转换函数应用技巧
2016/10/22 PHP
PHP大文件分割上传 PHP分片上传
2017/08/28 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
ThinkPHP框架使用redirect实现页面重定向的方法实例分析
2018/04/12 PHP
js中cookie的使用详细分析
2008/05/28 Javascript
HTML Dom与Css控制方法
2010/10/25 Javascript
JavaScript中valueOf函数与toString方法深入理解
2012/12/02 Javascript
jQuery Deferred和Promise创建响应式应用程序详细介绍
2013/03/05 Javascript
使用javascipt---实现二分查找法
2013/04/10 Javascript
js 左右悬浮对联广告特效代码
2014/12/12 Javascript
Vue.js基础知识汇总
2016/04/27 Javascript
javascript this详细介绍
2016/09/19 Javascript
jQuery中页面返回顶部的方法总结
2016/12/30 Javascript
Bootstrap进度条与AJAX后端数据传递结合使用实例详解
2017/04/23 Javascript
ionic App问题总结系列之ionic点击系统返回键退出App
2017/08/19 Javascript
node.js 用socket实现聊天的示例代码
2017/10/17 Javascript
使用express搭建一个简单的查询服务器的方法
2018/02/09 Javascript
基于JS+HTML实现弹窗提示是否确认提交功能
2020/06/17 Javascript
python抓取网页时字符集转换问题处理方案分享
2014/06/19 Python
python创建列表并给列表赋初始值的方法
2015/07/28 Python
python爬虫框架scrapy实现模拟登录操作示例
2018/08/02 Python
pyqt弹出新对话框,以及关闭对话框获取数据的实例
2019/06/18 Python
python 中的9个实用技巧,助你提高开发效率
2020/08/30 Python
python中pdb模块实例用法
2021/01/15 Python
Gucci法国官方网站:意大利奢侈品牌
2018/07/25 全球购物
贝佳斯官方网站:Borghese
2020/05/08 全球购物
软件工程师岗位职责
2013/11/16 职场文书
法务专员岗位职责
2014/01/02 职场文书
检察机关个人对照检查材料
2014/09/15 职场文书
党员三严三实对照检查材料
2014/10/13 职场文书
2014年物业管理工作总结
2014/11/21 职场文书
导游词之介休绵山
2019/12/31 职场文书
html form表单基础入门案例讲解
2021/07/15 HTML / CSS
winserver2019安装软件一直卡在应用程序正在为首次使用做准备
2022/06/10 Servers