es6で変数を宣言する方法は何ですか

変数を宣言する方法: 1. var コマンドを "var 変数名;" という構文で使用します; 2. function コマンドを使用します; 3. cosnt コマンドを "const 変数名;" という構文で使用します。 4. let コマンドを使用します (構文は "let 変数名" です); 5. import コマンドを使用します; 6. class コマンドを使用します。

このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。

ES5 には変数を宣言する方法が 2 つしかありません。var コマンドと function コマンドです。

ES6 let および const コマンドの追加に加えて、変数を宣言するには 2 つの方法があります。 # コマンドと class コマンド。

つまり、ES6 には変数を宣言する方法が合計 6 つあります。

(1) var コマンド

var a ;　　//undefined
var b = 1;

var で定義された変数は変更可能です。初期化されていない場合は # # 出力されます。 #unknown

, エラーは報告されません
• var で宣言された変数はウィンドウ上にあります。変数を宣言するには let または const を使用してください。この変数はウィンドウ上には配置されません.
多くの言語にはブロック レベルのスコープがありますが、JS にはありません。変数を宣言するために var を使用し、スコープを分割するために関数を使用します。中括弧 "{}" は var のスコープを制限できません。したがって、var で宣言された変数には
• 変数プロモーション
Effect
• var で宣言された変数のスコープはグローバルまたは関数レベルです

(2 )function command

function add(a) {
　　var sum = a + 1;
　　return sum;
}

は、add という名前の新しい変数を宣言し、それに関数定義を割り当てます。

{} の間の内容は add
• に割り当てられます
関数内のコードは実行されませんが、将来の使用のために変数に保存されます
##(3) cosnt コマンド

#

const a;     //报错，必须初始化
const b = 1;

const で定義された変数は変更できないため、初期化する必要があります変数がグローバル変数、またはモジュール内のグローバル変数である

変数が単に宣言時に宣言される 値が一度割り当てられ、コードの他の行で再割り当てされない場合は、const を使用する必要がありますが、変数の初期値は将来調整される可能性があります (定数変数)
読み取り専用定数を作成します。別のブラウザでは変更できないようです。宣言後に変更しないことをお勧めします。スコープはブロック レベルです。
const は値を表します
• constant
• index
、つまり、メモリ内の変数名の
• ポインタは変更できません しかし、この変数を指す 値は変更される可能性があります const で定義された変数は変更できません。通常はモジュールが必要です。一部の グローバル定数
• を使用または定義する場合、グローバル スコープまたは関数内で定数を宣言できます。ただし、 は constants
• を初期化する必要があります。

  Constant は、スコープ内の他の変数または関数と同じ名前を持つことはできません

• ##(4) let コマンド

#

let a;　　//undefined
let b = 1; 
function add(b) {
　　let sum = b + 1;
　　return sum;
}
let c = add(b);

「javascript strict モード」が必要: 'use strict';

変数のプロモーションはありません

• 重複した宣言は許可されません let によって宣言された変数スコープはブロックレベルのドメイン内にあります。関数内で let が定義された後は、影響はありません。関数の外側 (
ブロックレベルのスコープ
• )
• で変数を宣言できます変数に値を代入するとき、デフォルト値は未定義です。変数はスクリプトの後半で使用されます。存続前には使用できません (一時的なデッド ゾーン)
(5) import コマンド

1. ES6 は独自のモジュール システムを導入しています。エクスポート経由でエクスポートし、インポート経由でインポートします。 2. CommonJS とは異なり、モジュールの参照を取得するだけで、実際に使用するまで値は取得されません。 3. たとえば、js の場合:

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

4. app.js では、次のように使用できます:

  import StudentList from './student.js'; //指定名称
  console.log(StudentList[0].name); //xiaoming

(6 ) class コマンド

1: クラスは es6 の糖衣構文であり、実際には es5 で実装できます。

  class Point {
    constructor (x, y) {
      this.x = x;
      this.y = y;
    }
    toString () {
      return this.x + ',' + this.y;
    }
  }

//上面是一个类
  Object.assign(Point.prototype, {
    getX () {
      return this.x;
    },
    getY () {
      return this.y;
    }
  })
  let p1 = new Point(1,2);
  console.log(p1.toString()); //1,2
  console.log(p1.getX()); //1
  console.log(p1.getY()); //2
  console.log(Object.keys(Point.prototype)); // ["getX", "getY"]

メソッド間にカンマ区切りは必要ありません

toString () {} は toString: function () {}
• と同等です

引き続き Point.prototype を使用できます
Object.assign()

• を使用して多くのメソッドを一度に拡張できます
クラス内で定義されているメソッドのほとんどは列挙できません
constructor(){} はデフォルトのメソッドです。追加されていない場合は、空のメソッドが自動的に追加されます。

• 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

• 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高级教程】

以上がes6で変数を宣言する方法は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。