2.1 Token与Tokenizer

  简单起见,我们使用js代码作为示例,来了解一下js的Token相关内容,以加深对Token的理解,代码如下:

  1. if ( b === true )
  2. alert ( "true" ) ;

  在浏览器中输入网址:http://esprima.org/demo/parse.html 后,并将上述代码黏贴到左侧文本编辑框,然后选择Tokens Tab选项,我们就会获得如下结果:

  1. [
  2. {
  3. "type" : "Keyword" ,
  4. "value" : "if"
  5. } ,
  6. {
  7. "type" : "Punctuator" ,
  8. "value" : "("
  9. } ,
  10. {
  11. "type" : "Identifier" ,
  12. "value" : "b"
  13. } ,
  14. {
  15. "type" : "Punctuator" ,
  16. "value" : ==="
  17. } ,
  18. {
  19. "type" : "Boolean" ,
  20. "value" : "true"
  21. } ,
  22. {
  23. "type" : "Punctuator" ,
  24. "value" : ")"
  25. } ,
  26. {
  27. "type" : "Identifier" ,
  28. "value" : "alert"
  29. } ,
  30. {
  31. "type" : "Punctuator" ,
  32. "value" : "("
  33. } ,
  34. {
  35. "type" : "String" ,
  36. "value": "\"true\""
  37. } ,
  38. {
  39. "type" : "Punctuator" ,
  40. "value" : ")"
  41. } ,
  42. {
  43. "type" : "Punctuator" ,
  44. "value" : ";"
  45. }
  46. ]

  通过上述代码,我们可以看到,esprima(ECMAScript词法语法解析器)会将js源码解析成Token的集合表示,每个Token具有type属性,表示该Token的类型分类,并且具有value属性,表示该Token的值是什么。

  由此可见,Token(标记或记号)就是指一组不可分割的字符或字符串,它能唯一的、没有歧义的标记出一种状态。本质上来说,就是特殊的字符或字符串(例如if、=== 等)。而esprima则是Tokenizer,其作用是将字符串表示的js源码数据读取进来,按照预先设定的标准进行分类处理,处理的结果就是Token。

  事实上esprima是一个ECMAScript解析器,包含词法解析和语法解析,最终会将js源码解析成抽象语法树(Abstract Syntax Tree,简称AST),而在这里,为了演示的原因,我们仅仅使用了esprima的词法解析功能,并没有使用到语法解析功能。