JavaScript 对象 - prototype

JavaScript 对象的 prototype 属性允许你向任何对象（Number、Boolean、String 和 Date 等）添加属性和方法。

在 JavaScript 中，对象 prototype 属性是一个全局属性，几乎所有对象都可用。

语法

以下是 JavaScript 对象 prototype 属性的语法：

object.prototype.name = value

这里，name 可以是任何你想添加到对象的属性或方法名。

参数

它不接受任何参数。

返回值

此属性没有返回值。

示例 1

使用 prototype 属性向对象添加属性。

在下面的示例中，我们使用 JavaScript 对象 prototype 属性向名为 "student" 的对象添加名为 "city" 的属性。

<html>
<head>
<title>JavaScript String length Property</title>
</head>
<body>
<script>
   function student(name, age){
      this.name = name;
      this.age = age;
   }
   const obj = new student("Rahul Verma", 22);
   //using prototype property to set a property
   document.write("Before adding the city property: ", obj.city);
   String.prototype.city = null;
   obj.city = "Lucknow";
   document.write("<br>Name: ", obj.name);
   document.write("<br>Age: ", obj.age);
   document.write("<br>After adding City: ", obj.city);
</script>
</body>
</html>

输出

上面的程序将 city 属性添加到对象。

Before adding the city property: undefined
Name: Rahul Verma
Age: 22
After adding City: Lucknow

示例 2

使用 prototype 属性向对象添加方法。

以下是另一个使用 JavaScript 对象 prototype 属性的示例。通过使用此属性，我们向对象添加了两个名为 "display()" 和 "editCredential()" 的方法。"display()" 方法显示管理员凭据，而 "editCredential()" 方法允许编辑管理员凭据。

<html>
<head>
<title>JavaScript String length Property</title>
</head>
<body>
<script>
   function Admin(){
      this.username = "[email protected]";
      this.password = "abc@123";
   }
   //adding display function using prototype
   Admin.prototype.display = function(){
      document.write("Username: ", this.username, ", Password: ", this.password);
   }
   //adding editCredential function using prototype
   Admin.prototype.editCredential = function(username, password){
      this.username = username;
      this.password = password;
   }
   const a = new Admin();//calling the object using the Admin() class
   document.write("Admin Credential before edit:<br>");
   a.display();
   a.editCredential("[email protected]", "admin123");
   document.write("<br>Admin Credential after edit:<br>");
   a.display();
</script>
</body>
</html>

输出

执行上述程序后，将显示以下结果：

Admin Credential before edit:
Username: [email protected], Password: abc@123
Admin Credential after edit:
Username: [email protected], Password: admin123

打印页面