Eine kurze Einführung in objektorientierte und Objekttypen in js (mit Code)

Dieser Artikel bietet Ihnen eine kurze Einführung in objektorientierte und Objekttypen in js (mit Code). Ich hoffe, dass er Ihnen als Referenz dienen wird.

Objektorientiert

Der vollständige Name der objektorientierten Programmierung ist Object Oriented Programming, kurz OOP. Objektorientierte Programmierung ist eine Programmiermethode, die abstrakte Methoden verwendet, um Modelle basierend auf der realen Welt zu erstellen.
Objektorientierte Programmierung kann als Softwaredesign angesehen werden, das eine Reihe von Objekten zur Zusammenarbeit verwendet. Die drei Hauptmerkmale der objektorientierten Programmierung sind: Kapselung, Vererbung und Polymorphismus.

Kapselung

Die sogenannte Kapselung besteht darin, sie entsprechend den Anforderungen zu verwenden und die entsprechenden Ergebnisse zu erhalten, ohne das eigentliche Ausführungsprinzip zu kennen.
Kapselung wird hauptsächlich zur Beschreibung des im Objekt enthaltenen (gekapselten) Inhalts verwendet. Sie besteht normalerweise aus zwei Teilen:

• Zugehörige Daten (die zum Speichern von Attributen verwendet werden)

• Was kann basierend auf diesen Daten getan werden?

Vererbung Vererbung bezieht sich normalerweise auf die Beziehung zwischen Klassen. Wenn zwei Klassen dieselben Eigenschaften oder Methoden haben, kann eine Klasse die andere Klasse erben, ohne dass dieselben Eigenschaften oder Methoden erneut definiert werden müssen.
Das Erstellen spezialisierter Versionen einer oder mehrerer Klassen wird als Vererbung bezeichnet (JavaScript unterstützt nur Einzelvererbung). Die spezialisierte Version einer Klasse, die erstellt wird, wird normalerweise als Unterklasse bezeichnet, und die zusätzliche Klasse wird normalerweise als übergeordnete Klasse bezeichnet.

Polymorphismus

Verschiedene Objekte können Methoden mit demselben Namen definieren, und die Methoden wirken auf das Objekt, in dem sie sich befinden. Die Fähigkeit verschiedener Objekte, ihr eigenes Verhalten über denselben Methodenaufruf zu implementieren, wird als Polymorphismus bezeichnet.

Konstruktor

Der Konstruktor, auch Konstruktor oder Objektvorlage genannt, ist eine Methode des Objekts. Der Konstruktor wird beim Instanziieren aufgerufen. Funktionen können als Konstruktoren in JavaScript verwendet werden.

/*  创建构造函数->用于创建对象
*    function 构造函数名称()｛
*       this.属性名 = 属性值
*       this.方法名 = function()｛
*           方法体
*           ｝
*     ｝
      this关键字指代利用当前构造函数创建的对象*/
function Dog() {//这是构造函数，构造函数的属性和方法使用this关键字
    this.name=function () {
        console.log('哈士奇')
    }
}

/*   利用构造函数创建对象*/
var dog = new Dog();
console.log(dog);

Objekttyp

Eigenschaftsdeskriptor

JavaScript stellt eine interne Datenstruktur bereit, die den Wert eines Objekts beschreibt und sein Verhalten steuert, z. B. Ob Die Eigenschaft ist beschreibbar, konfigurierbar, löschbar, aufzählbar usw. Diese interne Datenstruktur wird als Eigenschaftsdeskriptor bezeichnet.
Es gibt derzeit zwei Hauptformen von Attributdeskriptoren in Objekten: Datendeskriptoren und Zugriffsdeskriptoren.

Datendeskriptor

Ein Datendeskriptor ist eine Eigenschaft mit einem Wert, der möglicherweise schreibbar ist oder nicht. Der Datendeskriptor verfügt über die folgenden optionalen Schlüsselwerte:

• Wert: Der Wert, der diesem Attribut entspricht. Kann jeder gültige JavaScript-Wert sein. Der Standardwert ist undefiniert,

• schreibbar: Nur wenn die Schreibbarkeit des Attributs wahr ist, kann der Wert durch den Zuweisungsoperator geändert werden. Der Standardwert ist falsch.

