Heim > Web-Frontend > Front-End-Fragen und Antworten > Welche Möglichkeiten gibt es, Variablen in es6 zu deklarieren?

Welche Möglichkeiten gibt es, Variablen in es6 zu deklarieren?

青灯夜游
Freigeben: 2023-01-11 09:19:21
Original
2203 Leute haben es durchsucht

So deklarieren Sie Variablen: 1. Verwenden Sie den Befehl var, die Syntax „var variable name;“ 2. Verwenden Sie den Befehl function, die Syntax „const variable name;“; let-Befehl, die Syntax „let Variablenname“; 5. Verwenden Sie den Import-Befehl. 6. Verwenden Sie den Klassenbefehl.

Welche Möglichkeiten gibt es, Variablen in es6 zu deklarieren?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, ECMAScript Version 6, Dell G3-Computer.

ES5 bietet nur zwei Möglichkeiten, Variablen zu deklarieren: den Befehl var und den Befehl function. var命令和function命令。

ES6 除了添加letconst命令,还有两种声明变量的方法:import命令和class

ES6 Zusätzlich zum Hinzufügen der Befehle let und const gibt es zwei Möglichkeiten, Variablen zu deklarieren: den Befehl import und den Befehl classBefehl.

Es6 bietet also insgesamt 6 Möglichkeiten, Variablen zu deklarieren.

(1) var-Befehl
  • var a ;  //undefined
    var b = 1;
    Nach dem Login kopieren
  • Variablen, die durch var definiert werden, können geändert werden. Wenn sie nicht initialisiert werden, wird
  • undefiniert
  • ausgegeben und es wird kein Fehler gemeldet Verwenden Sie let oder const, um eine Variable zu deklarieren. Viele Sprachen haben keinen Gültigkeitsbereich auf Blockebene Funktion zum Teilen des Bereichs. Geschweifte Klammern „{}“ können den Bereich von var nicht einschränken, daher haben mit var deklarierte Variablen den Effekt einer
  • Der Bereich der von var deklarierten Variablen ist global oder auf Funktionsebene

(2) Funktionsbefehl

function add(a) {
  var sum = a + 1;
  return sum;
}
Nach dem Login kopieren

Eine neue Variable namens „add“ wird deklariert und ihr wird eine Funktionsdefinition zugewiesen ausgeführt, nur zur zukünftigen Verwendung in der Variablen gespeichert. Variablen, die mit dem Befehl
  • (3) const definiert wurden, können nicht geändert werden und müssen initialisiert werden. Die Variable ist eine globale Variable oder eine globale Variable innerhalb des Moduls
  • Wenn eine Variable nur einmal bei der Deklaration zugewiesen wird und in anderen Codezeilen nie neu zugewiesen wird, sollte const verwendet werden, der Anfangswert der Variablen kann jedoch im angepasst werden Zukunft (konstante Variable)

Erstellen Sie eine schreibgeschützte Konstante. Sie scheint in verschiedenen Browsern nicht änderbar zu sein; es wird empfohlen, sie nach der Deklaration nicht zu ändern. const stellt eine Konstante

Index
    dar eines Werts, das heißt, der
  • Zeiger des Variablennamens im Speicher kann nicht geändert werden
  • , aber der
  • Wert, der auf diese Variable zeigt, kann sich ändern
  • const-definierte Variablen können im Allgemeinen nicht geändert werden oder definieren Sie einige
  • globale Konstanten, wenn Sie ein Modul benötigen
  • Sie können Konstanten im globalen Bereich oder innerhalb einer Funktion deklarieren. müssen jedoch initialisiert werdenKonstanteKonstante darf nicht denselben Namen haben wie andere Variablen oder Funktionen in seinem Geltungsbereich
  • (4) let command

    const a;     //报错,必须初始化
    const b = 1;
    Nach dem Login kopieren

  • erfordert „javascript strict mode“:
  • ‘ use strict‘;

  • Es gibt keine Variablenförderung

