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 相关文章推荐
syntaxhighlighter 使用方法
Jul 02 Javascript
JavaScript 一行代码,轻松搞定浮动快捷留言-V2升级版
Apr 02 Javascript
JavaScript 判断浏览器是否支持SVG的代码
Mar 21 Javascript
jQuery之字体大小的设置方法
Feb 27 Javascript
使用jquery实现仿百度自动补全特效
Jul 23 Javascript
Node.js的Express框架使用上手指南
Mar 12 Javascript
javascript容错处理代码(屏蔽js错误)
Jan 20 Javascript
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
JavaScript运行原理分析
Feb 09 Javascript
JS实现的文字间歇循环滚动效果完整示例
Feb 13 Javascript
Angular CLI在Angular项目中如何使用scss详解
Apr 10 Javascript
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 jQuery
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
PHP中查询SQL Server或Sybase时TEXT字段被截断的解决方法
2009/03/10 PHP
PHP 递归效率分析
2009/11/24 PHP
php错误、异常处理机制(补充)
2012/05/07 PHP
php class类的用法详细总结
2013/10/17 PHP
php操作mysql数据库的基本类代码
2014/02/25 PHP
JQuyer $.post 与 $.ajax 访问WCF ajax service 时的问题需要注意的地方
2011/09/20 Javascript
提高javascript效率 一次判断,而不要次次判断
2012/03/30 Javascript
判断输入是否为空,获得输入类型的JS代码
2013/10/30 Javascript
JavaScript移除数组内重复元素的方法
2015/03/18 Javascript
JavaScript实现弹出广告功能
2017/03/30 Javascript
Vue组件tree实现树形菜单
2017/04/13 Javascript
webpack3+React 的配置全解
2017/08/21 Javascript
BACKBONE.JS 简单入门范例
2017/10/17 Javascript
微信小程序授权登录及解密unionId出错的方法
2018/09/26 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
vue实现节点增删改功能
2019/09/26 Javascript
如何通过javaScript去除字符串两端的空白字符
2020/02/06 Javascript
Python模块WSGI使用详解
2018/02/02 Python
每天迁移MySQL历史数据到历史库Python脚本
2018/04/13 Python
python 字符串和整数的转换方法
2018/06/25 Python
Python os.rename() 重命名目录和文件的示例
2018/10/25 Python
在Pycharm中项目解释器与环境变量的设置方法
2018/10/29 Python
python实现对指定字符串补足固定长度倍数截断输出的方法
2018/11/15 Python
简单瞅瞅Python vars()内置函数的实现
2019/09/27 Python
python实现计算器功能
2019/10/31 Python
关于numpy数组轴的使用详解
2019/12/05 Python
详解基于python的图像Gabor变换及特征提取
2020/10/26 Python
世界第一曲奇连锁店:Mrs. Fields Cookies
2017/02/04 全球购物
西班牙灯具网上商店:Lampara.es
2018/06/05 全球购物
商务英语大学生职业生涯规划书范文
2014/01/01 职场文书
小学六年级学生评语
2014/04/22 职场文书
俞敏洪北大演讲稿
2014/05/22 职场文书
体育系毕业生自荐信
2014/06/28 职场文书
2014年六五普法工作总结
2014/11/25 职场文书
婚育证明格式
2015/06/17 职场文书
高中班主任心得体会
2016/01/07 职场文书