搜索
首页web前端js教程javascript原型是什么?javascript原型的详细解说
javascript原型是什么?javascript原型的详细解说Sep 03, 2018 am 10:05 AM
javascript原型实例对象构造函数

本篇文章给大家带来的内容是关于javascript原型是什么?javascript原型的详细解说 ,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

原型

原型还是比较重要的,想单独来细说一下,说到原型,那么什么是原型呢?

在构造函数创建出来的时候,都有一个prototype(原型)属性,这个属性是一个指针,系统会默认的创建并关联一个对象,这个对象就是原型,原型对象默认是空对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。
说白了就是可以在构造函数上调用prototype属性来指向原型,从而创建那个对象实例的原型对象

使用原型有什么好处呢?

使用原型的好处是可以让所有对象实例共享它所包含的属性和方法。

转晕了麽?是不是超级乱?又构造函数,又原型,又实例,不担心,我一句话点破你
我们所有的构造函数最终都要演变成实例才有意义,因为在构造函数中定义方法无法被所有的实例共享,因此只能找构造函数的上一级,就是原型,在原型上定义的属性和方法可以被所有的实例所共享,这就是对原型对象的性质

看个图你就知道了,它们三者之间就是三角恋关系
408152979-5b8c019e5a2c8_articlex.png
很通俗易懂了吧
构造函数.prototype = 原型
原型.constructor = 构造函数
实例对象.constructor = 构造函数(这是因为实例对象在自身找不到constructor属性,那么他会通过__proto__去原型中找,通过原型搭桥指向了构造函数)
实例对象.__proto__ = 原型

原型是打印显示不出来的,只能通过 构造函数.prototype 去表示

下面介绍另外两个获取原型的方法

isPrototypeOf()方法:用于判断这个实例的指针是否指向这个原型。
Object.getPrototypeOf()方法:获取实例的原型,这个方法支持的浏览器有IE9+、Firefox 3.5+、Safari 5+、Opera 12+和Chrome,因此比较推荐通过这个方法获取对象的原型。

假定有个Person构造函数和person对象
Person.prototype.isPrototypeof(person)  // 返回true说明前者是person1的原型
Object.getPrototypeOf(person) === Person.prototype // 获取person的原型

多个对象实例共享原型所保存的属性和方法的基本原理
每当代码读取某个对象的某个属性时,都会执行一次搜索,目标是具有给定名字的属性。首先从对象实例本身开始。如果在实例中找到了具有给定名字的属性,则返回该属性的值;如果没有找到,则继续搜索指针指向的原型对象,在原型对象中查找具有给定名字的属性。如果在原型对象中找到了这个属性,则返回该属性值。

我们可以访问原型中的值,但是却不能重写原型中的值,如果我们在实例中添加一个属性,而这个属性名和原型中的重名,则这个属性将会屏蔽(复写)原型中的那个属性。

function Person() {}

Person.prototype.name = "George"
Person.prototype.sayName = function() {
    console.log(this.name)
}

let person1 = new Person();
let person2 = new Person();
person1.name = "命名最头痛";

// 在这一环节,person1.name会从他实例中找,若实例没找到,则继续搜索它的原型对象
console.log(person1.name); // 命名最头痛 
console.log(person2.name); // George

在实例对象中添加一属性只会阻止我们访问原型中的那个属性,但不会修改那个属性。即使将这个属性设置为null,也只会在实例中设置这个属性,而不会恢复其指向原型的连接

若想完全删除实例属性,可使用delete操作符,从而让我们能够重新访问原型中的属性。

delete 操作符的使用

依旧用上面那个例子
delete操作符可用于删除对象的属性,无论是实例上的属性,还是在原型上的属性都可以删

delete person1.name    // 删除这个实例的属性
delete Person.prototype.name    // 删除原型上的属性
delete Person.prototype.constructor // 删除constructor属性,这样就没办法指回函数了

hasOwnProperty()方法可用来检测一个属性是存在于实例中,还是存在于原型中。这个方法只在给定属性存在于对象实例时,才返回true,也可以这样理解,hasOwnProperty方法用于检测这个属性是否是对象本身属性。
obj.hasOwnProperty('属性名')

Demo:

function Person(){ 
  this.name = '命名最头痛'
}
var person = new Person()
Person.prototype.age = '18'
console.log(person.hasOwnProperty('name'))  // true
console.log(Person.prototype.hasOwnProperty('age')) // true

in操作符

