javascript 一些原理解析01

编译原理
在传统编译语言的流程中,程序中的一段源代码在执行之前会经历三个步骤,统称为“编译”。

分词/词法分析(Tokenizing/Lexing)

分词(tokenizing)和词法分析(Lexing)之间的区别是非常微妙、晦涩的, 主要差异在于词法单元的识别是通过有状态还是无状态的方式进行的。简 单来说,如果词法单元生成器在判断 a 是一个独立的词法单元还是其他词法 单元的一部分时,调用的是有状态的解析规则,那么这个过程就被称为词法 分析

例如:

var  a = 12;

这段程序通常会被分解成 为下面这些词法单元:var、a、=、12 、;。
解析/语法分析(Parsing)
这个过程是将词法单元流(数组)转换成一个由元素逐级嵌套所组成的代表了程序语法 结构的树。这个树被称为“抽象语法树” -- 简称AST
AST: AST抽象语法树

代码生成

将 AST 转换为可执行代码的过程称被称为代码生成

指的是源代码语法所对应的树状结构。也就是说,对于一种具体编程语言下的源代码,通过构建语法树的形式将源代码中的语句映射到树中的每一个节点上。

理解编译原理过程
引擎: 从头到尾负责整个 JavaScript 程序的编译及执行过程,
编译器: 负责语法分析及代码生成
作用域: 负责收集并维护由所有声明的标识符(变量)组成的一系列查询,并实施一套非常严格的规则,确定当前执行的代码对这些标识符的访问权限。

理解程序的执行过程

var  a = 12;

如果这是面试题,面试官问我解析这个语句的过程。
我会说,为一个变量 a 分配一个内存,然后将12的值,放到这个变量里面。显然没有毛病,但是面试官可能想听的并不是这个,假如编译器是面试官的话,以上的过程就并不完全正确

var一个变量的时候a,编译器会问作用域,这个变量名称是否存在于作用域中,如果为是的话,编译器会忽略,继续编译,但如果为否的话,编译器会要求作用域,在当前的作用域中声明一个变量命名为a。
赋值过程同样也是相同的道理 a = 12
引擎运行时会首先询问作用域,在当前的作用域集合中是否存在一个叫作 a 的 变量。如果是,引擎就会使用这个变量;如果否,引擎会继续查找该变量
如果引擎最终找到了 a 变量,就会将 12 赋值给它。否则引擎就会举手示意并抛出一个异常!
---2020年12月 总结--
参考地址:
你不知道的JavaScript
https://segmentfault.com/a/1190000016231512
https://blog.csdn.net/zhixingheyi_tian/article/details/80040003

变量

  • 变量必须以字母开头
  • 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
  • 变量名称对大小写敏感(y 和 Y 是不同的变量)

数据类型

值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。
引用数据类型:对象(Object)、数组(Array)、函数(Function)。

变量作用域

var myData = 'Data'; 
myOtherData = 'Data'; 

function myFunction() { 
 var myData = 'OnData'; 
 return myData; 
} 
function myOtherFunction() { 
 myOtherData = 'local'; 
 return myOtherData ; 
}

 console.log(myData);   //   Data
 console.log(myFunction());  //  OnData

console.log(myData); 输出 Data 因为它是一个全局变量
console.log(myFunction()); 输出 OnData 是因为在myFunction函数中声明的本地变量,所以作用域仅在myFunction内

01函数的基础使用

// 基础函数
function sayHello() {
   console.log('Hello!');
}  
sayHello() 
// 函数传参
function outer (hello){
  console.log(hello)
}
outer('hello');

//函数返回值 
function sun (numer1,numer2){
  return numer1+ numer2
}
sun(10,15)

02面向对象编程
JavaScript里的对象就是普通名值对的集合

方式1:

var obj = new Object(); 

方式2:

var obj = {}; 

可以补充创建一个完整的对象

var obj = {
  name:{
    surname:'Zhang',
    names : 'XiaoLun',
  },
  age: 15;
}

对象是类的实例。一个类定义对象的特征,我们可以创造多个类来表示数据结构

// 定义一个对象,并未对象添加对应的类 
function Book (title,conter,about){
  this.title = title,
  this.conter = conter,
  this.about = about,
}
// 实例化这个对象 
var  Book = new Book('title','png','isnotop')
// 对对象进行操作 、
console.log(Book.title); // title
Book.title = 'newTitle';
console.log(BooK.title); // newTitle

------- 最新更新 -------

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章