javascript 对象、属性、原型、原型链、new、constructor

PiscesYE 发布于2019-08-21 11:19 / 2210人阅读

摘要：由于属性是可以变更的，所以未必真的指向对象的构造函数，只是一个提示。不过，从编程习惯上，我们应该尽量让对象的指向其构造函数，以维持这个惯例。

对象

在javascript中经常听到一句话叫做一切事物皆对象。
其实得除null和undefined除外数字也有点特殊看栗子

false.toString();//"false"
[1,2,3].toString();//"1,2,3"

//数字
(1).toString();//"1"
1 .toString();// "1"
1..toString();// "1"
1.toString();//Unexpected token ILLEGAL
//null undefined
null.toString();//Cannot call method "toString" of null
undefined.toString();//Cannot call method "toString" of undefined

数字应该是js引擎解析出错
这里特别注意的是对象也分为普通对象和函数对象，函数对象就是通过new Function创建的对象普通对象就是Object后面讲到原型时会用到。

属性

var text1={};
var text2={name:"xx",age:"3"}
//属性的访问
text2.name//xx
text2[name]//undefined
text2["name"]//xx

对象属性的删除只有delete,去设置它的值为null、和undefined 只是制空方便gc回收属性仍然存在。

var text={name:"xx",age:"3",say:"hello"}
text.name=null;
text.age=undefined;
delete text.say;
text;//{name:null,age:undefined}

原型

概念：每当定义个个对象的时候，对象中会包含一些预定义的属性。其中函数对象的一个属性就叫原型对象prototype。
普通对象是没有prototyoe的，但有__proto__属性。
作用：原型对象就是用来做继承用的。
栗子：

var person=function(name){
    this.name=name;
}
person.prototype.getName=function(){
    return this.name;
}
var xx=new person("我叫xx");
xx.getName();//通过原型的属性继承了getName方法

至于怎么实现的就得说到原型链了。

原型链

概念：JS在创建对象的时候不管是普通对象还是原型对象都有一个叫做__proto__的属性，他用于指向那个创建它的对象的原型prototype。然而创建他的对象也有_proto_这个属性，同样又指向上一层，直到 __proto__这个属性为null为止，这样形成的一条链状就叫原型链。

new

function person(){
}
var p=new person();
alert(p.__proto__===person.prototype);//true

new的作用：

var p={};//声明个空对象

p.__proto__=person.prototype;//把P__proto__的属性指向person的原型

person.call(p);//把this的指针指向p

constructor

概念：constructor这个属性不会影响内部的任何属性。
只是JavaScript语言设计的历史遗留物。由于constructor属性是可以变更的，所以未必真的指向对象的构造函数，只是一个提示。不过，从编程习惯上，我们应该尽量让对象的constructor指向其构造函数，以维持这个惯例。
总结下：说白了一个并没什么太大用的东西！y很不靠谱！很费操作！
理由看栗子1：

//定义构造函数
function person(name){
    this.name=name;
}
//给他原型上添加个方法
person.prototype.say=function(){
    console.log(this.name);
}
//测试下
var p=new person("xx");
alert(p.constructor)

这个栗子没毛病他指向了构造函数。
然后看栗子2：

//定义构造函数
function person(name){
    this.name=name;
}
//给他原型上添加个方法
person.prototype={
    say:function(){
    console.log(this.name)
    }

}
//测试下
var p=new person("xx");
alert(p.constructor)

看吧很不靠谱除非你在去手动的改它的值

hasOwnProperty

来源：它就是通过原型链从Object.prototype那继承过来的。
作用：用来判断一个对象是否包含自定义属性而不是原型链上的属性
上栗子：

Object.prototype.one=1;//先定义一个原型属性one
var text={two:2,three:3};//那么所有的普通对象都继承one
console.log(text.one);//1
"one" in text;//true 他去找原型链上的属性去了
text.hasOwnProperty("one");//false
text.hasOwnProperty("two");//true
text.hasOwnProperty("three");//true

GPU云服务器云服务器原型原型链 js原型属性有什么用原型链 javascript原型

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/86571.html

JavaScript进阶 - 1. 原型和原型链的概念

摘要：对应的关系图如下讲解了构造函数和原型对象之间的关系，那么实例对象和原型对象之间的关系又是怎么样的呢下面讲解。原型对象的指向的是构造函数和本身没有属性，但是其原型对象有该属性，因此也能获取到构造函数。 JavaScript进阶 - 1. 原型和原型链的概念我们好多经常会被问道JavaScript原型和原型链的概念，还有关于继承，new操作符相关的概念。本文就专门整理了原型和原型链的概念...

elisa.yang 2019-08-23 18:33 评论0 收藏0
关于javascript的原型和原型链，看我就够了（二）

摘要：原文链接关于的原型和原型链，看我就够了一参考链接闯关记之原型及原型链之原型与原型链一篇文章带你理解原型和原型链彻底理解原型链一的默认指向图解和的三角关系原型和原型链三张图搞懂的原型对象与原型链温故创建对象的三种方式通过对象直接量通过new创建对象通过Object.create() js中对象分为两种函数对象普通对象仔细观察如下代码 function Foo(na...

eccozhou 2019-08-23 12:44 评论0 收藏0
JavaScript原型与原型链

摘要：每个原型对象都有一个属性指向关联的构造函数为了验证这一说话，举个例子。本文共 1475 字，读完只需 6 分钟一、概述在 JavaScript 中，是一种面向对象的程序设计语言，但是 JS 本身是没有类的概念，JS 是靠原型和原型链实现对象属性的继承。在理解原型前，需要先知道对象的构造函数是什么，构造函数都有什么特点？ 1. 构造函数 // 构造函数 Person() ...

liaosilzu2007 2019-08-23 12:24 评论0 收藏0
深入学习js之——原型和原型链

摘要：我们用一张图表示构造函数和实例原型之间的关系好了构造函数和实例原型之间的关系我们已经梳理清楚了，那我们怎么表示实例与实例原型，也就是或者和之间的关系呢。开篇：在Brendan Eich大神为JavaScript设计面向对象系统的时候，借鉴了Self 和Smalltalk这两门基于原型的语言，之所以选择基于原型的面向对象系统，并不是因为时间匆忙，它设计起来相对简单，而是因为从一开始B...

FingerLiu 2019-08-23 15:25 评论0 收藏0
深入学习js之——原型和原型链

摘要：我们用一张图表示构造函数和实例原型之间的关系好了构造函数和实例原型之间的关系我们已经梳理清楚了，那我们怎么表示实例与实例原型，也就是或者和之间的关系呢。开篇：在Brendan Eich大神为JavaScript设计面向对象系统的时候，借鉴了Self 和Smalltalk这两门基于原型的语言，之所以选择基于原型的面向对象系统，并不是因为时间匆忙，它设计起来相对简单，而是因为从一开始B...

xialong 2019-08-23 15:04 评论0 收藏0