Detaillierte Erläuterung des Löschoperators und interner Attributinstanzen in js

In diesem Artikel werden hauptsächlich die Beispiele für Löschoperatoren und interne Attribute in js ausführlich erläutert. Bevor wir Configurable erklären, schauen wir uns zunächst eine Interviewfrage an:

a = 1;console.log( window.a ); 
// 1console.log( delete window.a ); 
// trueconsole.log( window.a ); 
// undefinedvar b = 2;console.log( window.b ); 
// 2console.log( delete window.b ); 
// falseconsole.log( window.b ); // 2

Wie aus dem Obigen hervorgeht Frage Der Unterschied zwischen den beiden: Wenn eine Variable nicht mit var deklariert wird, kann sie mit dem Schlüsselwort delete gelöscht werden, und der Wert ist beim erneuten Abrufen undefiniert. Wenn eine mit var deklarierte Variable gelöscht wird, kann sie nicht mit delete gelöscht werden , und der Wert bleibt gleich, wenn er erneut erhalten wird. Er ist 2.

1. Löschoperator

Wenn Sie löschen, um eine Variable oder ein Attribut zu löschen, wird „true“ zurückgegeben, wenn der Löschvorgang erfolgreich ist, andernfalls wird „false“ zurückgegeben. Wenn delete wie im obigen Beispiel die Variable a nicht löschen kann, wird false zurückgegeben. Wenn delete die Variable b erfolgreich löschen kann, wird true zurückgegeben.

Zusätzlich zu den beiden oben genannten Situationen gibt es verschiedene andere häufig verwendete Variablen, die gelöscht werden können, und einige, die nicht gelöscht werden können. Machen wir uns keine Gedanken darüber, warum ein solches Ergebnis beim Löschen dieser Variablen auftritt. Hier betrachten wir nur den Rückgabewert:

Löschen Sie eines der Elemente im Löscharray:

// 使用for~in是循环不到的，直接忽略到该元素
// 使用for()可以得到该元素，但是值是undefinedvar arr = [1, 2, 3, 4];console.log( arr );             
// [1, 2, 3, 4]console.log( delete arr[2] );   
// true，删除成功console.log( arr );             
// [1, 2, undefined, 4]

Löschen Sie das Funktionstyp-Variablen:

// chrome 不能删除；火狐可以删除function func(){
}
console.log( func );console.log( delete func );
console.log( func );

Funktion.länge löschen, das ist die Anzahl der zu erhaltenden formalen Parameter:

function func1(a, b){
}console.log( func1.length );       
 // 2console.log( delete func1.length ); 
 // true，删除成功console.log( func1.length );       
  // 0

Gemeinsame Variablen löschen:

console.log( delete NaN );     
 // false，删除失败console.log( delete undefined );
 // falseconsole.log( delete Infinity ); 
 // falseconsole.log( delete null );     
 // true，删除成功

Prototyp löschen, anstatt Attribute auf dem Prototyp zu löschen:

function Person(){
}
Person.prototype.name = "蚊子";console.log( delete Person.prototype );
 // false，无法删除console.log( delete Object.prototype ); 
 // false

Beim Löschen der Länge von Arrays und Strings:

var arr = [1, 2, 3, 4];console.log( arr.length );          
// 4console.log( delete arr.length );   
// false，删除失败console.log( arr.length );          
// 4var str = 'abcdefg';console.log( str.length );         
 // 7console.log( delete str.length );   
 // false，删除失败console.log( str.length );         
  // 7

Beim Löschen von Attributen in obj:

var obj = {name:'wenzi', age:25};console.log( obj.name );       
 // wenziconsole.log( delete obj.name ); 
 // true，删除成功console.log( obj.name );        
 // undefinedconsole.log( obj );             
 // { age:25 }

Wenn Sie Attribute in einem Instanzobjekt löschen, können Sie der folgenden Ausgabe entnehmen, dass beim Löschen von Attributen nur die Attribute des Instanzobjekts selbst gelöscht werden und die Attribute im Prototyp nicht gelöscht werden können Wenn Sie es erneut löschen, kann es nicht gelöscht werden. Wenn Sie die Attribute oder Methoden der Attribute auf dem Prototyp löschen möchten, können Sie nur Person.prototype.name löschen:

function Person(){    this.name = 'wenzi';
}
Person.prototype.name = '蚊子';var student = new Person();console.log( student.name );        
// wenziconsole.log( delete student.name ); 
// true，删除成功console.log( student.name );        
// 蚊子console.log( delete student.name ); 
// trueconsole.log( student.name );       
 // 蚊子console.log( delete Person.prototype.name );
 // true，删除成功console.log( student.name );       
  // undefined

2. Die internen Attribute von js

sind oben. Im Beispiel können einige Variablen oder Attribute erfolgreich gelöscht werden, während andere nicht gelöscht werden können. Was bestimmt also, ob diese Variable oder dieses Attribut gelöscht werden kann?

ECMA-262 5. Edition definiert die Eigenschaften von JS-Objekteigenschaften (wird in JS-Engines verwendet, nicht direkt von außen zugänglich). In ECMAScript gibt es zwei Arten von Eigenschaften: Dateneigenschaften und Zugriffseigenschaften.

2.1 Datenattribut

Ein Datenattribut bezieht sich auf einen Ort, der einen Datenwert enthält, an dem der Wert gelesen oder geschrieben werden kann. Dieses Attribut verfügt über 4 Merkmale, die sein Verhalten beschreiben:

