文档章节

javascript对象---3 原型链

奋斗的小芋头
 奋斗的小芋头
发布于 2016/11/26 10:34
字数 1271
阅读 17
收藏 1

一.原型链指针(__prototype__)的特点

1.原型对象(prototype): (本质是一个对象,每一个函数在创建函数时,都是由Function这个对象产生一个原型对象,然后通过指针的方式赋给对象)是函数对象的一个内部属性,值是一个简单的对象,用户可以访问,操作 该对象,可以向原型对象里面添加属性、方法。

2.原型链(__proto__): 每个对象都具备的,不可访问的内部属性(指针)(chorm等浏览器可以访问,但无法操作),指针指向 构造函数 对应的原型对象。(开发人员不能动);每创建一个对象,执行了一次构造函数

,有一个指针指向原型对象。

3.原型链的特点:

原型链的终点是 Object对象 的 prototype 属性,该属性的 __proto__为null ,  所有的链接构成原型链。

原型链是一个从头到尾链接的闭环。

原型链的作用:

使用原型链可以模拟类的功能。

使用原型链可以实现继承关系。

二.原型对象(prototype)的创建:

在预编译或执行匿名函数时,由JS引擎调用 new Function( ) 创建函数对象,以及函数对象的 prototype 对象。只有函数对象才有 prototype 属性。

 

function Fun(){  //函数在JS中也是对象
                 
            }
            //function fun()   以上代码,在预编译阶段相当于下面一句
            var Fun =new Function(); //这句代码就是 function fun()的过程 

 

栈内存中,在预编译阶段已经存在 Object  Function, 首字母大写

Object . toString(); //返回函数定义和函数体

Object : function Object( );  //一个function对象

Function:  function Object( );  //一个function对象

在程序加载前,内存中已经存在

function Object(){

}

function Function(){

}

在预编译阶段相当于定义了两个变量  

var Object = new Function();    //Object是一个特殊的浏览器自己创建的构造函数

var Function = new Function() ;//两个 Function 左侧和右侧的Function相同

在预编译阶段,会加载两个构造函数    Object : 特殊函数,代表对象函数         Function : 函数对象,自省的(自己调用自己创建自己)    var Function = new Function()

下一个问题

1.    var obj = {  //全局变量1 实际值为 object
                name : "ads";
            }

2. var obj =new Object();   obj.name="ads";

1. 和 2. 两个程序是一样的

任何一个对象都有原型链属性,只有函数对象有原型属性.

 

Object.prototype 的原型链 的原型指针指针是最终点。为空,所有对象都可以访问Object.prototype内的方法

Function.prototypre = new Object();

原型链的内部结构,连接方式

prototype 不起到原型链的作用,是指向原型对象的一个指针。__proto__:将原型链连接起来

 

三.原型对象(prototype)的默认属性(不要对prototype直赋值,会覆盖默认属性,导致原型链错误)

function Fun(){  //函数在JS中也是对象
                 
            }
            debgger; 

这里Fun原型对象中有两个属性  Fun.prototype : Object               constructor :function Fun( )         __proto__ : Object
            Fun.prototype = {
                name = 'zhang',
                age:11
            }

因为重新对原型对象赋值,  Fun.prototype : Object    age : 11   name : "张三“  __proto__ : Object  constructor不见了

1. __proto__:prototype对象的原型链。

2.constructor:构造器指针,指向构造函数对象。

四. 修改原型对象的属性:

Fun.prototype.attribute = value; //扩展属性

Fun.prototype.FunName = function(){} ;  // 扩展函数 

修改范例

Fun.prototype.name="zhang";
Fun.prototype.sayhello = function(){
                console.log("hello");
   }

相当于在

Fun.prototype{

name : ”张三“,

sayhello :function

}

 

function Fun(){  //函数在JS中也是对象
                 
 }
        
            Fun.prototype.name="zhang";
            Fun.prototype.sayhello = function(){
                console.log("hello");
            }
            var fun =new Fun();

            var fun1 =new Fun();
            fun.sayhello();  //相当于继承   原型链指针指向构造函数的原型对象

             fun1.sayhello( ) ;也可以  都是继承构造函数的方法,属性

Fun.prototype{   / /fun的原型对象

__proto__ : null  ;

constructor;  //指向他的构造函数,谁创建他指向谁   指向谁  Fun()

}

Fun :new Function{

prototype :

     _proto__ ;

}

constructor不影响原型链,作用,在原型对象(prototype)中可以访问构造函数,只有prototype属性中有constructor,其余对象没有。

扩展原型对象可扩展函数的方法。

