JS中ptototype和__proto__的关系

学到原型的时候感觉头都大了/(ㄒoㄒ)/~~ 尤其是ptototype和__proto__ 傻傻分不清  通过多番查找资料,根据自己的理解,总结如下:

一、构造函数:

构造函数:通过new关键字可以用来创建特定类型的对象的函数。比如像Object和Array,两者属于内置的原生的构造函数,在运行时会自动的出现在执行环境中,可以直接使用。如下:

var arr = new Array();//使用Array构造函数创建了一个array实例arr
arr[0]="a";
arr[1]="b";
alert(arr);//a,bvar obj=new Object();//使用Object构造函数创建了一个Object实例obj
obj.name="c";
obj.age=12;
alert(obj.name);//c

我们可以自定义的创建构造函数,并为其自定义属性和方法,如:

//创建构造函数Person
function Person(name,age){this.name=name;this.age=age;this.sayName=function(){alert(this.name)//
    };
}//使用new关键字,来生成Person实例
var person1=new Person("Tom",22);
var person2=new Person("Jerry",21);
person1.sayName();//Tom
person2.sayName();//Jerry

注意以下几点:

  • 构造函数的名字始终要以大写字母开头(主要是为了区别于非构造函数,也即是区别于普通函数)
  • 构造函数也就是函数,定义构造函数和定义普通函数的语法一样。构造函数和普通函数的区别在于:使用他们的方式不同。任何函数只要使用new操作符来调用,那他就可以作为构造函数;不使用new操作符来调用就是普通函数
function Person(name,age){this.name=name;this.age=age;this.sayName=function(){alert(this.name)//
    };
}//当做构造函数使用
var person=new Person("Tom",22);
person.sayName();//Tom    
//当做普通函数使用
Person("Jerry",30);//添加到window
sayName();//Jerry  等同于window.sayName();

二、原型对象:

每个函数都有一个prototype属性,它是一个指向原型对象的指针,原型对象在定义函数时同时被创建,原型对象的用途是包含所有实例共享的属性和方法

function Person(){
}
//自定义原型对象的属性和方法
Person.prototype.name="Tom";
Person.prototype.age=25;
Person.prototype.sayName=function(){alert(this.name);
};
//原型对象中的所有属性和方法 都会自动被所有实例所共享
var person1=new Person();
var person2=new Person();
person1.sayName();//Tom
person2.sayName();//Tom

只要创建了一个新函数,每个函数在创建之后都会获得一个prototype的属性,这个属性指向函数的原型对象(原型对象在定义函数时同时被创建),此原型对象又有一个名为“constructor”的属性,反过来指向函数本身,达到一种循环指向,

如在上边的例子中:alert(Person.prototype.constructor===Person);//会返回true

function Person(){}
alert(Person.prototype.constructor===Person);//true

三、__proto__(注意这里proto左右两边都有两个"_")

当调用构造函数创建一个新实例后,该实例的内部将包含一个指针[[Prototype]],该指针指向创建它的构造函数的原型,在脚本上没有标准的方法来访问[[Prototype]],但大多数浏览器都支持通过__proto__来访问。

function Person(){
}
//自定义原型对象的属性和方法
Person.prototype.name="Tom";
Person.prototype.age=25;
Person.prototype.sayName=function(){alert(this.name);
};
//原型对象中的所有属性和方法 都会自动被所有实例所共享
var person1=new Person();
var person2=new Person();
person1.sayName();//Tom
person2.sayName();//Tom
alert(person1.__proto__===Person.prototype);//true

以上述的示例代码为例,各个对象之间的关系如下图所示:

 

总结:

①只要创建了一个函数,该函数的原型对象也随之同时被创建出来,原型对象中的属性和方法被经由其相对应的构造函数所创建的实例所共享

②每个函数在创建之后都会获得一个prototype的属性,这个属性指向该函数的原型对象

③每个实例对象的__proto__属性都指向其构造函数的原型

 


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/364129.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[最短路]飞行

题目描述 WFYZ的校园很大,这里生活着很多生物,比如住在钟楼上的的鸽子,其中鸽子冉冉和她的妹妹凝凝白天在不同的地方吃虫,而在晚上她们都回到钟楼休息。她俩是两只懒鸟,于是提出了一个计划,尽量减少她们在飞…

Java状态和策略设计模式之间的差异

为了在Core Java应用程序中正确使用状态和策略设计模式,对于Java开发人员清楚地了解它们之间的区别很重要。 尽管状态和策略设计模式的结构相似,并且都基于开放式封闭设计原则,从SOLID设计原则表示为“ O”,但它们在意图上完全不同…

廖雪峰Java3异常处理-1错误处理-2捕获异常

1捕获异常 1.1 finally语句保证有无错误都会执行 try{...}catch (){...}finally{...} 使用try...catch捕获异常可能发生异常的语句放在try{...}中使用catch捕获对应的Exception及其子类1.2 捕获多个异常 try{...} catch() {...} catch(){...}finally{..} 使用多个catch子句&…

更新数据库

方法一:在对SQL数据库进行更新时,用CommandBuilder对像来自动构建sql命令,来起到更新的作用;这种方法用起来比较方便,具体代码如下: 以下代码都在xp系统下测试通过 环境:vs.net2005 \ sql server 2000\xpus…

在崩溃或断电后测试Lucene的索引耐久性

Lucene有用的事务功能之一是索引持久性 ,它可以确保一旦成功调用IndexWriter.commit ,即使操作系统或JVM崩溃或断电,或者您杀死-KILL JVM进程,重启后索引也将保持完整(未损坏),并将反映崩溃前的…

