胖蔡说技术
随便扯扯

ECMAScript 语法基础

JS 是基于ECMAScript语法设计的一个前端开发语言。目前市面上浏览器广泛支持的还是ECMA-256定义的ECMAScript。直至2017后,大多主流浏览器更新支持了第六版ECMAScript语法,该语法新增包、局部变量等概念,提高前端开发的可阅读性和可维护性。本文介绍的JS基础语法即是基于ES6上实现的。

标识符

JS的标识符(变量、函数、属性、参数等名称)的组成字符有着如下几方面的要求:

  • 第一个字符必须是字符(支持大小写)、下划线(_)、美元符号($)其中一类字符开始
  • 从第二个字符开始的其他字符可以是由字母、下划线、美元符或数字组成,标识符中的字母可以扩展为ASCII码和Unicode字符,也就是我们也可以直接用汉语命名,但并不推荐。
  • ECMAScript标识符推荐使用驼峰命令法,但不强制

关键字和保留字

关键字和保留字即语言本身使用的系统命令关键字,如方法使用function来定义命名,变量用var来命名,这些就是ES6中的关键字,而保留字是为了预留给语法后续使用的保留字,所有的关键字和保留字均不可作为标识符来使用, ES6中所有的保留关键字如下:

break do  in typeof case else if instanceof var this const catch export new void 
class extends case return while finally super with continue debugger function throw
yield import debugger default try delete for

保留字如下:

enum  implements package public interface protected static
let private await

变量

ECMAScript中的变量是松散类型的,即变量可以用于保存任何类型的数据,每个变量只是一个用于保存任意值得命名占位符。变量可通过var、let、const来声明。

var

我们可以通过var来声明定义变量,使用格式如下:

var [变量名];
var message = "变量声明";

使用var声明变量,会有如下几个特点:

  • 声明作用域:使用var声明的变量会成为包含它的函数的局部变量,示例代码如下:
function getMessage() {
   var message = "声明作用域";
}
getMessage(); // 可通过geMessage访问message变量,但直接访问message变量就会报错
  • 变量提升:使用var声明可以使用在前、声明在后,程序运行时会自动将变量的声明提升到变量使用之前(需要注意的是只是声明,不包含变量的赋值),其基本使用表现如下:
function  study(){
   console.log("这里会提升变量a:",a); 
   var a = 12;
}
study();   //  这里会提升变量a: undefined

//  等同于
function  study(){
   var  a;
   console.log("这里会提升变量a:",a); 
   a = 12;
}
study(); 

let

let 是ES6新增的关键字,它的使用大致和var一样,使用示例如下:

function study(){
    let a = 2;
    console.log("这里会提升变量a:",a);
}
study();

主要的不同就是:

  • let声明的作用域为块作用域(局部变量)
  • 暂时性死区:let没有变量提升,变量声明前的使用会导致JS引擎的暂时性死区
  • let在全局声明的变量不会成为window对象的属性,var声明会直接挂载在window对象下
  • for循环中使用let可以避免变量渗透的问题

在for中使用var进行定义遍历变量,对于变量内的回调函数而言会存在变量渗透的问题,而let由于是块状作用域,局部作用域,故不存在这个问题,代码如下:

for(var i=0;i<10;i++) {
   eles[i].on('click',function(el){
     // 由于var会挂载在外部方法或者window对象下,会导致i在回调的时候读取的是最新赋值的i,9,let声明i可避免改问题
      console.log('get i:',i);
   })
}

赞(1) 打赏
转载请附上原文出处链接:胖蔡叨叨叨 » ECMAScript 语法基础
分享到: 更多 (0)

请小编喝杯咖啡~

支付宝扫一扫打赏

微信扫一扫打赏