Anmerkungen zur JavaScript-Studie: Objekte erstellen_Javascript-Fähigkeiten

JavaScript verfügt über integrierte Objekte wie „Datum“, „Array“, „String“ usw., die leistungsstark und einfach zu verwenden sind, und jeder liebt sie. Wenn es jedoch um komplexe Logik geht, sind die integrierten Objekte sehr machtlos und Entwickler müssen häufig Objekte anpassen.

Gemäß der Definition von JavaScript ist ein Objekt eine Sammlung ungeordneter Eigenschaften, und seine Eigenschaften können Grundwerte, Objekte oder Funktionen enthalten. Das heißt, ein Objekt ist ein Satz von Attributen in keiner bestimmten Reihenfolge. Jedes Attribut wird einem Wert zugeordnet, der ein Satz von Schlüssel-Wert-Paaren ist. Der Wert kann Daten oder ein Objekt sein.

Objekt ist der grundlegende Datentyp von JavaScript. In JavaScript sind andere Werte als Zeichenfolgen, Zahlen, wahr, falsch, null und undefiniert Objekte. Daher ist es sehr schwierig, weiterhin JavaScript zu lernen, ohne die Objekte zu verstehen. Beginnen Sie noch heute damit, etwas über Objekte zu lernen.

Übersicht

Objekt ist ein grundlegender Datentyp in JavaScript. In Bezug auf die Datenstruktur handelt es sich um eine Hash-Tabelle, die als ungeordnete Sammlung von Attributen betrachtet werden kann. Der Zugriff auf diese Werte erfolgt über den Eigenschaftsnamen, der eine beliebige Zeichenfolge einschließlich des Nullzeichens sein kann. Vereinfacht ausgedrückt ist ein Objekt eine Sammlung von Attributen. Ein Attribut enthält einen Namen (Schlüssel) und einen Wert (Wert).

Um zu verstehen, was ein JavaScript-Objekt ist, können Sie es sich folgendermaßen vorstellen. In JavaScript ist ein Objekt ein bestimmter Körper mit Eigenschaften. Nehmen Sie das Mädchen, das Sie sehen. Sie hat ihre eigenen Eigenschaften. Zum Beispiel die Größe, das Alter, den Namen usw. des Mädchens. In ähnlicher Weise können Eigenschaften auch in JavaScript verwendet werden, um Eigenschaften eines Objekts zu definieren.

Objekt erstellen

Da Sie Objekte lernen möchten, müssen Sie zuerst ein Objekt haben. Dann stellt sich die Frage, wie man ein Objekt in JavaScript erstellt. Schauen wir uns als Nächstes an, wie man Objekte in JavaScript erstellt.

Viele Bücher über JavaScript stellen Methoden der Objekterstellung vor, darunter hauptsächlich:

Verwenden Sie Objektliterale, um Objekte (Schlüsselwert) zu erstellen

Verwenden Sie „Neu“, um Objekte zu erstellen

Erstellen Sie Objekte mit Object.create()

Verwenden Sie Funktionen, um Objekte zu erstellen

Erstellen Sie Objekte mithilfe von Prototypen

Erstellen Sie Objekte mithilfe von Objektliteralen

Objektliteral ist die einfachste Form der Objekterstellung. Ziel ist es, den Prozess der Objekterstellung mit einer großen Anzahl von Eigenschaften zu vereinfachen. Das Objektliteral ist eine Zuordnungstabelle, die aus Paaren von Attributnamen (Schlüsseln) und Attributwerten (Werten) besteht. Schlüssel und Wert werden durch Doppelpunkte (:) getrennt, und jedes Schlüssel/Wert-Paar wird durch Kommas getrennt (). ,). Die gesamten Zuordnungstabellen sind in geschweifte Klammern ({}) eingeschlossen.

Die Syntax zum Erstellen von Objekten durch Objektliterale lautet wie folgt:

var obj = {
property_1: value_1, // property_# 可能是一个标识符...
2: value_2, // 或者是一个数字
// ...,
"property n": value_n // 或是一个字符串
};

Hier ist obj der Name des erstellten Objekts, jede Eigenschaft_i ist ein Bezeichner (kann ein Name, eine Zahl oder ein Zeichenfolgenliteral sein) und jeder Wert_i ist sein Wert, und dieser Wert wird Eigenschaft_i zugewiesen. Schauen wir uns ein konkretes Beispiel an:

var girl = {
'name': '欣欣',
'age' : 18,
'height': 175,
'weight': 45
}

In diesem Beispiel wird ein Objekt namens „Mädchen“ erstellt. Das Objekt hat vier Attribute: Name, Alter, Größe und Gewicht. Diese vier Attribute entsprechen einem Attributwert.

Wenn Sie beim Erstellen eines Objekts mithilfe von Objektliteralen die geschweiften Klammern ({}) leer lassen, können Sie ein Objekt definieren, das nur Standardeigenschaften und -methoden enthält. Zum Beispiel:

var obj = {}

Wenn Sie ein auf diese Weise erstelltes Objekt verwenden, können Sie über den Punkt (.), also obj.key, Objektattribute für Objekt obj erstellen und den Attributwert des Objekts zuweisen. Darüber hinaus können Sie auch Objektattribute für das Objekt obj über eckige Klammern ([]) erstellen, also obj['key'], und die Attributwerte des Objekts zuweisen. Als Beispiel unten:

var girl = {};
girl.name = '欣欣';
girl.age = 18;
girl['height'] = 175;
girl['weight'] = 45;

Beim Drucken des Mädchenobjekts in Chrome ist das Ausgabeergebnis wie folgt:

console.log(girl);
//Object {name: "欣欣", age: 18, height: 175, weight: 45}

Verwenden Sie „Neu“, um Objekte zu erstellen

Sie können Objekte auch erstellen, indem Sie den neuen Operator gefolgt vom Objektkonstruktor verwenden (mehr zum Konstruktor später):

var obj = new Object(); // Gleich wie obj = {}

Obwohl obj im Anfangszustand ein leeres Objekt ist, können Mitglieder in JavaScript problemlos hinzugefügt und dynamisch verwendet werden, sodass wir weiterhin Mitgliedsvariablen und -methoden hinzufügen können. Zum Beispiel:

var girl = new Object();
girl['name'] = '欣欣';
girl['age'] = 18;
girl['height'] = 175;
girl['weight'] = 45;

Verwenden Sie Object.create(), um Objekte zu erstellen

Objekte können auch mit der Methode Object.create() erstellt werden. Diese Methode ist nützlich, da Sie damit das Prototypobjekt für das erstellte Objekt auswählen können, ohne einen Konstruktor definieren zu müssen.

Die Methode Object.create() erstellt ein Objekt mit dem angegebenen Prototyp und mehreren angegebenen Eigenschaften.

Object.create(proto, [ PropertiesObject ])

Die Methode Object.create() erstellt ein Objekt und akzeptiert zwei Parameter. Der erste Parameter ist das Prototypobjekt dieses Objekts. Diese Methode ist sehr einfach anzuwenden:

var obj1 = Object.create({
x: 1,
y: 2
}); //对象obj1继承了属性x和y
var obj2 = Object.create(null); //对象obj2没有原型

如果 proto 参数不是 null 或一个对象值，则抛出一个 TypeError 异常。
有关于Object.create()方法更多的示例可以点击这里进行了解。

使用函数创建对象

在实际使用当中，字面量创建对象虽然很有用，但是它并不能满足我们的所有需求，我们希望能够和其他后台语言一样创建一个类，然后声明类的实例就能够多次使用，而不用每次使用的时候都要重新创建它。

因为JavaScript没有类，一般都是使用函数来定义一个类似其他语言中的类格式，比如：

function Person() {
this.name = "mary"; // 为这个类添加一个成员变量name，并为这个成员变量赋默认值
this.age = 5;
this.sayHello = function () {
console.log(this.name + " : " + this.age);
};
}

定义好类之后，我们就可以像下面这样创建和使用对象：

var person1 = new Person();
person1.name = 'Tom';
person1.age = 20;
person1.sayHello(); // Tom : 20
var person2 = new Person();
person2.name = 'W3cplus';
person2.age = 5;
person2.sayHello(); // W3cplus : 5

Person()函数不是用来被调用的，它是用来被new用的。

通过原型创建对象

这种方法比较前几种方法来说算是最为复杂，最为高级的方法。这里还涉及到封装的一些知识(有关于这些后续学习到了再记录)。这里简单看看如何通过原型创建对象。

首先像函数方法创建对象一样，先定义一个函数：

function Person() {
this.name = "W3cplus";
this.age = 5;
this.walk = function () {
console.log("一个前端网站...");
};
}

然后在外部可以扩允成员：

//添加成员方法
Person.prototype.sayHello = function () {
console.log("hello");
};
//也可以添加成员属性，
Person.prototype.height = 100;

一方面，原型可以扩充原有类的功能(特别是添加有用方法)，也可以像下面这样写:

function Person() { }
Person.prototype.name = "W3cplus";
Person.prototype.age = 5;
Person.prototype.walk = function () {
console.log("一个前端网站...");
};
Person.prototype.sayHello = function () {
console.log("hello");
};
Person.prototype.height = 100;

属性访问

对象属性访问一般有两种方法，第一种是使用点(.)表示法，这也是最常用的一种方法，也是很多面向对象语言中通用的语法。第二种方法还可以使用中括号([])表示法来访问对象的属性。在使用中括号语法时，应该将要访问的属性以字符串的形式放在中括号中。如下：

person['name'];
person.name;

从功能上来说，上面两种方法访问对象属性没有任何区别。但中括号语法的主要优点有两个：

可能通过变量访问属性，如下：

var propertyName = 'name';
person[propertyName];

另外一个优点是，如果属性名中包含了会导致语法错误的字符或者属性名使用的是关键字或保留字，可以使用中括号访问属性，如下：

person['first name'];

一般情况之下，除非必须使用亦是来访问对象属性，否则建议使用点(.)的方法来访问对象属性。

总结

对象是JavaScript的基本数据类型，如果要更好的往下学习JavaScript相关的知识，很有必要先把对象整明白。这篇主要介绍了几种创建对象的方法。较为简单的是通过字面量({})和new Object()方法创建，但这两种方法创建的对象复用性较差；使用Object.create()创建对象时不需要定义一个构造函数就允许你在对象中选择其原型对象。除了这几种方法还可以使用函数和原型创建对象，而这两种方法相对来说可复用性强，只是使用较为复杂。

有关JavaScript学习笔记之创建对象的知识小编就给大家介绍到这里，希望对大家有所帮助！