深入了解JavaScript(预编译)

这几天在复习和深入学习JavaScript,天天写后端也写?了,把JS这块在好好的弄一下,再去学习前端的三大框架Vue然后独立做项目。什么时候才是个合格的全栈。。。。本文讲的是JavaScript的预编译。

JS入门

JS入门我觉得 对象、函数、数组、语句块、表达式和运算符、闭包、作用域、以及常的几个方法如:setInterval、setTimeout、对时间能够自由的任意转换、对dom能够轻松的增删改查 ,能简单的写很少的代码实现轮播图,将.json的数据显示到网页的表格上进行展示,能自由的提取json文件的内容,能用XMLHttpRequest发送数据给后端,或者定义个变量data去接受请求后端返回的数据(result) 对获取的数据能够进行拆分,JS原生的fetch和上面叙说的一样。这样我觉得就算是入门了,师傅领进门修行靠自己。

了解原理,修轮子

有多少人是真正的热爱技术,不仅把它学会,能用,而且知道为什么这个方法是这样的,我想很多人都是要用到它所以就去学习，至于原理都是一笔带过。其实包括我自己也是这样的,我后端很多东西都会,但是真让我去说这个接口是怎么实现的,我自己都说不出来。现在我每次不管是写前端代码还是后端的代码,每次看到方法(接口)都会自己点击进去看看内部是长什么样子的,原理也行工作的时候没有用,因为工作的时候是解决问题,但是面试的时候就会问你,比如问你,你知道JS原始类型有几种, typeof null 返回的类型是什么？返回的类型 为什么是object 不是 string。我认为了解语言本身自带的一些方法接口是有用的，当然最大的用处就是可以和别人吹牛逼，你会这个东西,你也了解是如何实现的。

JS预编译

脚本的预编译

一.没有var的变量 都不是变量声明，全部认为是window的全局变量。不参与预编译。
预编译只看声明变量的部分 不看赋值的部分 如下面

var result = aa;

此时会将result 加入window 只截取了 var result;部分 当预编译完成后 才会赋值为aa。

二.在函数中,只有当函数运行完毕时候才执行

test();
function test(){
   a = 22;
}
console.log(a);

如果你不掉test();那么将会报错：

  ReferenceError: a is not defined

三.在脚本中,所有声明的变量,在脚本预编译阶段完成，所有变量的声明与实际书写的位置无关 如下:

    console.log(result);
    var result = 100;
    console.log(result);

这三行代码并不会报错,有人会觉得第一行console.log会报错,但是实际上并不会报错,因为运行的时候会把var result 加入的window中 仅仅是加入,后面的 赋值并没有一起加入进行,此时在声明变量的上方进行输出打印是不会报错的而是输出了undefined,然后再次执行的时候 result 进行赋值操作 =100，下面打印的时候就输出了100。

四. 脚本中 ,所有函数的声明,在脚本的预编译阶段完成,所有变量的声明与实际书写的位置无关如下:

console.log(haha);
function haha(){
  console.log('h1');
}

此时会先去找变量haha是否存在,如果没有再去找函数haha是否存在

五. 在脚本中,如果变量与函数同名,函数会覆盖掉变量如下面

console.log(xixi);
var xixi = 'i like js';
function xixi(){
   console.log('no');
}

说明函数的优先级是高于变量的。如果方法和变量名相同,函数就会覆盖掉变量。
此时打印xixi,函数将会把变量覆盖,此时的打印的xixi是函数的

六. 在脚本中,只有函数能够覆盖变量,变量无法覆盖函数

七.在脚本中 后面的函数声明会覆盖前面的函数声明，并且忽略掉参数如下面

console.log(haha);
haha(1);
function haha(a){
console.log('haha1');
}
function haha(a,b){
  console.log('haha2');
}

JS是没有重载的概念,不想Java、C++其它的语言通过传参确定用的是哪个函数方法，此时打印出来的haha2

函数的预编译

一.在函数中,所有变量声明,在函数预编译阶段完成,所有的变量声明与实际的书写位置无关
二.函数中,所有函数的声明,在函数预编译阶段完成,所有的函数声明与实际的书写位置无关
三.函数中,如果变量与函数同名,那么函数将会覆盖到变量
四.函数中 只有函数能够覆盖变量,变量无法覆盖函数
五.函数中 后面的函数声明会覆盖前面的函数声明,并且 忽略掉参数
六.当函数预编译后,遇到需要访问的变量或者函数,优先考虑自己在AO中定义的变量和函数，如果找不到，才会在其定义的上一层AO(作用域链指Scope)中寻找。 直到 达到GO(window对象)
如下面:

var scope = 'global';
function t (){
      console.log(scope);//undefind
      var scope = 'local';
      console.log(scope);//local
}
t();
console.log(scope);

注意当函数退出的时候会被销毁。