in操作符有两种用法
①放在for-in循环中使用,for-in能够返回所有能够通过对象访问的、可枚举的(enumerable)属性(可枚举属性可参看一眼看穿

以上是javascript原型是什么?javascript原型的详细解说的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
源码探秘:Python 中对象是如何被调用的?源码探秘:Python 中对象是如何被调用的?May 11, 2023 am 11:46 AM

楔子我们知道对象被创建,主要有两种方式,一种是通过Python/CAPI,另一种是通过调用类型对象。对于内置类型的实例对象而言,这两种方式都是支持的,比如列表,我们即可以通过[]创建,也可以通过list(),前者是Python/CAPI,后者是调用类型对象。但对于自定义类的实例对象而言,我们只能通过调用类型对象的方式来创建。而一个对象如果可以被调用,那么这个对象就是callable,否则就不是callable。而决定一个对象是不是callable,就取决于其对应的类型对象中是否定义了某个方法。如

使用Python的__le__()函数定义两个对象的小于等于比较使用Python的__le__()函数定义两个对象的小于等于比较Aug 21, 2023 pm 09:29 PM

标题:使用Python的__le__()函数定义两个对象的小于等于比较在Python中,我们可以通过使用特殊方法来定义对象之间的比较操作。其中之一就是__le__()函数,它用于定义小于等于比较。__le__()函数是Python中的一个魔法方法,并且是一种用于实现“小于等于”操作的特殊函数。当我们使用小于等于运算符(<=)比较两个对象时,Python

详解Javascript对象的5种循环遍历方法详解Javascript对象的5种循环遍历方法Aug 04, 2022 pm 05:28 PM

Javascript对象如何循环遍历?下面本篇文章给大家详细介绍5种JS对象遍历方法,并浅显对比一下这5种方法,希望对大家有所帮助!

原神4.4版本新地图介绍原神4.4版本新地图介绍Jan 31, 2024 pm 06:36 PM

原神4.4版本新地图介绍,小伙伴们原神这次4.4版本也是迎来了璃月的海灯节,同时将在4.4版本推出一个新的地图区域,名为沉玉谷。根据提供的信息,沉玉谷实际上是翘英庄的一部分,但玩家更习惯称其为沉玉谷。下面就让小编来给大家介绍一下新地图吧。原神4.4版本新地图介绍4.4版本将开放璃月北部的「沉玉谷·上谷」、「沉玉谷·南陵」和「来歆山」,在「沉玉谷·上谷」已为旅行者开启传送锚点。※完成魔神任务序章·第三幕巨龙与自由之歌」后,将自动解锁该传送锚点。二、翘英庄当春日温煦的柔风再度抚过沉玉的山野,那馥郁的

什么是原型和原型链什么是原型和原型链Nov 09, 2023 pm 05:59 PM

原型,js中的一个对象,用于定义其他对象的属性和方法,每个构造函数都有一个prototype属性,这个属性是一个指针,指向一个原型对象,当创建新对象时,这个新对象会从其构造函数的prototype属性继承属性和方法。原型链,当试图访问一个对象的属性时,js会首先检查这个对象是否有这个属性,如果没有,那么js会转向这个对象的原型,如果原型对象也没有这个属性,会继续查找原型的原型。

PHP代码封装技巧:如何使用类和对象封装可重复使用的代码块PHP代码封装技巧:如何使用类和对象封装可重复使用的代码块Jul 29, 2023 pm 11:19 PM

PHP代码封装技巧:如何使用类和对象封装可重复使用的代码块摘要:在开发中,经常遇到需要重复使用的代码块。为了提高代码的可维护性和可重用性,我们可以使用类和对象的封装技巧来对这些代码块进行封装。本文将介绍如何使用类和对象封装可重复使用的代码块,并提供几个具体的代码示例。使用类和对象的封装优势使用类和对象的封装有以下几个优势:1.1提高代码的可维护性通过将重复

Python中如何使用__add__()函数定义两个对象的加法运算Python中如何使用__add__()函数定义两个对象的加法运算Aug 22, 2023 am 11:12 AM

Python中如何使用__add__()函数定义两个对象的加法运算在Python中,可以通过重载运算符来为自定义的对象添加对应的运算功能。__add__()函数是用于定义两个对象的加法运算的特殊方法之一。在本文中,我们将学习如何使用__add__()函数来实现对象的加法运算。在Python中,可以通过定义一个类来创建自定义的对象。假设我们有一个叫做"Vect

Vue中如何使用v-for指令循环输出对象Vue中如何使用v-for指令循环输出对象Jun 11, 2023 am 08:51 AM

在Vue中,v-for是一种指令,在模板中使用它可以对数组或对象进行循环操作。v-for指令用于循环渲染数据,它是Vue中非常有用的指令之一。在Vue中,使用v-for指令循环输出对象的方式和循环输出数组的方式类似,只需要稍作区别即可。如何使用v-for指令循环输出对象呢?下面我们将分以下几个部分进行讲解。一、v-for指令的基本使用v-for指令的基本语法

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

Dreamweaver Mac版

Dreamweaver Mac版

视觉化网页开发工具

安全考试浏览器

安全考试浏览器

Safe Exam Browser是一个安全的浏览器环境,用于安全地进行在线考试。该软件将任何计算机变成一个安全的工作站。它控制对任何实用工具的访问,并防止学生使用未经授权的资源。

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器