Javascript：对象原型proto

听海边涛声

已于 2024-07-05 14:20:55 修改

阅读量333

点赞数 6

CC 4.0 BY-SA版权

文章标签： javascript 开发语言

于 2024-07-05 14:19:57 首次发布

本文链接：https://blog.youkuaiyun.com/panghuangang/article/details/140205972

对象都会有一个属性__proto__，称为对象原型，它指向构造函数的prototype原型对象。
对象之所以可以使用prototype原型对象的属性和方法，就是因为对象有__proto__的存在。
注意：__proto__是js的非标准属性，在不同的浏览器中可能显示不同，[[Prototype]] 和 __proto__ 的意义相同。但在代码中，要查看__proto__的话，必须写__proto__，不能写[[Prototype]] 。
__proto__属性是只读的。
__proto__对象原型里面也有一个constructor属性，指向创建该实例对象的构造函数。

示例

查看`proto`属性

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    function Star() { }
    const star1 = new Star()
    console.log(star1)
  </script>
</body>

</html>

下面[[Prototype]] 指的就是 __proto__ ：
在这里插入图片描述

示例：验证对象原型`proto` 指向该构造函数的原型对象prototype

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    function Star() { }
    const star1 = new Star()
    console.log(star1.__proto__)
    // 对象原型__proto__ 指向 该构造函数的原型对象prototype
    console.log(star1.__proto__ === Star.prototype)   // 返回true
  </script>
</body>

</html>

在这里插入图片描述

示例：`proto`对象原型里面constructor指向创建该实例对象的构造函数

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    function Star() { }
    const star1 = new Star()
    console.log(star1.__proto__.constructor)
  </script>
</body>

</html>