Heim Web-Frontend js-Tutorial Javascript继承(上)——对象构建介绍_JavaScript

Javascript继承(上)——对象构建介绍_JavaScript

May 16, 2016 pm 05:48 PM
创建 对象

Javascript中存在“类”么?

万物皆对象
Javascript中除了基本数据(Undefined、Null、Boolean、Number、String),其他都是对象(Object)。
实际上,Javascript中的对象是数据与功能的集合。例如我们知道:

复制代码 代码如下:

var foo = new Function("alert('hello world!')");
foo();

可见foo是一个函数,也是一种对象。再比如说:
复制代码 代码如下:

function foo(){
//do something
}

foo.data = 123;
foo["data2"] = "hello";

alert(foo.data);
alert(foo.data2);

函数也可以像对象一样添加属性。
对象的构建
一般我们用构造函数来构建对象,但如果没有构造函数,我们也有办法构建我们想要的对象:
复制代码 代码如下:

function creatPerson(__name, __sex, __age){
return {
name: __name,
sex: __sex,
age: __age,
get: function(__key){
alert(this[__key]);
}
};
}

var Bob = creatPerson("Bob", "male", 18);
Bob.get("name"); //Bob
Bob.get("sex"); //male
Bob.get("age"); //18

但是这不够,我希望方法是可以共享的。比如我再用该函数创建一个Tom对象,get函数就又被创建了一次,这明显地浪费了我的内存。
导入共享资源
因为我们知道函数也是对象,所以我们可以把需要共享的方法或属性放在放在他“身上”:
复制代码 代码如下:

function creatPerson(__name, __sex, __age){
var common = arguments.callee.common;
return {
//自身的属性
name: __name,
sex: __sex,
age: __age,
//自身的方法
sayhi: function(){alert("hi");},
//共享的方法
get: common.get,
getType: common.getType,
//共享的属性
type: common.type
};
}
creatPerson.common = {
get:function(__key){
alert(this[__key]);
},
getType: function(){
alert(this.type);
},
type: "Person"
};

var Bob = creatPerson("Bob", "male", 18);
Bob.get("name"); //Bob
Bob.get("sex"); //male
Bob.getType(); //Person

于是我们就用蹩脚的方法,成功的创建了一个拥有自有属性方法和共享属性方法的对象。但实际上,Javascript就是这么蹩脚地创建对象的。
其实共享属性没有真正实现,因为这个共享属性,依然只是一个副本。这并不是我们真正希望的共享属性。

new关键字
和上面的“对象的构建”相同,new的目的是创建对象的自有属性和方法。例如:
复制代码 代码如下:

function Person(__name, __sex, __age){
this.name = __name;
this.sex = __sex;
this.age = __age;
this.get = function(__key){
alert(this[__key]);
};
}

var Bob = new Person("Bob", "male", 18);
Bob.get("name"); //Bob
Bob.get("sex"); //male
Bob.get("age"); //18

原型(Prototype)
Javascript的作者用了和上面“导入共享资源”的方法差不多。既然函数也是对象,那么把需要共享的“东东”放在他“身上”吧:
复制代码 代码如下:

function Person(__name, __sex, __age){
this.name = __name;
this.sex = __sex;
this.age = __age;
this.sayhi = function(__key){
alert("hi");
};
}
Person.prototype = {
constructor: Person,
get: function(__key){
alert(this[__key]);
}
};

var Bob = new Person("Bob", "male", 18);
Bob.get("name"); //Bob
Bob.get("sex"); //male
alert(Bob.constructor); //function Person


Javascript创建对象的模型是简洁的,new来处理自身问题,prototype来处理共享问题。

如果说Java的对象(实例)产生方式是将原材料丢到模子里(类)熔炼而成;那么Javascript的对象产生方式就是给材料给建筑工(构造函数)让他按图纸搭建而成。

实际流程

当然实际流程并不是这样的,新建一个对象先做的是处理共享资源,例如:
复制代码 代码如下:

function A(){
console.dir(this);
alert(this.type); //A
}
A.prototype.type = "A";
var a = new A();



通过console.dir将a打印出来我们可以看到:
type "A"
__proto__ A {type = "A"}
  type "A"
  constructor A()

构造函数新建一个对象以后,立刻将其prototype的引用赋给新建对象的内部属性__proto__,然后再运行构造函数里面的构造语句。

并没有覆盖
复制代码 代码如下:

function A(){
this.type = "B"
}
A.prototype.type = "A";

var a = new A();
alert(a.type); //B

