JavaScript最初是一种功能性编程语言。直到ES5是JavaScript引入的概念。
面向对象的编程(OOP)是喜欢编程到现实生活的概念。这是在编程对象中对象在现实中的特征进行编程的过程。例如,实际上,诸如汽车之类的物体具有颜色,门数,车轮驱动器数等属性,并执行一些动作,例如开始,速度,停止等。
可以在通过OOP编程中进行 CAR 的这种特征的复制。在面向对象的编程中,这些属性称为属性,而这些操作称为方法。
在JavaScript中创建对象的方法
可以使用ES5中的原型和ES6中的类构造函数来创建对象。
在ES5中,以对象为导向的编程(OOP)是通过使用构造器函数创建对象来完成的。假设您想要一个 Person 对象,您创建一个构造函数函数并传递要设置为参数/参数的属性。传递它们后,我们将它们设置为使用 this 的关键字的对象的属性。请参阅下面的代码段。
function Person(firstName, lastName, dateOfBirth){
this.firstName = firstName;
this.lastName = lastName;
this.dateOfBirth = new Date(dateOfBirth);
然后,我们用构造函数函数实例化对象,如下所示。
const person1 = new Person(‘Busari’, ‘Ridwan’, ’14-09-1998’);
上面的代码创建了 Person1 对象。当您 console.log(person1); 应该得到一个对象。
console.log(person1);
// Outputs result to the console
注意 dateofbirth 是作为对象而不是字符串显示的,这是因为,我们将其传递给 date 对象,以便我们可以使用日期获得出生年度,出生月和日的方法。
const person2 = new Person(‘Sari’, Wan’, ’24-07-2004’);
console.log(person2.dateOfBirth.getFullYear());
// We get 2004
现在,让我们添加基本上是我们 Person 对象的方法。
在ES5中有两种方法可以做到这一点。我们可以直接在我们的 Person 对象中添加方法,也可以使用 .prototype 在外部添加方法。您将在阅读时看到下面的实现。
将方法直接添加到es5
中的对象中
function Person(firstname, lastname, dob){
this.firstName = firstname;
this.lastName = lastname;
this.dateOfBirth = new Date(dob);
this.getBirthYear = function() {
return this.dateOfBirth.getFullYear();
// the getFullYear() is a method of the Date object.
}
this.getFullName = () => `${this.firstName} ${this.lastName}`;
// I used template literal and arrow function above.
}
现在让我们调用我们的方法 - get birthyear并将其记录到控制台。
console.log(person1.getBirthYear()); // logs the birth year
console.log(person1.getFullName()); // logs the full name
现在让我们谈论原型。这实际上是在ES5中创建对象方法的更好方法。
function Person(firstname, lastname, dob){
this.firstName = firstname;
this.lastName = lastname;
this.dateOfBirth = new Date(dob);
}
Person.prototype.getBirthYear = function() {
return this.dateOfBirth.getFullYear();
}
让我们使用getfullname方法做同样的事情。
Person.prototype.getBirthYear = () => `${this.firstName} ${this.lastName}`;
让我们记录新创建的方法
console.log(person2.getFullName());
在JavaScript ES5
中,它是针对对象的编程现在,让我们在ES6中潜入面向对象的编程也称为ES2015。
如何使用类关键字在JavaScript ES6中创建对象
我们使用类在ES6中创建对象。这与ES5及其原型的构造函数相同,但这只是编写它的一种漂亮的方法。
让我们使用一个构造函数/方法来创建我们的人类班级,该构建器/方法将参数分配给其属性。
class Person {
constructor(firstName, lastName, dob ){
this.lastName = lastName;
this.firstName = firstName;
this.dob = dob;
// I have deliberately changed dateOfBirth to dob for ease of writing
}
// Now let’s create our prototypes or methods.
getBirthYear(){
return this.dob.getFullYear();
}
getFullName() {
return `${this.firstName} ${this.lastName}`;
}
}
现在,让我们实例化我们新创建的对象。
const person1 = new Person(‘You’, ‘Me’, ’05-11-2022’);
console.log(person1.getBirthYear()); // 2022
console.log(person1.getFullName()); // Busari Ridwan
代码与ES5的构造函数相同,如您所见,创建对象人的一种更短,更容易,更清洁的方法。
下次见...