1.预解释
- 为何学习预解释：
- 可以明白同一段代码，在不同的环境下，结果不一样；
- 带var和不带var是有区别的；（变量和window全局属性）
- 变态面试题
- 预解释：在当前作用域下，在JS代码执行之前，浏览器会对带var和带function，进行提前声明和定义；
- 带var和带function的声明和定义不同：
- 带var的，只声明，不定义；
- 带function，声明+定义；
- 函数定义三步：
- 在堆内存中开辟一个新的空间地址；
- 把函数内部的JS代码，作为字符串存储到空间地址中；
- 将空间地址赋给函数名，存放在栈内存中；
- 函数的调用四步：
- 新建一个私有作用域，与堆内存中的空间地址进行对应；
- 形参赋值；
- 对函数内部的var进行预解释；
- 将堆内存中的字符串转化为JS代码进行执行，执行顺序按照由上及下执行；
- 栈内存供给JS代码执行的环境；堆内存用于存储数据；
- 上级作用域：
- 定义：上级作用域指的是，私有作用域对应的堆内存地址的开辟空间位置；
- 上级作用域跟函数在哪里调用无关，只跟函数对应的堆内址在哪里开辟有关；
- 实例1
<script>
var a=12;
function fn() {
alert(a);//因为函数体内没有带var，所以没有预解释，由上而下执行；执行此代码时，私有作用域还没a，所以去上级作用域中找a,a为12；所以结果弹出12；
a=15;//由于在自己私有作用域中，未声明a,则私有作用域中找不到a，只能去它的上级作用域中寻找a，给上级作用域中a赋值为15，所以就改变全局作用域中a的值；
alert(a);//先从自己私有作用域中查找a的值，自己作用域中也没有a,所以去上级作用域中找a,即a为15，所以会弹出15；
}
fn();
alert(a);//由于fn函数执行后，将a的值改变为15，所以会弹出15；
</script>
- 进行对比
<script>
var a=12;
function fn() {
alert(a);//输出结果为undefined;因为在执行fn中的代码时，先进行预解释，即声明var a;但是在执行此行代码时，还未赋值，所以为undefined；
var a=15;//给自己函数内的a定义，赋值为15；
alert(a);//在自己私有作用域中查找a,得到的结果为15；
}
fn();
alert(a);//在自己的作用域中查找a,得到的值为12;
</script>
- 实例2
<body>
<input type="button" value="按钮1"/>
<input type="button" value="按钮2"/>
<input type="button" value="按钮3"/>
<input type="button" value="按钮4"/>
<script>
//需求：当点击其中一个按钮时，让所有的按钮变成红色
var ainput=document.getElementsByTagName("input");
for(var i=0;i<ainput.length; i++){
ainput[i].onclick=function () {
alert(i);//在执行js代码时，会先对里面的var进行预解释；此时var i;所以在执行代码时，由上及下，此时自己私有作用域中存在i，所以弹出i,未赋值，则弹出undefined;
for(var i=0; i<ainput.length; i++){
ainput[i].style.backgroundColor="red";
}
}
}
//第二种，验证代码；
var ainput=document.getElementsByTagName("input");
for(var i=0;i<ainput.length; i++){
ainput[i].onclick=function () {
alert(i);//在执行js代码时，会先对里面的var进行预解释；此时for循环中没有var,所以，当执行此代码时，私有作用域中没有i,则要向其上级公共作用域中寻找，则找到i为4；
for(i=0; i<ainput.length; i++){//执行完alert代码后，在执行for循环，此时i会被不断地赋值；
ainput[i].style.backgroundColor="red";
}
}
}
</script>
</body>
- 作用域链：
- 当函数被调用的时候，会形成一个私有作用域；在这个私有作用域中查找是否有私有变量a；
- 如果存在私有变量a：那么整个函数体内的所有a都是私有变量，跟外界没有任何关系；
- 如果没有私有变量a：去上级作用域找，找不到，继续往上级找，如果找到window还没有的话，会报错，即xxx is not defined;
- 当函数被调用的时候，会形成一个私有作用域；在这个私有作用域中查找是否有私有变量a；
- 私有变量主要有两种：
- 函数体内带var的；
- 形参；
- 实例：
var a=12;
function fn(a){
//执行函数后第一步形参赋值，相当于声明+定义，即var a=6;所以a赋值为6；
alert(a);//js代码从上往下依次执行代码，在自己私有作用域中查找a，得到6；
a=15;//给自己私有作用域中的a重新赋值；
alert(a);//查找自已的a，得到15；
}
fn(6);
alert(a);//自己作用域中的a，未变化，所以弹出12；
- 对比
var a=12;
function fn(a){
//执行函数后第一步形参赋值，相当于声明+定义，即var a=6;所以a赋值为6；
//第二步，进行预解释，var a;注意，当a已经声明的情况下，不再重新声明；所以此处的a仍然为6;
alert(a);//js代码从上往下依次执行代码，在自己私有作用域中查找a，得到6，而不是undefined;
var a=15;//到达此不，执行赋值，给自己私有作用域中的a重新赋值为15；
alert(a);//查找自已的a，得到15；
}
fn(6);
alert(a);//自己作用域中的a，未变化，所以弹出12；
2.内存及内存释放
- 内存包含：堆内存和栈内存；
- 堆内存：用来存放数据的；
- 对象数据类型的
- 存放的是键值对:key=value;
- 函数数据类型的
- 代码字符串；
- 对象数据类型的
- 堆内存的释放：
- 如var a=[1,2,3,4]；释放：a=null;
- 栈内存：本身提供了一个供JS代码执行的环境；
- 包含：全局作用域和私有作用域
- 全局作用域的形成和释放（销毁）
- 形成：当一个页面被浏览器加载完成的时候，全局作用域就形成了；
- 释放（销毁）：1）关闭页面 2）关闭浏览器
- 私有作用域的形成和释放（销毁）
- 形成：当函数被调用的时候，会形成私有作用域；
- 释放（销毁）：
- 一般情况下，当函数执行完成的时候，默认就被销毁了；
- 特殊的两种情况下，不销毁：
- 不销毁：当函数体内的东西被外面的变量或者其他占用的话，就不销毁；
- 不立即销毁：当函数执行完成后，会返回一个函数，被返回的函数还需要再执行一次；只有所有的调用都完成的时候，函数才会销毁；
//不立即销毁 <script> function fn(){ var a=12; alert(a); return function(){ var b=5; alert(b); } } fn()();//必须等两个函数全部执行完，原来的函数才销毁； </script> //不销毁 <script> var a=null; function fn(){ return [1,2,3,4]; } a=fn();//此时由于函数本身赋值给变量，所以被占用，不销毁；当给a在赋值为null后，函数的私有作用域才会销毁； </script>
3.实战题解读
- 基本数据类型，是对值的引用，引用数据类型是对地址的引用；
- 引用数据类型
- 对象数据类型：地址中存的是键值对；
- 函数数据类型：地址中存的是字符串；
- 等号：是用来赋值的；
- 实战题1：基本数据类型
<script>
//重点：基本数据类型，此处12为Number类型；是对值的引用；
var a=12;
function fn(a) {
//第一步，形参赋值，为数值12；即：var a=12;
alert(a);//结果是12
a=15;//对a重新赋值为15；
alert(a);//弹出15；
}
fn(a);
alert(a);//由于函数本身有声明并定义了a，所以不会影响全局变量中的a；则弹出结果为12；
</script>
- 实战题2：引用数据类型
<script>
var a=[10,20,30,40];
function fn(a){
a[0]=100;
console.log(a);//结果为[100,20,30,40]
a=[];
a[a.length]=200;
console.log(a);//结果为[200]
}
fn(a);
console.log(a);//结果为[100,20,30,40]
</script>
这是分析图