当我们想得到a.type时,引擎会先去在a对象中查看是否有属性type,如果有则返回该属性,没有则试图在__proto__中查找是否有type属性,如果有则返回该属性。

__proto__并不是标准的,比如IE上没有,但IE上也有类似的内部属性,但我们也无法使用它。

基于这个原因,我们删掉a.type时依然可以返回a.type:
复制代码 代码如下:

function A(){
this.type = "B"
}
A.prototype.type = "A";

var a = new A();
alert(a.type); //B
delete a.type;
alert(a.type); //A

到底有没有类?

严格地讲,Javascript并没有类(class)这种东西。
但有时候我们会用构造函数的名字作为利用该构造函数创建的对象们的“类型(type not class)名”,以方便我们用Javascript进行面向对象编程时的交流。
名字只是一个代号,一个方便理解的工具罢了。

参考文献

Javascript继承机制的设计思想
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie erstelle ich einen Ordner auf Realme Phone? Wie erstelle ich einen Ordner auf Realme Phone? Mar 23, 2024 pm 02:30 PM

Titel: Realme Phone-Einsteigerhandbuch: Wie erstelle ich Ordner auf dem Realme Phone? In der heutigen Gesellschaft sind Mobiltelefone zu einem unverzichtbaren Hilfsmittel im Leben der Menschen geworden. Als beliebte Smartphone-Marke wird Realme Phone von Nutzern wegen seines einfachen und praktischen Betriebssystems geliebt. Bei der Verwendung von Realme-Telefonen können viele Menschen auf Situationen stoßen, in denen sie Dateien und Anwendungen auf ihren Telefonen organisieren müssen, und das Erstellen von Ordnern ist eine effektive Möglichkeit. In diesem Artikel erfahren Sie, wie Sie Ordner auf Realme-Telefonen erstellen, um Benutzern die bessere Verwaltung ihrer Telefoninhalte zu erleichtern. NEIN.

So erstellen Sie Pixelkunst in GIMP So erstellen Sie Pixelkunst in GIMP Feb 19, 2024 pm 03:24 PM

Dieser Artikel wird Sie interessieren, wenn Sie GIMP für die Erstellung von Pixelkunst unter Windows verwenden möchten. GIMP ist eine bekannte Grafikbearbeitungssoftware, die nicht nur kostenlos und Open Source ist, sondern Benutzern auch dabei hilft, auf einfache Weise schöne Bilder und Designs zu erstellen. GIMP ist nicht nur für Anfänger und professionelle Designer geeignet, sondern kann auch zum Erstellen von Pixelkunst verwendet werden, einer Form digitaler Kunst, bei der Pixel als einzige Bausteine ​​zum Zeichnen und Erstellen verwendet werden. So erstellen Sie Pixelkunst in GIMP Hier sind die wichtigsten Schritte zum Erstellen von Pixelbildern mit GIMP auf einem Windows-PC: Laden Sie GIMP herunter, installieren Sie es und starten Sie dann die Anwendung. Erstellen Sie ein neues Bild. Breite und Höhe ändern. Wählen Sie das Bleistiftwerkzeug aus. Stellen Sie den Pinseltyp auf Pixel ein. aufstellen

So erstellen Sie eine Familie mit Gree+ So erstellen Sie eine Familie mit Gree+ Mar 01, 2024 pm 12:40 PM

Viele Freunde haben geäußert, dass sie wissen möchten, wie man eine Familie in der Gree+-Software erstellt. Hier ist die Vorgehensweise für Sie. Freunde, die mehr wissen möchten, schauen Sie sich das an. Öffnen Sie zunächst die Gree+-Software auf Ihrem Mobiltelefon und melden Sie sich an. Klicken Sie dann in der Optionsleiste unten auf der Seite ganz rechts auf die Option „Mein“, um die Seite mit dem persönlichen Konto aufzurufen. 2. Nachdem ich auf meine Seite gekommen bin, gibt es unter „Familie“ die Option „Familie erstellen“. Nachdem Sie sie gefunden haben, klicken Sie darauf, um sie aufzurufen. 3. Wechseln Sie als nächstes zur Seite zum Erstellen einer Familie, geben Sie den festzulegenden Familiennamen gemäß den Eingabeaufforderungen in das Eingabefeld ein und klicken Sie nach der Eingabe auf die Schaltfläche „Speichern“ in der oberen rechten Ecke. 4. Abschließend erscheint unten auf der Seite die Meldung „Erfolgreich speichern“, die anzeigt, dass die Familie erfolgreich erstellt wurde.

So erstellen Sie ein Gantt-Diagramm mit Highcharts So erstellen Sie ein Gantt-Diagramm mit Highcharts Dec 17, 2023 pm 07:23 PM