• konfigurierbar: Nur wenn das Konfigurierbare des Attributs wahr ist, kann der Attributdeskriptor geändert werden und das Attribut kann auch aus dem entsprechenden Objekt gelöscht werden. Der Standardwert ist falsch.

• aufzählbar: Nur wenn die Aufzählung des Attributs wahr ist, kann das Attribut im Aufzählungsattribut des Objekts erscheinen. Der Standardwert ist falsch.

Zugriffsdeskriptor

Zugriffsdeskriptor ist eine Eigenschaft, die durch ein Getter-Setter-Funktionspaar beschrieben wird. Es gibt die folgenden optionalen Schlüsselwerte

• get: Geben Sie eine Getter-Methode für das Attribut an. Wenn kein Getter vorhanden ist, ist es undefiniert. Wenn auf diese Eigenschaft zugegriffen wird, wird die Methode ausgeführt. Bei der Ausführung der Methode werden keine Parameter übergeben, aber das Objekt wird übergeben.

• set: Stellt eine Setter-Methode für die Eigenschaft bereit. Wenn kein Setter vorhanden ist, ist sie undefiniert. Diese Methode wird ausgelöst, wenn die Eigenschaft geändert wird. Diese Methode akzeptiert den einzigen Parameter, nämlich den neuen Parameterwert des geänderten Attributs.

• konfigurierbar: Nur wenn das Konfigurierbare des Attributs wahr ist, kann der Attributdeskriptor geändert werden und das Attribut kann auch aus dem entsprechenden Objekt gelöscht werden. Der Standardwert ist falsch.

• aufzählbar: Nur wenn die Aufzählung des Attributs wahr ist, kann das Attribut im Aufzählungsattribut des Objekts erscheinen. Der Standardwert ist falsch.

Eigenschaftsdeskriptor abrufen

Die Methode Object.getOwnPropentyDescriptor() gibt den Eigenschaftsdeskriptor zurück, der der eigenen Eigenschaft für das angegebene Objekt entspricht.

var obj = {
    name : '哈士奇'
}
/*
    使用Object.getOwnPropertyDescriptor()方法获取指定属性的描述符
    Object.getOwnPropertyDescriptor(obj,prop)
    * obj - 表示指定属性对应的目标对象
    * prop - 表示获取描述符的目标属性名称
    * 返回值 - 其属性描述符对象
    * 如果
  */
var v =Object.getOwnPropertyDescriptor(obj,'name');
console.log(v)

Setzen Sie die Eigenschaftsdeskriptor optionaler Schlüsselwertwert

• Die Methode Object.deginepropety() definiert neue Eigenschaften für das Objekt oder ändert vorhandene Eigenschaften und gibt das Objekt zurück.

var obj ={//定义对象时定义的属性是可以修改、删除、枚举的
    name : '阿拉斯加'
}
/*
    Object.defineProperty(obj, prop, descriptor)方法
    * 作用
      * 用于定义目标对象的新属性
      * 用于修改目标对象的已存在属性
    * 参数
      * obj - 表示目标对象
      * prop - 表示目标对象的目标属性名称
      * descriptor - 表示属性描述符，必须是对象格式
        {
            value : 值
        }
    * 返回值 - 返回传递的对象
 */
//修改name属性
Object.defineProperty(obj, 'name',{
    value:'哈士奇'
} );
console.log(obj.name);//哈士奇

/*
    同样都是为对象新增属性
    1.如果直接使用 "对象名.属性名 = 值" -> 可修改、可删除以及可枚举的
    2.如果使用Object.defineProperty()方法新增属性
      * 该新属性是不可修改、不可删除以及不可枚举的
 */
//新增age属性//用该方法新增的属性默认是不可以修改、删除、枚举的
Object.defineProperty(obj,'age',{
    value : 2
});

• Die Methode Object.degineproperties() definiert eine oder mehrere neue Eigenschaften für das Objekt oder ändert vorhandene Eigenschaften und gibt den Wert zurück.

Legen Sie den optionalen Schlüsselwert des Attributdeskriptors weitable fest

var obj = {
    // 定义对象的同时定义了该属性以及值(可修改、可删除以及可枚举的)
    name : '张无忌'
}
// 修改现有属性
Object.defineProperty(obj, 'name', {
    value : '周芷若',
    writable : false // 不可修改
});
console.log(obj.name);// 周芷若
// 修改name属性值
obj.name = '赵敏';
console.log(obj.name);// 周芷若

