資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 JavaScript 物件建構函式中新增屬性？
在本文中，我們將介紹如何在 JavaScript 中向 JavaScript 物件建構函式新增屬性，並提供相應的示例。
向物件建構函式新增屬性與向普通物件新增屬性不同。如果要新增屬性，必須在建構函式本身中新增，而不是在建構函式外部新增，而在普通物件中，可以在任何地方新增。
為了更好地理解給定的任務，讓我們深入瞭解 JavaScript 中建構函式的語法和用法。
語法
建構函式的語法如下：
Constructor(); // No parameters Constructor(param1); //One parameter constructor Constructor(param1,param2,…,paramN) // N-parameter constructor.
其中param1,param2,..paramN 是傳遞給建構函式的引數。
示例 1
這是一個向 JS 物件建構函式新增屬性的示例程式。在這個例子中，我們將引數作為屬性新增到建構函式中。
<!DOCTYPE html>
<html>
<head>
<meta charset ="UTF-8">
<meta http-equiv ="X-UA-Compatible" content ="IE=edge">
<meta name ="viewport" content ="width=device-width, initial-scale=1.0">
<title>To add a method to a JavaScript Object Constructor.</title>
</head>
<body style="text-align : center">
<h3>Add a method to a JavaScript Object Constructor.</h3>
<p id="prop-to-obj"></p>
<script>
function Car(name, model, year, color) {
this.Name = name;
this.Model = model;
this.Year = year;
this.Color = color;
this.type = 'SUV'
}
var car1 = new Car("Maruti", "Vitara Brezza", "2016", "Red");
document.getElementById("prop-to-obj").innerHTML = car1.Name+" is of "+car1.type+" type";
</script>
</body>
</html>
執行以上程式碼後，將生成以下輸出。
示例 2
這是一個將方法作為屬性新增到 JS 物件建構函式的示例程式。我們可以將函式作為屬性新增到物件中。然後可以將它們稱為方法。
<!DOCTYPE html>
<html>
<head>
<meta charset ="UTF-8">
<meta http-equiv ="X-UA-Compatible" content ="IE=edge">
<meta name ="viewport" content ="width=device-width, initial-scale=1.0">
<title>To add a method to a JavaScript Object Constructor.</title>
</head>
<body style="text-align : center">
<h3>Add a method to a JavaScript Object Constructor.</h3>
<p id="method-to-obj-constructor"></p>
<script>
function Car(name, model, year, color) {
this.Name = name;
this.Model = model;
this.Year = year;
this.Color = color;
this.type = 'SUV';
this.description = function() {
return this.Name+" is of "+this.Model+" model and launched in the year "+this.Year+" and is of "+this.type+" type."
}
}
var car1 = new Car("Maruti", "Vitara Brezza", "2016", "Red");
document.getElementById("method-to-obj-constructor").innerHTML = car1.description();
</script>
</body>
</html>
執行以上程式碼後，將生成以下輸出。
示例 3
這是一個向 JavaScript 物件建構函式新增屬性（方法和引數）的示例程式。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>To add a method to a JavaScript Object Constructor.</title>
</head>
<body style="text-align : center">
<h3>Add a method to a JavaScript Object Constructor.</h3>
<p id="method-to-obj-constructor"></p>
<script>
function Student(name, rollNo, course) {
this.Name = name;
this.RNo = rollNo;
this.course = course;
this.year = "2022";
this.college = "St. Xaviers College";
this.studentDetails = function () {
return this.Name + " with roll number " + this.RNo + " is a student of : " + this.college;
}
}
var studentObj = new Student("Harsha", "17355B07C7", "CSE");
document.getElementById("method-to-obj-constructor").innerHTML = studentObj.studentDetails();
</script>
</body>
</html>
執行以上程式碼後，將生成以下輸出。
更新於： 2022-12-09
749 次瀏覽
廣告