Für die Verwendung von Highcharts zum Erstellen eines Gantt-Diagramms sind bestimmte Codebeispiele erforderlich. Einführung: Das Gantt-Diagramm ist eine Diagrammform, die häufig zur Anzeige des Projektfortschritts und der Zeitverwaltung verwendet wird. Es kann die Startzeit, Endzeit und den Fortschritt der Aufgabe visuell anzeigen. Highcharts ist eine leistungsstarke JavaScript-Diagrammbibliothek, die umfangreiche Diagrammtypen und flexible Konfigurationsoptionen bietet. In diesem Artikel wird erläutert, wie Sie mit Highcharts ein Gantt-Diagramm erstellen, und es werden konkrete Codebeispiele gegeben. 1. Highchart

So erstellen Sie ein Kontaktposter für Ihr iPhone So erstellen Sie ein Kontaktposter für Ihr iPhone Mar 02, 2024 am 11:30 AM

In iOS17 hat Apple seinen häufig verwendeten Telefon- und Kontakt-Apps eine Kontaktposterfunktion hinzugefügt. Mit dieser Funktion können Benutzer für jeden Kontakt personalisierte Poster festlegen, wodurch das Adressbuch visueller und persönlicher wird. Kontaktposter können Benutzern dabei helfen, bestimmte Kontakte schneller zu identifizieren und zu lokalisieren und so das Benutzererlebnis zu verbessern. Mit dieser Funktion können Benutzer je nach ihren Vorlieben und Bedürfnissen spezifische Bilder oder Logos zu jedem Kontakt hinzufügen, wodurch die Adressbuchoberfläche lebendiger wird. Apple bietet iPhone-Benutzern in iOS17 eine neuartige Möglichkeit, sich auszudrücken, und fügt ein personalisierbares Kontaktposter hinzu. Mit der Funktion „Kontaktposter“ können Sie einzigartige, personalisierte Inhalte anzeigen, wenn Sie andere iPhone-Benutzer anrufen. Du

Ein erster Blick auf Django: Erstellen Sie Ihr erstes Django-Projekt über die Befehlszeile Ein erster Blick auf Django: Erstellen Sie Ihr erstes Django-Projekt über die Befehlszeile Feb 19, 2024 am 09:56 AM

Beginnen Sie die Reise des Django-Projekts: Beginnen Sie von der Befehlszeile aus und erstellen Sie Ihr erstes Django-Projekt. Django ist ein leistungsstarkes und flexibles Webanwendungs-Framework. Es basiert auf Python und bietet viele Tools und Funktionen, die zum Entwickeln von Webanwendungen erforderlich sind. In diesem Artikel erfahren Sie, wie Sie Ihr erstes Django-Projekt über die Befehlszeile erstellen. Stellen Sie vor dem Start sicher, dass Python und Django installiert sind. Schritt 1: Erstellen Sie das Projektverzeichnis. Öffnen Sie zunächst das Befehlszeilenfenster und erstellen Sie ein neues Verzeichnis

Wie konvertiere ich ein MySQL-Abfrageergebnisarray in ein Objekt? Wie konvertiere ich ein MySQL-Abfrageergebnisarray in ein Objekt? Apr 29, 2024 pm 01:09 PM

So konvertieren Sie ein MySQL-Abfrageergebnis-Array in ein Objekt: Erstellen Sie ein leeres Objekt-Array. Durchlaufen Sie das resultierende Array und erstellen Sie für jede Zeile ein neues Objekt. Verwenden Sie eine foreach-Schleife, um die Schlüssel-Wert-Paare jeder Zeile den entsprechenden Eigenschaften des neuen Objekts zuzuweisen. Fügt dem Objektarray ein neues Objekt hinzu. Schließen Sie die Datenbankverbindung.

So erstellen Sie eine MDF-Datei So erstellen Sie eine MDF-Datei Feb 18, 2024 pm 01:36 PM

Die MDF-Datei ist ein gängiges Datenbankdateiformat und eine der Hauptdateien der Microsoft SQL Server-Datenbank. In Datenbankverwaltungssystemen werden MDF-Dateien zum Speichern der Hauptdaten der Datenbank verwendet, einschließlich Tabellen, Indizes, gespeicherter Prozeduren usw. Das Erstellen einer MDF-Datei ist einer der wichtigsten Schritte beim Erstellen einer Datenbank. Im Folgenden werden einige gängige Methoden vorgestellt. Verwenden von SQLServerManagementStudio(SSMS)SQLServerManag

See all articles