Wiederholte Deklarationen sind nicht zulässig Der von „let“ deklarierte Variablenbereich befindet sich im Bereich auf Blockebene. Nachdem „let“ innerhalb der Funktion definiert wurde, hat es keine Auswirkungen auf die Außenseite der Funktion (Bereich auf Blockebene )

    Sie können dem einen Wert zuweisen Wenn Sie die Variable deklarieren, ist der Standardwert undefiniert, oder Sie können der Variablen später im Skript einen Wert zuweisen, der nicht vor dem Leben verwendet werden kann (vorübergehende Totzone)
  • (5) Importbefehl
  • 1. ES6 führt ein eigenes Modulsystem ein. Export durch Export und Import durch Import. 2. Anders als bei CommonJS wird die Referenz des Moduls abgerufen, und der Wert wird erst dann tatsächlich abgerufen, wenn es verwendet wird.
  • 3. Zum Beispiel in js:
  • let a;  //undefined
    let b = 1; 
    function add(b) {
      let sum = b + 1;
      return sum;
    }
    let c = add(b);
    Nach dem Login kopieren
4. In app.js können wir es so verwenden:

  let student = [
    {
      name: 'xiaoming',
      age: 21,
    },
    {
      name: 'xiaohong',
      age: 18
    }
  ]
  export default student; // 这种导出方式,你可以在import时指定它的名称。
Nach dem Login kopieren
(6) Klassenbefehl

1: Klasse dient als Syntaxzucker für es6 , tatsächlich es5 Es kann auch erreicht werden.

  import StudentList from './student.js'; //指定名称
  console.log(StudentList[0].name); //xiaoming
Nach dem Login kopieren
  class Point {
    constructor (x, y) {
      this.x = x;
      this.y = y;
    }
    toString () {
      return this.x + ',' + this.y;
    }
  }
Nach dem Login kopieren

Keine Komma-Trennung zwischen Methoden erforderlich

toString () {} entspricht toString: function () {}

Sie können weiterhin Point.prototype verwenden.

  • Sie können Object verwenden. „assign()“ erweitert viele Methoden gleichzeitig. Die meisten in der Klasse definierten Methoden können nicht aufgezählt werden. „constructor(){}“ ist eine Standardmethode. Wenn sie nicht hinzugefügt wird, wird automatisch eine leere Methode hinzugefügt hinzugefügt.

  • constructor默认返回实例对象(this),完全可以指定返回其他的对象。

  • 必须用new调用

  • 不存在变量提升

  • 当用一个变量去接受class时,可以省略classname

  • es6不提供私有方法。

2:使用extends继承

class ThreeDPoint extends Point {
    constructor (x, y, z) {
      console.log(new.target); //ThreeDPoint
      super(x, y);
      this.z = z;
}
    toString () {
      return super.toString() + ',' + this.z;
    }
    static getInfo() {
      console.log('static method');
    }
    get z() {
      return 4;
    }
    set z(value) {
      console.log(value);
    }
}
  ThreeDPoint.getInfo(); // "static method"
  let ta = new ThreeDPoint(2,3,4);
  console.log(ta.toString()); //2,3,4
  console.log(ta.z); // 4
  ta.z = 200; // 200
  console.log(Object.getPrototypeOf(ThreeDPoint)); //Point
Nach dem Login kopieren
  • constructor中必须调用super,因为子类中没有this,必须从父类中继承。

  • 子类的__proto__属性总是指向父类

  • 子类的prototype属性的__proto__总是指向父类的prototype

  • Object.getPrototypeOf()获取父类

  • super作为方法只能在constructor中

  • super作为属性指向父类的prototype.

  • 在constructor中使用super.x = 2,实际上this.x = 2;但是读取super.x时,又变成了父类.prototype.x。

  • 原生构造函数是无法继承的。

  • get set 方法可以对属性的赋值和读取进行拦截

  • (静态方法不能被实例继承。通过static声明

  • 静态属性只能 ThreeDPoint.name = “123” 声明 (与static没什么关系)

【推荐学习:javascript高级教程

Das obige ist der detaillierte Inhalt vonWelche Möglichkeiten gibt es, Variablen in es6 zu deklarieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage