深入了解JavaScript(预编译)

你的名字 2021-01-18 13:37 670阅读 0赞

# 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);

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