. [[konfigurierbar]]: Gibt an, ob es mit dem Löschoperator gelöscht und neu definiert werden kann oder ob es als Accessor-Attribut geändert werden kann. Der Standardwert ist true;
: Gibt an, ob das Attribut über eine For-In-Schleife zurückgegeben werden kann. Standardwert true;
. [[Beschreibbar]]: Gibt an, ob der Wert des Attributs geändert werden kann. Standardwert true;
. [[Wert]]: Enthält den Datenwert dieses Attributs. Dieser Wert wird gelesen/geschrieben. Der Standardwert ist undefiniert; das Namensattribut ist beispielsweise im obigen Instanzobjekt „Person“ definiert und sein Wert ist „wenzi“. Änderungen an diesem Wert sind ohnehin an dieser Stelle möglich.

Objektattribute (der Standardwert ist true ) können Sie die Methode Object.defineProperty() aufrufen, die drei Parameter empfängt: das Objekt, in dem sich die Eigenschaft befindet, den Eigenschaftsnamen und ein Deskriptorobjekt (muss konfigurierbar, enummerierbar, beschreibbar usw. sein). Wert, es können ein oder mehrere Werte eingestellt werden).

lautet wie folgt:

var person = {};Object.defineProperty(person, 'name', {
    configurable: false,    // 不可删除，且不能修改为访问器属性
    writable: false,        // 不可修改
    value: 'wenzi'          // name的值为wenzi});console.log( person.name);          // wenziconsole.log( delete person.name );  // false，无法删除person.name = 'lily';console.log( person.name );         // wenzi

Es ist ersichtlich, dass weder das Löschen noch das Zurücksetzen des Werts von person.name wirksam wird. Dies liegt daran, dass der Aufruf der Funktion defineProperty die Eigenschaften des Objekts ändert Eigenschaften; es ist erwähnenswert, dass sobald configurable auf „false“ gesetzt ist, Sie „defineProperty“ nicht mehr verwenden können, um es auf „true“ zu ändern (die Ausführung meldet einen Fehler: Uncaught TypeError: Cannot redefine property: name);

2.2 Accessor-Eigenschaft

it Es enthält hauptsächlich ein Paar Getter- und Setter-Funktionen. Beim Lesen des Accessor-Attributs wird der Getter aufgerufen, um einen gültigen Wert zurückzugeben, und beim Schreiben des Accessor-Attributs wird der Setter aufgerufen neuer Wert; dieses Attribut hat die folgenden 4 Eigenschaften:

: Ob das Attribut durch den Löschoperator gelöscht und neu definiert werden kann; kann über eine for-in-Schleife gefunden werden;
: Wird beim Lesen von Eigenschaften automatisch aufgerufen, Standard: undefiniert;

Accessor-Eigenschaften können nicht direkt definiert werden und müssen wie folgt mit defineProperty() definiert werden:

Es gibt jedoch noch eine Sache, die beim Festlegen von Eigenschaften mit dem besondere Aufmerksamkeit erfordert Mit der Object.defineProperty()-Methode können Sie keine Zugriffseigenschaften (Set und Get) und Dateneigenschaften (beschreibbar oder Wert) deklarieren. Das heißt, wenn für eine Eigenschaft ein beschreibbares oder ein Wertattribut festgelegt ist, kann diese Eigenschaft weder get noch set deklarieren und umgekehrt.

var person = {
    _age: 18};Object.defineProperty(person, 'isAdult', {
    Configurable : false,
    get: function () {        if (this._age >= 18) {            return true;
        } else {            return false;
        }
    }
});console.log( person.isAdult );  // true

如若像下面的方式进行定义，访问器属性和数据属性同时存在：

var o = {};Object.defineProperty(o, 'name', {
    value: 'wenzi',
    set: function(name) {
        myName = name;
    },
    get: function() {        return myName;
    }
});

上面的代码看起来貌似是没有什么问题，但是真正执行时会报错，报错如下：

Uncaught TypeError: Invalid property. A property cannot both have accessors and be writable or have a value

对于数据属性，可以取得：configurable,enumberable,writable和value；

对于访问器属性，可以取得：configurable,enumberable,get和set。

由此我们可知：一个变量或属性是否可以被删除，是由其内部属性Configurable进行控制的，若Configurable为true，则该变量或属性可以被删除，否则不能被删除。

可是我们应该怎么获取这个Configurable值呢，总不能用delete试试能不能删除吧。有办法滴！！

2.3 获取内部属性

ES5为我们提供了Object.getOwnPropertyDescriptor(object, property)来获取内部属性。

如：

var person = {name:'wenzi'};var desp = Object.getOwnPropertyDescriptor(person, 'name'); // person中的name属性console.log( desp );    // {value: "wenzi", writable: true, enumerable: true, configurable: true}

通过Object.getOwnPropertyDescriptor(object, property)我们能够获取到4个内部属性，configurable控制着变量或属性是否可被删除。这个例子中，person.name的configurable是true，则说明是可以被删除的：

console.log( person.name );         
// wenziconsole.log( delete person.name );  
// true，删除成功console.log( person.name );         
// undefined

我们再回到最开始的那个面试题：

a = 1;var desp = Object.getOwnPropertyDescriptor(window, 'a');console.log( desp.configurable );   // true，可以删除var b = 2;var desp = Object.getOwnPropertyDescriptor(window, 'b');console.log( desp.configurable );   // false，不能删除

跟我们使用delete操作删除变量时产生的结果是一样的。

相关推荐：

JavaScript delete操作符应用实例_javascript技巧

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Löschoperators und interner Attributinstanzen in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!