Dieser Artikel enthält einige fehleranfällige Wissenspunkte, die ich beim Erlernen von JavaScript gesammelt und organisiert habe. Er behandelt den Variablenbereich, den Typvergleich, diesen Zeiger und Funktionsparameter , und Abschluss. Die sechs Aspekte von Problemen, Objektkopieren und Zuweisung werden von der Oberfläche bis in die Tiefe eingeführt und erklärt, sodass jeder die fehleranfälligen Bereiche von JavaScript klar erkennen kann und es uns ermöglicht, JavaScript -Code glücklicher.
JavaScript-Wissenspunkte
1. Variabler Umfang
var a = 1;
function test() {
var a = 2;
console.log(a); // 2
}
test();deklariert und zugewiesen und befindet sich über der Konsole, sodass die Ausgabe a nach dem Proximity-Prinzip gleich 2 ist.
Obwohl a im obigen Funktionsumfang deklariert und zugewiesen wird, befindet es sich unter der Konsole und die a-Variable wird heraufgestuft. Sie wurde deklariert, ihr wurde jedoch während der Ausgabe kein Wert zugewiesen Die Ausgabe ist undefiniert.var a = 1;
function test2() {
console.log(a); // undefined
var a = 2;
}
test2();var a = 1;
function test3() {
console.log(a); // 1
a = 2;
}
test3();let b = 1;
function test4() {
console.log(b); // b is not defined
let b = 2;
}
test4();function test5() {
let a = 1;
{
let a = 2;
}
console.log(a); // 1
}
test5();Vergleichen Sie zwei verschiedene Arrays oben, die Konsole ist falsch.
var arr = [],
arr2 = [1];
console.log(arr === arr2); // falsevar arr = [],
arr2 = [];
console.log(arr === arr2); // falsevar arr = [],
arr2 = {};
console.log(typeof(arr) === typeof(arr2)); // truevar arr = []; console.log(arr instanceof Object); // true console.log(arr instanceof Array); // true
Dies zeigt in der obigen Objektmethode auf das Objekt selbst, sodass Xiaoming ausgegeben wird.
var obj = {
name: 'xiaoming',
getName: function () {
return this.name
}
};
console.log(obj.getName()); // 'xiaoming'var obj = {
myName: 'xiaoming',
getName: function () {
return this.myName
}
};
var nameFn = obj.getName;
console.log(nameFn()); // undefinedvar obj = {
myName: 'xiaoming',
getName: function () {
return this.myName
}
};
var obj2 = {
myName: 'xiaohua'
};
var nameFn = obj.getName;
console.log(nameFn.apply(obj2)); // 'xiaohua'Das Obige verwendet das Argument-Array-Objekt in der Funktion, um das Parameter-Array
function test6() {
console.log(Array.prototype.slice.call(arguments)); // [1, 2]
}
test6(1, 2);übergeben wird , also das Ausgabe-Array[1, 2].
Das Obige verwendet auch Argumente, um Parameter zu erhalten, aber da test7(1, 2) die Funktion nicht im Gegenzug ausführt, gibt es keine Ausgabe. Wenn test7(1, 2)(3, 4) ausgeführt wird, wird [3, 4] ausgegeben.function test7 () {
return function () {
console.log(Array.prototype.slice.call(arguments)); // 未执行到此，无输出
}
}
test7(1, 2);var args = [1, 2];
function test9() {
console.log(Array.prototype.slice.call(arguments)); // [1, 2, 3, 4]
}
Array.prototype.push.call(args, 3, 4);
test9(...args);Das oben genannte ist ein sehr häufiges Schließungsproblem. Klicken Sie auf ein beliebiges Div, um es aufzurufen Der Wert It ist immer 5, denn wenn Sie das Klickereignis auslösen, ist der Wert von i bereits 5. Dies kann auf folgende Weise gelöst werden:
var elem = document.getElementsByTagName('div'); // 如果页面上有5个div
for(var i = 0; i < elem.length; i++) {
elem[i].onclick = function () {
alert(i); // 总是5
};
}var elem = document.getElementsByTagName('div'); // 如果页面上有5个div
for(var i = 0; i < elem.length; i++) {
(function (w) {
elem[w].onclick = function () {
alert(w); // 依次为0,1,2,3,4
};
})(i);
}Oben haben wir das obj-Objekt dem newObj-Objekt zugewiesen und so newObj geändert Das Namensattribut, aber auch das Namensattribut des obj-Objekts wird manipuliert. Dies liegt daran, dass das newObj-Objekt tatsächlich nur eine Speicheradresse und keine echte Kopie erhält, sodass das obj-Objekt manipuliert wird.
var obj = {
name: 'xiaoming',
age: 23
};
var newObj = obj;
newObj.name = 'xiaohua';
console.log(obj.name); // 'xiaohua'
console.log(newObj.name); // 'xiaohua'var obj2 = {
name: 'xiaoming',
age: 23
};
var newObj2 = Object.assign({}, obj2, {color: 'blue'});
newObj2.name = 'xiaohua';
console.log(obj2.name); // 'xiaoming'
console.log(newObj2.name); // 'xiaohua'
console.log(newObj2.color); // 'blue'var obj3 = {
name: 'xiaoming',
age: 23
};
var newObj3 = Object.create(obj3);
newObj3.name = 'xiaohua';
console.log(obj3.name); // 'xiaoming'
console.log(newObj3.name); // 'xiaohua'Das Erlernen von JavaScript ist ein langer Prozess und kann nicht über Nacht erledigt werden. Ich hoffe, dass die in diesem Artikel vorgestellten Punkte den Schülern, die JavaScript lernen, helfen können, ein tieferes Verständnis und eine bessere Beherrschung der JavaScript-Syntax zu erlangen und Umwege zu vermeiden.
Verwandte Empfehlungen:
Instanzanalyse der objektorientierten Javascript-Definitionsmitgliedsmethode
Methoden zur Behandlung von JavaScript-AusnahmenJavaScript-DarstellungsmodusDas obige ist der detaillierte Inhalt vonZusammenstellung von JavaScript-fehleranfälligen Wissenspunkten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
