目录结构
1: VariableDeclaration 的基本结构 1.1: declarations 基本说明 1.1.1: declarations 下 VariableDeclarator 基本说明 1.1.1.1: VariableDeclarator 下的init 详细说明
1、 js 在线ast 演示,结构非常清晰:
https://astexplorer.net/
2、declarations 基本说明:
1.type 说明节点的类型 变量声明为:VariableDeclaration 2.start,end 节点开始位置结束位置 3.kind 变量声明关键字 分为 var let const 4.declarations 描述声明的具体情况,变量的名字,变量的初始化描述都在里面。变量声明最主要的都在里面
1,2,3项比较固定,重点说下4 declarations 变量声明:
declarations 翻译成中文是 声明的意思 里面是个数组结构 正常我们一行声明一个变量,那么数组里面就一个元素
3、demo 效果如下 :
我们随变定义一个变量:a = 1
我们在增加一个变量 :var a=1,b=2; 效果如下
一句话概括: 一个 var、let、const 声明了几个变量,declarations 下面就有几个 VariableDeclarator
VariableDeclarator 翻译成中文就是变量说明符的意思上面的 var a=1,b=2; 就有2个变量说明符,效果可以看下下图,图中变黄的部分
思考: var a=1,b=2,c; 中的c是不是变量说明符,答案当然也是了。
4、declarations 下 VariableDeclarator 说明
VariableDeclarator 包括 type,start,end,id,init
type 就是 VariableDeclarator
start,end 开始位置和结束位置
id: 是个标示符类型 包含类型,位置,name
Identifier 包含 type,start,end,name 字段
5、VariableDeclarator 下 init 基本说明
init 说明该变量初始化的值,就是 = 号右边的值
如果没有初始化,就为null,例如 var a; 中的a的初始化值就是null,见图
例如2:var a = “2”;
例如3:var a = ‘1’;
例如4: var a = true;
例如5:var a = undefined;
例如6 var a = null;
例如7:var a = 1+2;
例如8:var a = b +c;
例如9 var a = {y:1}
例如10 var a = function(){}
init 总结:如果是赋值基本类型中的除undefined以为 ,都是字面量类型literal
以下的都是赋值
1+2,b+c 这种是 BinaryExpression
函数为 FunctionExpression
对象 ObjectExpression
new Object() 为 NewExpression
[] 数组为 ArrayExpression
Math.sin() 为 CallExpression