Eingehende Analyse der Verwendung von With

with wird verwendet, um die Gültigkeitsbereichskette einer Anweisung zu erweitern, es wird jedoch im Allgemeinen nicht empfohlen, die with-Anweisung zu verwenden, da sie die Ursache für verwirrende Fehler und Kompatibilitätsprobleme sein kann. Es gibt funktionale Punkte, die die with-Anweisung im Vue-Quellcode verwenden, daher werden ihre Funktionen hier vorgestellt, um das Lesen des Framework-Quellcodes zu erleichtern.

Vor- und Nachteile der Leistung

Vorteile: Die Anweisung with kann die Länge von Variablen reduzieren, ohne dass es zu Leistungseinbußen kommt. Der zusätzliche Rechenaufwand ist minimal. Durch die Verwendung von „with“ können unnötige Operationen zur Zeigerpfadauflösung reduziert werden. Aber in den meisten Fällen kann die Verwendung temporärer Variablen zum Speichern von Zeigern oder die Verwendung von Aufrufen den gleichen Effekt erzielen, auch ohne die Verwendung von with.

Nachteilewith语句可以在不造成性能损失的情況下，减少变量的长度。其造成的附加计算量很少。使用'with'可以减少不必要的指针路径解析运算。但是在大部分情况下，即使不使用with，使用临时变量来保存指针或者使用call，也能达到同样的效果。

弊

with语句使得程序在查找变量值时，都是先在指定的对象中查找。所以那些本来不是这个对象的属性的变量，查找起来将会很慢。

示例

let obj = {
    a: 1,
    b: 2,
    c: 3
}
with(obj){
    console.log(a)    //1
    console.log(b)    //2
    console.log(c)    //3
}

这段代码中，with关联的obj对象，在with代码块中，每个变量都首选被认为是一个局部变量，如果这个局部变量与obj对象的某个属性同名，则这个局部变量会指向obj对象属性。

function fn(obj){
    with(obj){
        a = 1;
    }
}
let obj1 = {
    a: 2
}
let obj2 = {
    b: 3
}

fn(obj1);
console.log(obj1.a)     //1

fn(obj2)
console.log(obj2.a)     //undefined
console.log(a)          //1，变量a被泄漏到全局作用域链上

上例中，obj1存在a属性，obj2没有a属性。fn(obj)接收一个obj形参，是一个对象引用，并执行了with(obj)。在with代码块的内部，对a实际上是一个引用，将1赋值给了a。

当传递obj2给with时，with所声明的作用域就是obj2，从这个作用域下开始对a进行查询。obj2的作用域、fn的作用域和全局作用域中都没有查找到标识符a，因此在非严格模式下会自动在全局作用域创建一个全局变量，而严格模式下则会抛出ReferenceError

Die with-Anweisung bewirkt, dass das Programm bei der Suche nach Variablenwerten zuerst im angegebenen Objekt sucht. Daher ist es sehr langsam, Variablen zu finden, die keine Attribute dieses Objekts sind.

Beispiel

function render () {
  with (this) {
    return _c('p',{on:{"click":change}},[_c('span',[_v(_s(number))]),_v(" "),_c('span',     [_v(_s(name))])])
  }
}

In diesem Code wird jede Variable im With-Codeblock zunächst als lokale Variable betrachtet. Wenn diese lokale Variable denselben Namen wie eine Eigenschaft des Obj-Objekts hat, dann verweisen diese lokalen Variablen auf die Objekteigenschaften von obj. rrreeeIm obigen Beispiel hat obj1 das a-Attribut, obj2 jedoch nicht das a-Attribut. fn(obj) empfängt einen obj-Formalparameter, der eine Objektreferenz ist, und führt ihn mit (obj) aus. Innerhalb des with-Codeblocks ist a tatsächlich eine Referenz und 1 wird a zugewiesen. Bei der Übergabe von obj2 an with ist der von with deklarierte Bereich obj2 und die Abfrage nach a beginnt in diesem Bereich. Der Bezeichner a wird nicht im Bereich von obj2, im Bereich von fn und im globalen Bereich gefunden. Daher wird im

nicht-strikten Modus

automatisch eine globale Variable im globalen Bereich erstellt, während im

streng-Modus

Es wird ein ReferenceError-Fehler ausgegeben.

Leistungsreduzierung

Wenn with im Code verwendet wird, kann die JS-Engine einfach davon ausgehen, dass die Beurteilung des Bezeichners in der

Kompilierungsphase

ungültig ist, da der Compiler das an Who übergebene Scope-Objekt nicht kennen kann Ist. Daher ist die von der JS-Engine während der

Kompilierungsphase

durchgeführte Leistungsoptimierung ungültig. Im schlimmsten Fall werden alle Optimierungen bedeutungslos, wenn mit angezeigt wird. Der einfachste Weg besteht darin, keine Optimierung vorzunehmen, da es dann sehr langsam läuft, was eine unvermeidbare Tatsache sein wird.

With

Vue in Vue generiert beim Kompilieren die entsprechende Renderfunktion aus der Vorlage, und die with-Anweisung wird zufällig in dieser Renderfunktion verwendet. Dem oben Gesagten zufolge wird die Verwendung der with-Anweisung nicht empfohlen. Warum wird sie in Vue verwendet?

Verwandte Empfehlungen: „

vue.js Tutorial“rrreee

Da der Umfang von mit genau dem Umfang der Vorlage übereinstimmt, kann dies den Vorlagenkompilierungsprozess erheblich vereinfachen. Die Codemenge mit ist sehr gering und es ist zuverlässiger, die Bereichsverarbeitung der JS-Engine zu überlassen. Die idealste Situation besteht natürlich darin, die Verwendung von with zu eliminieren. Während der Vorkompilierung wird der durch den ersten Kompilierungsdurchlauf generierte Code automatisch zusätzlich verarbeitet und eine vollständige AST-Analyse verwendet, um den Umfang zu verarbeiten, mit zu entfernen. und unterstützt übrigens die ES6-Grammatik. Mit anderen Worten, wenn Sie Webpack + Vue verwenden, wird der endgültig generierte Code nicht mit. 🔜 Besuchen Sie:

Einführung in die Programmierung

! !

Das obige ist der detaillierte Inhalt vonEingehende Analyse der Verwendung von With. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!