Object.defineProperty(obj, 'age', {
   value : 18,
   writable : true
});
console.log(obj.age);// 18
// 修改age属性值
obj.age = 80;
console.log(obj.age);// 80

Legen Sie den optionalen Schlüsselwert des Attributdeskriptors configurable fest

var obj = {
    // 定义对象的同时定义了该属性以及值(可修改、可删除以及可枚举的)
    name : '张无忌'
}
// 修改现有属性
Object.defineProperty(obj, 'name', {
    value : '周芷若',
    writable : true, // 控制当前属性是否可被修改
    configurable : true // 控制当前属性是否可被删除
});
console.log(obj.name);// 周芷若
// 修改name属性值
obj.name = '赵敏';
console.log(obj.name);// 赵敏
// 删除name属性值
delete obj.name;undefined
console.log(obj.name);// undefined

Legen Sie den Attributdeskriptor enumerable fest

var obj = {
    // 定义对象的同时定义了该属性以及值(可修改、可删除以及可枚举的)
    name : '张无忌'
}
Object.defineProperty(obj, 'name', {
    value : '周芷若',
    enumerable : false
});
console.log(obj.name);// 周芷若
/*
    属性描述符enumerable - 控制当前属性是否可被枚举(遍历)
    * 仅能循环遍历对象中可被枚举的属性
      * for...in语句
      * keys()方法
    * 可以循环遍历对象中可被枚举和不可被枚举的属性
      * getOwnPropertyNames()方法
 */
for (var i in obj) {
    console.log(i);
}
var result1 = Object.keys(obj);
console.log(result1);
var result2 = Object.getOwnPropertyNames(obj);
console.log(result2);

Attributdeskriptor-Accessor festlegen

Attribute im Objekt können nicht nur direkt definiert werden, sondern auch mithilfe von Accessoren definiert werden. Der Setter ist eine Wertfunktion, die den Satz im Attributdeskriptor verwendet; der Getter ist eine Wertfunktion, die das Get im Attributdeskriptor verwendet.

var value;
var obj = {
    // 存取描述符中的get
    get attr() {// 表示当前目标属性名称
        return value;
    },
    // 存取描述符中的set
    set attr(newValue) {// 表示当前目标属性名称
        console.log('setter: ' + newValue);
        value = newValue;
    }
}
console.log(obj.attr);// undefined
obj.attr = 100;// "setter: 100"

Manipulationssicheres Objekt

Das definierte Objekt kann standardmäßig jederzeit und überall geändert werden, sodass ein Mechanismus zur Verhinderung von Manipulationen hinzugefügt und in drei Ebenen unterteilt wird

• Erweiterung verbieten: Erweiterung neuer Eigenschaften und Methoden für Objekte verbieten

• Versiegeltes Objekt: Nur Lesen und Schreiben des Attributwerts zulassen

• Eingefrorenes Objekt: Jeglicher Vorgang ist verboten

Verbotene Erweiterungen

• Object.preventExtensions() setzt das angegebene Objekt auf nicht erweiterbar

• Object.isExtensible() bestimmt, ob ein Objekt kann erweitert werden

Objekt versiegeln

• Die Methode Objet.seal() wird verwendet, um ein Objekt zu versiegeln und zu verhindern, dass neue Eigenschaften hinzugefügt werden und markieren Sie vorhandene Eigenschaften als nicht konfigurierbar, aktuelle Eigenschaften Der Wert kann geschrieben werden.

• Object.Sealead() bestimmt, ob das Objekt versiegelt ist

Objekt einfrieren

• Objekt .freeze() wird verwendet, um ein Objekt einzufrieren. Es können keine Operationen an diesem Objekt ausgeführt werden.

• Object.isFrozen() bestimmt, ob das Objekt eingefroren ist.

Verwandte Empfehlungen:

Javascript Objektorientiert Object (Object)_js Objektorientiert

Anleitung Verwenden Sie den Prototyp des Object-Objekts in JS

JavaScript objektorientiert - Erstellung einfacher Objekte und JSON-Objekte

Das obige ist der detaillierte Inhalt vonEine kurze Einführung in objektorientierte und Objekttypen in js (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!