本文记录下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

JavaScript中产生标识符方式的演变的更多相关文章

  1. javascript 中继承实现方式归纳

    转载自:http://sentsin.com/web/1109.html 不同于基于类的编程语言,如 C++ 和 Java,javascript 中的继承方式是基于原型的.同时由于 javascrip ...

  2. javascript中创建对象的方式总结

    javascript中创建对象的方式总结 具体代码如下: //创建对象的方式: //创建方式一 var person=new Object(); person.name='jack'; person. ...

  3. javascript中各种继承方式的优缺点

    javascript中实现继承的方式有很多种,一般都是通过原型链和构造函数来实现.下面对各种实现方式进行分析,总结各自的优缺点. 一 原型继承 let Super = functioin(name = ...

  4. C# 中参数验证方式的演变

    一般在写方法的时候,第一步就是进行参数验证,这也体现了编码者的细心和缜密,但是在很多时候这个过程很枯燥和乏味,比如在拿到一个API设计文档的时候,通常会规定类型参数是否允许为空,如果是字符可能有长度限 ...

  5. 【转载】JavaScript中同名标识符优先级-Snandy

    一,局部变量先使用后声明,不影响外部同名变量 var x = 1; // --> 外部变量x function fn(){ alert(x); // --> undefined 局部变量x ...

  6. javascript中创建对象的方式及优缺点(一)

    1. 简单方式创建对象 // 字面量方式创建对象 var person1 = { name: "xyc", age: 23, sayHi: function() { console ...

  7. 解决JavaScript中使用$.ajax方式提交数组参数

    一般的,可能有些人在一个参数有多个值的情况下,可能以某个字符分隔的形式传递,比如页面上有多个checkbox: $.ajax{ url:"xxxx", data:{ p: &quo ...

  8. javascript中创建对象的方式及优缺点(二)

    一.工厂模式 流程: 定义一个函数,函数返回对象. 适用场景: 需要创建多个对象,都是Object类型. 优点:完成了返回一个对象的要求. 缺点: 对象没有一个具体的类型,无法通过constructo ...

  9. JavaScript中标识符的命名

    JavaScript中的标识符的命名有以下规则: 由字母.数字.$._组成 以字母.$._开头 不可以使用保留字!!! 要有意义!!!!!!! 标识符的命名规范: 1.驼峰命名法 除标识符的第一个单词 ...

随机推荐

  1. php高版本不再使用mysql_connect()来连接数据库

    想用php生成一个mysql数据字典导出来,用到下面代码会 $mysql_conn = mysql_connect ( "$dbserver", "$dbusername ...

  2. Selenium学习笔记之外部化相关测试数据---xml

    我们也可以用xml来定义一个信息更为丰富的UIMap.xml文件,比如,额外还添加控件所属的页,控件的类型,然后解析构建一个XMLParser类来读取相应的值. <?xml version=&q ...

  3. Numeral.js – 格式化和操作数字的 JavaScript 库

    Numeral.js 是一个用于格式化和操作数字的 JavaScript 库.数字可以格式化为货币,百分比,时间,甚至是小数,千位,和缩写格式,功能十分强大.支持包括中文在内的17种语言. 您可能感兴 ...

  4. HTML5 Content Editable实践

    基于此开发文档:https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/Content_Editable 问题:通过contenteditabl ...

  5. Ubuntu 各版本代号简介

    起名字是件伤脑筋的事,但是程序猿们似乎最喜欢干伤脑筋的活.Android 的每个版本都有个甜点的别名,而 Ubuntu ,每个版本都有一个更为特色的名字,这个名字由一个形容词和一个动物名称组成,并且, ...

  6. ThinkPHP3.2 G函数代码及 使用方法

    ThinkPHP3.2 G函数代码及 使用方法 代码: // 内存是否可调用 define('MEMORY_LIMIT_ON',function_exists('memory_get_usage')) ...

  7. javascript对象继承详解

    问题 比如我们有一个"动物"对象的构造函数. function animal() { this.type = '动物'; } 还有一个"猫"对象的构造函数. f ...

  8. Winform 图片鼠标滚动查看(放大,缩小,旋转,拖动查看)[日常随笔]

    方法千千万,我只是其中一笔[通过控制PictureBox来控制图片,图片完全施展在控件中]...几久不做,还真有点陌生! 窗体构造中添加鼠标滚动: /// <summary> /// 窗体 ...

  9. 精通 CSS 选择器

    CSS 选择器除了样式表匹配元素时需要用到,在使用 jQuery 等库的时候也可以利用 CSS 选择器来选择元素,因此作为前端开发需要熟练掌握.下面是一些常用的 CSS 选择器示例. 元素选择器 E, ...

  10. [javascript svg fill stroke stroke-width circle 属性讲解] svg fill stroke stroke-width circle 属性 绘制圆形及引入方式讲解

    <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title ...