js里一切皆对象。有js自己内部的对象,还有用户自定义的对象。所有的对象都是从原型上衍生出来的。 原型本身也是对象,原型链的最高层就是Object。

两个重要的属性:prototype, __proto__

所有的对象都有__proto__属性,通过.__proto__一层一层,最后到达Object,Object的__Proto__是null,这样就形成了一个链,叫做原型链

prototype这个属性很特殊,只有指定的几个对象有prototype属性。常见的有:

  • Object.prototype
  • Number.prototype
  • Boolean.prototype
  • String.prototype
  • Function.prototype
  • 自定议函数名.prototype

用户自定义变量的查找顺序是按原生链从底往上查,如果查到Object.prototyp还是没有的话就返回undefined

以下是别人整理的原型链,我是看着有点晕,自己画了一个。

原型上的某个属性改变值的话,会直接影响到所有实例化出的对象的之一属性。var P = function(){}

P.prototype.a=1;
var man = new P();
console.log(man.a); //1
//只是给prototype的某个属性赋值的话,所有实例化的对象的对应的这个属性都会改变
//或者给prototype扩展添加了个新属性,所有实例化的对象也就具备 了这个属性,这就解释了原型链的查找。
P.prototype.a =2;
console.log(man.a); //2
//重新给prototype赋值后,之后所实例化出的对象就以新的原型为原型,之前的对象还是以之前的原型为原型,不具备新原型的属性。
P.prototype={t:2};
console.log(man.a); //2
console.log(man.t); //undefined
var woman = new P();
console.log(woman .a); //undefined
console.log(woman .t); //2

注意下边,obj2.a.b=0导致obj1.a.b也变成了0。是因为obj2.a访问的是obj1的引用,即obj2.a===obj1.a为true,所以b属性是同一个。  

var obj1={a:{b:5}};
var obj2= Object.create(obj1);
obj2.a.b=0;
console.log(obj1.a.b)//0

删除属性或方法 delete man.name

只能删除自己的属性,不能删除上级原生链里的属性。

与原生相关的方法:hasOwnProperty ,isPrototypeOf,getPrototypeOf

var a={b:1}
var b = Object.create(a)
a.isPrototypeOf(b) //true
a.hasOwnProperty("b") //true
b.hasOwnProperty("b") //true
Object.getPrototypeOf(b) === a //true

js实现继承。 js的继承其实就是把父亲的原型链拿给孩子当原型链用。下面创建个C,这样就避免了在不知道Super这个function内部做了什么处理,是不是还要传参的情况下,直接new Super的时候,可能会抛出异常。C的原型就是Super的原型,这样直接new C()得到的对象的原型就是Super.prototype.一般prototype还有一个constructor属性,给这个属性赋值为Child这个function。

因为这个是模拟的继承,所以Cat 里还需要显示的调用一下Animal的构造函数来取得Animal构造函数里的属性,所以我们给Child添加了一个属性为superClass,存放Super的原型。如下,在Cat的构造函数里直接使用 Cat.superClass.constructor.call(this,name)就调到了Animal的构造方法。如果不需要用Animal构造方法里的属性,可以不写这行代码。

  

refer:

https://juejin.im/post/5c72a1766fb9a049ea3993e6

https://juejin.im/post/5c4fdbae6fb9a049b07dc084

构造函数

构造函数有别于普通函数的点就是用new去使用它。

var P = function(){
this.name="";
this.showInfo= function(){
console.log(this.name);
}
}

 如果不用new,直接用P()话,this指的是 Window。用new时,this指的是新建的对象 。

所有从P实例化的对象都具有name和showInfo这两属性。

