javascript中in和hasOwnProperty区别

最新推荐文章于 2023-05-05 17:10:30 发布

转载最新推荐文章于 2023-05-05 17:10:30 发布 · 766 阅读

本文探讨了JavaScript中的原型链工作原理，包括如何使用in操作符和hasOwnProperty()方法来检查属性的存在，以及delete操作符的作用。并通过一个Person构造函数示例展示了这些概念的实际应用。

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

每个函数都有一个 prototype 的对象属性，对象内有一个 constructor 属性，默认指向函数本身
每个对象都有一个 __proto__ 的属性，属相指向其父类型的 prototype

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

函数的返回值有两种可能

显式调用 return 返回 return 后表达式的求值
没有调用 return 返回 undefined

function People(name, age) {
  this.name = name;
  this.age = age;
}

var people = new People('Byron', 26);

构造函数返回值

没有返回值
简单数据类型
对象类型

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

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