Detailliertes Verständnis der Funktionen in JavaScript (mit Code)

Dieser Artikel vermittelt Ihnen ein detailliertes Verständnis der Funktionen in JavaScript (mit Code). Freunde in Not können darauf verweisen.

Funktion in JavaScript hat mehrere Bedeutungen. Es kann sich um einen Konstruktor handeln, der die Rolle einer Objektvorlage spielt; es kann sich um eine Methode eines Objekts handeln, die für das Senden von Nachrichten an das Objekt verantwortlich ist. Es kann auch eine Funktion sein, ja, es ist eine Funktion, eine Funktion, die unabhängig existiert und ohne Beziehung zum Objekt aufgerufen werden kann.

Aufgrund der Kompromittierung des Sprachdesigners wurden JavaScript einige klassenbezogene Funktionen hinzugefügt, damit JavaScript wie Java aussieht und „objektorientiert“ sein kann. Obwohl JavaScript neu hinzugefügt wurde, gibt es keine Klasse (ES hat sie hinzugefügt). Schließlich übernimmt die Funktion vorübergehend die Aufgabe der Klasse.

Semantik 1: Funktion als Konstruktor

/**
@class Tab
@param nav {string} 页签标题的class
@param content {string} 页面内容的class
**/
function Tab(nav, content) {
 this.nav = nav;
 this.content = content;
}
Tab.prototype.getNav = function() {
 return this.nav;
};
Tab.prototype.setNav = function(nav) {
 this.nav = nav;
};
Tab.prototype.add = function() {
};
// 创建对象
var tab = new Tab('tab-nav', 'tab-content');

Hier wird ein Klassen-Tab definiert und ein Objekt-Tab erstellt. Funktion, this, new werden oben verwendet. Dies sind neue Schlüsselwörter in gängigen objektorientierten Sprachen, und die Funktion spielt hier die Rolle der Klasse in traditionellen objektorientierten Sprachen. Natürlich folgt die Benennung von Bezeichnern zu diesem Zeitpunkt im Allgemeinen der Regel der „Großschreibung des ersten Buchstabens“.

Semantik 2: Funktion als Objektmethode

Da Objekte direkt in JavaScript ohne Klassen erstellt werden können, gibt es zwei Möglichkeiten, Methoden zu Objekten hinzuzufügen. Die erste besteht darin, zuerst die Klasse zu definieren und die Methoden an den Prototyp zu hängen, wie z. B. Tab im obigen Beispiel. Der Prototyp verfügt über die Methoden getNav, setNav und add. Es gibt eine andere Möglichkeit, Methoden direkt innerhalb der Funktion hinzuzufügen.

function Tab(nav, content) {
 this.nav = nav
 this.content = content
 this.getNav = function() {
// ...
}
 this.setNav = function() {
// ...
}
 this.add = function() {
// ...
}
}

Hier ist Tab die Semantik, this.getNav/this.setNav/this.add ist die Semantik als Methode des Objekts. Darüber hinaus können das Objekt und seine Methoden direkt definiert werden

var tab = {
 nav: '',
 content: '',
 getNav: function() {
// ...
},
 setNav: function() {
// ...
},
 add: function() {
// ...
}
}

tab.getNav/tab.setNav/tab.add ist semantisch, als Methode des Objekts tab.
Semantik 3: Als unabhängige Funktion

/*
判断对象是否是一个空对象
@param obj {Object}
@return {boolean}
*/
function isEmpty(obj) {
 for (var a in obj) {
return false
}
 return true
}
// 定义一个模块
~function() {
 // 辅助函数
 function now() {
return (new Date).getTime()
}
 // 模块逻辑...
}();
// 采用CommonJS规范的方式定义一个模块
define(require, exports, moduel) {
 // 辅助函数
 function now() {
return (new Date).getTime()
}
 // 模块逻辑...
})

isEmpty existiert als globale Funktion und existiert jetzt in der Moduldefinition als lokale Funktion Ob isEmpty oder now, die Funktion bezieht sich hier auf a Funktion ist unabhängig von Objekten oder Klassen und kann unabhängig aufgerufen werden.
Semantik 4: Anonymes Funktionsdefinitionsmodul

// 全局命名空间
var RUI = {}
// ajax.js
~function(R) {
 // 辅助函数...
 ajax = {
request: function() {
  // ...
}
getJSON: function() {
  // ...
}
...
}
 // 暴露出模块给 R
 R.ajax = ajax
}(RUI);
// event.js
~function(R) {
 // 辅助函数...
 // 事件模块定义...
 // 暴露出模块给 R
 R.event = event
}(RUI);
// dom.js
~function(R) {
 // 辅助函数...
 // DON模块定义...
 // 暴露出模块给 R
 R.dom = dom
}(RUI);

Die anonyme Funktion stellt das API-Objekt nach der Ausführung der RUI zur Verfügung. Unabhängig davon, wie viel Arbeit in der anonymen Funktion geleistet wird, ist sie außerhalb der entsprechenden Funktion nicht sichtbar Anonyme Funktion Es besteht keine Notwendigkeit, darauf zu achten. Das letzte Problem sind die öffentlichen API-Methoden. Solange Sie die Parameter und die Bedeutung dieser Methoden verstehen, können Sie sie sofort verwenden.

Semantik 5: Anonyme Funktionen verarbeiten bestimmte Spezialeffekte, z. B. die Verarbeitung einiger Daten, ohne zu viele Variablen verfügbar zu machen

// 判断IE版本的hack方式
var IEVersion = function() {
 var undef, v = 
 var p = document.createElement('p')
 var all = p.getElementsByTagName('i')
 while (
p.innerHTML = &#39;<!--[if gt IE &#39; + (++v) + &#39;]><i></i><![endif]-->&#39;,
all[]
);
 return v > ? v : undef
}();

Am Ende gibt es nur eine Ergebnis-IEVersion und einige lokale Variablen, die darin verwendet werden Alle anonymen Funktionen können isoliert verwendet werden. Diese Methode ist für einige temporäre Datenverarbeitungen sehr effektiv und kompakt. [Verwandte Empfehlungen: JavaScript-Video-Tutorial]

Das obige ist der detaillierte Inhalt vonDetailliertes Verständnis der Funktionen in JavaScript (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!