js的原型/原型链/构造函数的更多相关文章

  1. Js笔记(对象,构造函数,原型,原型链,继承)及一些不熟悉的语法

    对象的特性: 1.唯一标识性,即使完全不一样的对象,内存地址也不同,所以他们不相等 2.对象具有状态,同一个对象可能处在不同状态下 3.对象具有行为,即对象的状态可能因为他的行为产生变迁 Js直到es ...

  2. Js中的对象、构造函数、原型、原型链及继承

    1.对象 在传统的面向过程的程序设计中,会造成函数或变量的冗余.而JS中对象的目的是将所有的具有相同属性或行为的代码整合到一起,形成一个集合,这样就会方便我们管理,例如: var person1={  ...

  3. js基础篇——原型与原型链的详细理解

    js中的对象分为两种:普通对象object和函数对象function. function fn1(){}; var fn2 = function(){}; var fn3 = new Function ...

  4. JS面向对象之原型链

      对象的原型链 只要是对象就有原型 原型也是对象 只要是对象就有原型, 并且原型也是对象, 因此只要定义了一个对象, 那么就可以找到他的原型, 如此反复, 就可以构成一个对象的序列, 这个结构就被成 ...

  5. JS原型--原型链

    构造函数-->原型--->prototype-->__proto__-->constructor-->原型链 构造函数    什么是构造函数?我理解构造函数就是可以用来生 ...

  6. 深入理解JS对象和原型链

    函数在整个js中是最复杂也是最重要的知识 一个函数中存在多面性: 1.它本身就是一个普通的函数,执行的时候形成的私有作用域(闭包),形参赋值,预解释,代码执行,执行完 成后栈内存销毁/不销毁. 2.& ...

  7. js中的原型以及原型链

    在js中原型是每个构造函数的属性: 这个算 js 核心概念的一部分 var f1 = new Foo(); 对象 f1 的构造函数就是 Foo , f1的原型 __proto__ 就指向构造函数 Fo ...

  8. js中原型和原型链

    1.原型: 在JavaScript 中,对象被表现为prototype . 原型其实一直存在于我们接触过的任何一个对象. 2. Tip:在函数对象中也存在__proto__属性,但是查看函数对象的原型 ...

  9. js中的原型,原型链和继承

    在传统的基于Class的语言如Java.C++中,继承的本质是扩展一个已有的Class,并生成新的Subclass. 由于这类语言严格区分类和实例,继承实际上是类型的扩展.但是,JavaScript最 ...

  10. JS中的原型链和原型的认识

    这篇文章主要是学习一下JavaScript中的难点------原型和原型链 自定义一个对象 我们学习一门编程语言,必然要使用它完成一些特定的功能,而面向对象的语言因为符合人类的认知规律,在这方面做得很 ...

随机推荐

  1. Kendo DropDownListFor值传不回去的小坑

    做项目时,在KendoWindow弹框里面写了个表单提交,不小心把AreaId  下拉框设置了Name为“OrderAreaId”.在后台接收不到AreaId的参数.后来才发现是Name的设置强行把A ...

  2. OpenStack-Neutron-Fwaas-代码【一】

    Kilo的代码中对Fwaas做了优化,可以将规则应用到单个路由上 但是juno里面还是应用到租户的所有路由上的,因此对juno的代码做了修改 1. 介绍 在FWaaS中,一个租户可以创建多个防火墙,而 ...

  3. ABP 2.0.2 升到 2.2.1

    1.选择解决方案 右键 管理 nuget 更新 输入abp 这里只升级 abp的包 点升级 2.update-database  可能需要你添加个迁移(这一步可能不需要) 3.Core 项目下面的Au ...

  4. Can't find msguniq. Make sure you have GNU gettext tools 0.15 or newer installed

    Python Django生成国际化和本地化.po文件步骤1.在settings文件中,添加一下内容: LANGUAGES = ( ('zh-hans', ugettext_lazy('Simplif ...

  5. python,day3,函数基础-3

    本节内容 1. 函数基本语法及特性 2. 参数与局部变量 3. 返回值 嵌套函数 4.递归 5.匿名函数 6.函数式编程介绍 7.高阶函数 8.内置函数 1.函数基本语法及特性 函数是什么? 函数一词 ...

  6. mysql查看所有触发器以及存储过程等操作集合

    今天在做每个月定时扣费的功能 用到了Mysql的Event Scheduler 昨完之后发现一个问题 Event Scheduler 默认是不开启的 要在mysql内执行SET GLOBAL even ...

  7. kubernetes pod infra container网络原理

    刚开始接触kubernetes时,对kubelet的--pod-infra-container-image参数非常不能理解,不理解为什么我的业务应用需要依赖一个第三方的容器: 上文入门级kuberne ...

  8. react中对于key值的理解

    1.key是用来帮助react识别哪些内容被更改.添加或者删除.key需要写在用数组渲染出来的元素内部,并且需要赋予其一个稳定的值.如果key值发生了变更,react则会触发UI的重渲染. 2.在相邻 ...

  9. day12函数,三元表达式 ,列表推导式 ,字典推导式,函数对象,名称空间与作用域,函数的嵌套定义

    复习 # 字符串的比较 # -- 按照从左往右比较每一个字符,通过字符对应的ascii进行比较 # 函数的参数 # 1)实参与形参: # -- 形参:在函数定义时()中出现的参数 # -- 实参:在函 ...

  10. allure --version 异常io.airlift.airline.ParseArgumentsUnexpectedException: Found unexpected parameter

    执行allure --version时,有时会出现如下异常: io.airlift.airline.ParseArgumentsUnexpectedException: Found unexpecte ...