五。原型链指针(__prototype__)的特点

1.不可访问性:在IE等浏览器__protoype__属性不可访问。

2.不可操作性,不能修改原型链指针的指向  Fun.__proto__=  //不可以这样写 

3.多元性:所有对象类型,(包括Function)都包含原型链指针。

4.连接性:对象的原型链指针默认指向 构造函数 的prototype对象。但 prototype 对象的 __proto__ 也会作为原型链的一部分,直到连接到Object prototype 对象。object原型对象中__proto__为null

5.通用性:在原型链上所有的 prototype  对象中的属性和函数,对象都可以访问调用。

6.检测上级原型链的方式:

instanceof  例如: Fun instanceof  Function  //true

fun instanceof Fun //true  fun是由Fun创建出的, Fun的原型链在 fun之前(上).

Function instanceof Object //true

Fun.prototype . isPrototypeOf  (fun)  //检测Fun的prototype是否是 fun 原型链上的一环  (此方法来自 Object的prototype 扩展 true,  只能检测 紧接着的两个原型链指针,fun指向 Fun的prototype

 

 

 

 

 

 

 

 

 

 

© 著作权归作者所有

奋斗的小芋头
粉丝 1
博文 161
码字总数 129345
作品 0
大连
私信 提问
JavaScript系列-JavaScript之原型和原型链

一、概述 JavaScript ,是一种面向对象的程序设计语言,但是 JS 本身是没有 “类” 的概念,JS 是靠原型和原型链实现对象属性的“继承”。 在理解原型前,需要先知道实例对象的构造函数是什么...

大灰狼的小绵羊哥哥
02/23
0
0
前端基本功(七):javascript中的继承(原型、原型链、继承的实现方式)

1. js的继承机制 javascirpt没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instance)的区分,全靠一种很奇特的"原型链"(prototype chain)模式,来实现继承。继承意味着复制操作......

大家都叫我四姨
06/18
0
0
简单理解JavaScript原型链

简单三连 什么是原型 ? 我是这样理解的:每一个JavaScript对象在创建的时候就会与之关联另外一个特殊的对象,这个对象就是我们常说的原型对象,每一个对象都会从原型“继承”属性和方法。 什么...

森林小猎人
05/07
0
0
关于javascript的原型和原型链,看我就够了(一)

关于js的原型和原型链,有人觉得这是很头疼的一块知识点,其实不然,它很基础,不信,往下看 要了解原型和原型链,我们得先从对象说起 创建对象 创建对象的三种方式: 对象直接量 通过对象直...

陌上寒
2018/11/03
0
0
《前端面试手记》之JavaScript基础知识梳理(下)

👇 内容速览 👇 实现ES5继承的4种方法 原型和原型链 作用域和作用域链 Event Loop 执行上下文 闭包的理解和分析 🔍查看全部教程 / 阅读原文🔍 ES5继承 题目:ES5中常用继承方法。 方...

godbmw
04/03
0
0

没有更多内容

加载失败,请刷新页面

加载更多

医疗在线客服咨询系统有哪些特点?

随着中国互联网网站的的快速发展,至今医疗行业已经拥有了独立的的运营网站,其中最具特色的便属于医疗在线客服咨询系统,医疗在线客服咨询系统为每个访问网站的患者提供即时的网络在线客服服...

唯喏
今天
10
0
skywalking(容器部署)

skywalking(容器部署) 标签(空格分隔): APM [toc] 1. Elasticsearch SkywalkingElasticsearch 5.X(部分功能报错、拓扑图不显示) Skywalking需要Elasticsearch 6.X docker network create......

JUKE
今天
10
0
解决Unable to find a single main class from the following candidates [xxx,xxx]

一、问题描述 1.1 开发环境配置 pom.xml <plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><!--一定要对上springboot版本号,因......

TeddyIH
今天
7
0
玩转Spring Boot 注册Servlet、Filter、Listener

玩转Spring Boot 注册Servlet、Filter、Listener JAVA架构师Ya七月 2019-08-23 玩转Spring Boot 注册Servlet、Filter、Listener 在Servlet 3.0之前我们都是使用web.xml进行配置,需要增加Ser...

Java架构师ya七
今天
6
0
Dubbo服务限制大数据传输抛Data length too large: 13055248, max payload: 8388608解决方案

当dubbo服务提供者向消费层传输大数据容量数据时,会受到Dubbo的限制,报类似如下异常: 2019-08-23 11:04:31.711 [ DubboServerHandler-XX.XX.XX.XXX:20880-thread-87] - [ ERROR ] [com.al...

huangkejie
今天
12
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部