JavaScript中產生標識符方式的演變

本文記錄下JS中產生標示符方式的演變，從ES5到ES6，ES5及其之前是一種方式，只包含兩種聲明（var/function），ES6則增加了一些產生標識符的關鍵字，如 let、const、class。

 

一、ES5時代

1. var
2. function

我們知道 JS 不象其它語言 Java、Ruby等，它用來命名變量的只有關鍵字 var，不論何種類型數據都用 var 聲明，當然弱類型並不代表該語言沒有類型，它的類型在運行時（根據不同運算符）會隱式轉換。而其它語言如Java，光聲明數字的關鍵字就有 int、 float、double、long。

// JS
var num1 = 10;      // 整數
var num2 = 10.1;   // 浮點數
var str      = 'John'; // 字符串
var boo     = false;  // 布爾
var obj      = {};    // 對象

 

// Java
int num1      = 10;
double num2   = 10.2; 
String str      = "John";
Boolean boo  = false;

 

JS 里標識符除了使用 var 產生，還有一個 function 關鍵字也可以產生標識符。function 類型聲明的標識符的可能是函數、方法或構造器（類）。

// functions
function fetchData(url, param) {
    // ...  
}

// methods
var obj = {
    getUrl: function() {
    }
};

// class
function Person(name, age) {}
Person.prototype = {
}

 

二、ES6時代

1. var
2. function
3. let
4. const
5. class

可以看到，ES6 增加了3個可以產生標識符的關鍵字 let/const/class。let/const 用來聲明變量，class 用來定義類。

// 定義普通變量
let name = 'John';
for (let i = 0; i < arr.length; i++) {
}
if (boo) {
    let obj = {};
    ...
}

// 定義常量
const PI = 3.1415926;
const $el = $('.nav');

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

ES6時代，可以想象我們的代碼風格里應該是 “少var多let”，let 和 const 都具有塊級作用域，且不會發生變量提升。而聲明類，也都會使用 class 了，class 關鍵字分擔了 function 的部分任務。

 

三、ES7時代

...

 

 

相關：

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/const

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/class