JavaScript中in和hasOwnProperty区别详解


Posted in Javascript onAugust 04, 2017

 每当代码读取某个对象的某个属性时,都会执行一次搜索,目标是具有给定名字的属性。搜索首先从对象实例本身开始。如果在实例中找到了具有给定名字的属性,则返回该属性的值;如果没有找到,则继续搜索指针指向的原型对象,在原型对象中查找具有给定名字的属性。如果在原型对象中找到了这个属性,则返回该属性的值。

虽然可以通过对象实例访问保存在原型中的值,但却不能通过对象实例重写原型中的值。如果在实例中添加一个与原型中属性同名的属性,则该属性会屏蔽原型中的那个属性。添加的同名属性只会阻止我们访问原型中的那个属性,但不会修改那个属性。即使将这个属性设置为null,也只会在实例中设置这个属性,而不会恢复其指向原型的链接。

in操作符只要通过对象能访问到属性就返回true。hasOwnProperty()只在属性存在于实例中时才返回true。

使用delete操作符则可以完全删除实例属性,从而让我们能巩固重新访问原型中的属性。

function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
  alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
alert(person1.hasOwnProperty("name"));//false
alert("name" in person1);//true
person1.name = "Greg";
alert(person1.name);//"Greg"
alert(person1.hasOwnProperty("name"));//true
alert("name" in person1);//true
delete person1.name;
alert(person1.name);//"Nicholas"
alert(person1.hasOwnProperty("name"));//false
alert("name" in person1);//true

prototype

1.每个函数都有一个 prototype 的对象属性,对象内有一个 constructor 属性,默认指向函数本身

2.每个对象都有一个 __proto__ 的属性,属相指向其父类型的 prototype

构造函数和普通函数并没有区别,使用 new 关键字调用就是构造函数,使用构造函数可以 实例化 一个对象

函数的返回值有两种可能

1.显式调用 return 返回 return 后表达式的求值

2.没有调用 return 返回 undefined

function People(name, age) {
 this.name = name;
 this.age = age;
}
var people = new People('Byron', 26);

构造函数返回值

1.没有返回值
2.简单数据类型
3.对象类型

前两种情况构造函数返回构造对象的实例,实例化对象正是利用的这个特性

第三种构造函数和普通函数表现一致,返回 return 后表达式的结果

总结

以上所述是小编给大家介绍的JavaScript中in和hasOwnProperty区别,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
“不能执行已释放的Script代码”错误的原因及解决办法
Sep 09 Javascript
javascript脚本调试方法小结
Nov 24 Javascript
浅析XMLHttpRequest的缓存问题
Dec 13 Javascript
jQuery拖拽 & 弹出层 介绍与示例
Dec 27 Javascript
Javascript自定义函数判断网站访问类型是PC还是移动终端
Jan 10 Javascript
ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)
Sep 06 Javascript
JS中判断null的方法分析
Nov 21 Javascript
关于微信上网页图片点击全屏放大效果
Dec 19 Javascript
对于js垃圾回收机制的理解
Sep 14 Javascript
详解如何在微信小程序开发中正确的使用vant ui组件
Sep 13 Javascript
微信小程序中使用Async-await方法异步请求变为同步请求方法
Mar 28 Javascript
Javascript作用域和作用域链原理解析
Mar 03 Javascript
JavaScript hasOwnProperty() 函数实例详解
Aug 04 #Javascript
微信小程序 websocket 实现SpringMVC+Spring+Mybatis
Aug 04 #Javascript
Angular实现响应式表单
Aug 04 #Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 #Javascript
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 #jQuery
JavaScript正则表达式校验与递归函数实际应用实例解析
Aug 04 #Javascript
js模拟百度模糊搜索的实例
Aug 04 #Javascript
You might like
ZF等常用php框架中存在的问题
2008/01/10 PHP
Cygwin中安装PHP方法步骤
2015/07/04 PHP
ThinkPHP控制器详解
2015/07/27 PHP
总结的一些PHP开发中的tips(必看篇)
2017/03/24 PHP
Laravel5框架添加自定义辅助函数的方法
2018/08/01 PHP
Laravel5.4框架中视图共享数据的方法详解
2019/09/05 PHP
php设计模式之组合模式实例详解【星际争霸游戏案例】
2020/03/27 PHP
Js动态创建div
2008/09/25 Javascript
extjs form textfield的隐藏方法
2008/12/29 Javascript
JavaScript 放大镜 放大倍率和视窗尺寸
2011/05/09 Javascript
通过JavaScript控制字体大小的代码
2011/10/04 Javascript
Package.js  现代化的JavaScript项目make工具
2012/05/23 Javascript
Jquery实现自定义窗口随意的拖拽
2014/03/12 Javascript
jquery删除数据记录时的弹出提示效果
2014/05/06 Javascript
js使用for循环查询数组中是否存在某个值
2014/08/12 Javascript
jQuery点击按钮弹出遮罩层且内容居中特效
2015/12/14 Javascript
javascript 中的事件委托详解
2016/10/25 Javascript
JS数组去重(4种方法)
2017/03/27 Javascript
详解webpack es6 to es5支持配置
2017/05/04 Javascript
Vue代码分割懒加载的实现方法
2017/11/23 Javascript
react-navigation 如何判断用户是否登录跳转到登录页的方法
2017/12/01 Javascript
关于HTTP传输中gzip压缩的秘密探索分析
2018/01/12 Javascript
JavaScript代码调试方法实例小结
2019/01/05 Javascript
nodejs实现用户登录路由功能
2019/05/22 NodeJs
Bootstrap实现省市区三级联动(亲测可用)
2019/07/26 Javascript
Python中的面向对象编程详解(上)
2015/04/13 Python
Python实现监控程序执行时间并将其写入日志的方法
2015/06/30 Python
python监控进程脚本
2018/04/12 Python
获取Pytorch中间某一层权重或者特征的例子
2019/08/17 Python
Html5在手机端调用相机的方法实现
2020/05/13 HTML / CSS
金融专业大学生职业生涯规划范文
2014/01/16 职场文书
行政工作个人的自我评价
2014/02/13 职场文书
法人代表授权委托书
2014/04/08 职场文书
中学生学雷锋演讲稿
2014/04/26 职场文书
大学社团活动总结怎么写
2019/06/21 职场文书
Django开发RESTful API实现增删改查(入门级)
2021/05/10 Python