Jmeter、postman、python 三大主流技术如何操作数据库?

1、前言 只要是做测试工作的,必然会接触到数据库,数据库在工作中的主要应用场景包括但不限于以下: 功能测试中,涉及数据展示功能,需查库校验数据正确及完整性;例如商品搜索功能 自动化测试或性能测试中&a…

利用ASP.NET向服务器上传文件[转]

文件上传技术是一个很实用的技术,有着很广泛的应用,在ASP.NET自身的前一个版本ASP里实现这个功能,就必须使用第三方的组件或者自己开发组件了,现在,用ASP.NET实现起来就简单得多了,我们不需要使用任何组件就…

java中HashMap详解

HashMap 和 HashSet 是 Java Collection Framework 的两个重要成员,其中 HashMap 是 Map 接口的常用实现类,HashSet 是 Set 接口的常用实现类。虽然 HashMap 和 HashSet 实现的接口规范不同,但它们底层的 Hash 存储机制完全一样,甚…

java代码编写的文本特征提取_Test1 java语言写的特征提取源代码,有搞文字识别的可以下载一看,简单易学 Develop 274万源代码下载- www.pudn.com...

文件名称: Test1下载 收藏√ [5 4 3 2 1 ]开发工具: Java文件大小: 35 KB上传时间: 2015-03-02下载次数: 46提 供 者: 常杰详细说明:java语言写的特征提取源代码,有搞文字识别的可以下载一看,简单易学-Feature extraction of the Java …

c# HashTable (哈希表)

HashTable 哈希表 也是System.Collections集合下的数据结构类 它储存的也是Object类型的对象 但是它在内存中是散列排布的 因为这个特性,非常适合存储大量的数据 在HashTable中一个键只能对应一个值,一个值可以对应多个键(多对一)…

Spring集成–配置Web服务客户端超时

介绍 在Spring Integration的支持下,您的应用程序可以使用出站Web服务网关来调用Web服务。 调用由该网关处理,因此您只需要担心构建请求消息和处理响应。 但是,使用这种方法并不明显,如何配置其他选项,例如设置超时或操…

将txt文件和excel文件导入SQL2000数据库

在做一些web数据库管理系统的时候经常要实现将帐户批量注册的功能,今天就来讲讲如何在C#-web项目中将txt文件和excel文件导入SQL2000数据库。1.数据库准备在SQL2000数据库的实例数据库pubs中建立一个数据表txtInsert,字段很简单:id&#xff0…

Java 8 Friday:Java 8将彻底改变数据库访问

在Data Geekery ,我们喜欢Java。 而且,由于我们真的很喜欢jOOQ的流畅的API和查询DSL ,我们对Java 8将为我们的生态系统带来什么感到非常兴奋。 对于Java 8系列 ,我们很荣幸主持Iu Ming-Yee Iu博士发表的非常相关的嘉宾帖子。 Iu …

Linux文件权限管理

权限管理 1、权限解读 权限:用户针对文件是否有读、写、执行的权利。 权限划分:读(Read)、写(Write)、执行(eXecute) 权限针对用户的划分:主人(User&#xff…

Sqoop数据迁移工具的使用

文章作者:foochane 原文链接:https://foochane.cn/article/2019063001.html Sqoop数据迁移工具的使用 sqoop简单介绍 sqoop数据到HDFS/HIVE sqoop数据到MySQL 1 sqoop简单介绍 sqoop是apache旗下一款“Hadoop和关系数据库服务器之间传送数据”的工具。用…

java中io.nio.aio_Java中网络IO的实现方式-BIO、NIO、AIO

在网络编程中,接触到最多的就是利用Socket进行网络通信开发。在Java中主要是以下三种实现方式BIO、NIO、AIO。关于这三个概念的辨析以前一直都是好像懂,但是表达的不是很清楚,下面做个总结完全辨析清楚。1. BIO方式首先我用一个较为通俗的语言…

C++中this指针

由类生成对象时&#xff0c;对象中只保存私有数据。 因为由一个类生成的所有对象为其数据服务的方法都是相同的&#xff0c;因此&#xff0c;一个类中的方法是大家所共用的。 而这就牵扯到当对象A调用方法时&#xff0c;如何保证该方法操作的数据是对象A的数据。 #include<i…

jfinal java搭建_Eclipse快速搭建Jfinal web应用 (一)

JFinal简介JFinal 是基于 Java 语言的极速 WEB ORM 框架&#xff0c;其核心设计目标是开发迅速、代码量少、学习简单、功能强大、轻量级、易扩展、Restful。在拥有Java语言所有优势的同时再拥有ruby、python、php等动态语言的开发效率&#xff01;为您节约更多时间&#xff0c…

PHP后台处理jQuery Ajax跨域请求问题 — xx was not called解决办法

// 前台代码 $.ajax({url: http://www.ushark.net/home/save_trial_apply,dataType: jsonp,processData: false,data: $(.layui-layer-content #trialFormInfo).serialize(), }) .done(function(data) {layer.msg(申请成功); }) .fail(function(jqXHR, textStatus, errorThrown…

如何使用VisualVM监视服务器上的多个JVM

在上一篇文章中&#xff0c;我向您展示了如何使用单个管理员服务器和多个托管服务器启动WebLogic Server。 这些启动之后&#xff0c;您如何检查它们的健康状况&#xff1f; 您可以使用管理员的/ console网络应用。 但是&#xff0c;所有默认的Oracle / Open JDK 6附带的另一个…