arguments、做用域(变量、词法)、变量提高、函数内部this指向、匿名函数和当即执行

01.arguments

1.参数个数不肯定!!!

2.arguments对象

存放函数内部全部的参数数组

arguments.length 记录着所传递参数的个数函数

arguments 存放参数的形式相似于数组,可是arguments不是数组this

arguments 取出里面存放的数据,经过下标,下标是从0开始的。arguments[0];spa

若是把arguments存放的数据所有取出,须要循环遍历!!!code

1.查看arguments对象

function fn(){
   console.log(arguments);
}
fn(2,2,3);

2.获取参数个数索引

function fn(){
  console.log(arguments.length);
}
fn(2,3,32,32);

3.取arguments里面的值(索引,从0开始)token

function fn(){
console.log(arguments[3]);
}
fn(2,3,4,23);

02.arguments练习

1.定义一个加法功能,计算传入的全部数字的和 
function fn(){
var sum = 0;
//循环遍历
for(i = 0 ; i < arguments.length ; i++){
sum += arguments[i];
}
return sum;
}
console.log(fn(1,2,3,4,4,5));
2.定义一个功能getMax,传入任意个数字,返回最大值
function getMax(){
   //假设arguments[0]最大
   var maxNum = arguments[0];
   for(i = 1 ; i < arguments.length ; i++){
       if(maxNum < arguments[i]){
           maxNum = arguments[i];
      }
  }
   return maxNum;
}
console.log(getMax(3,4,24,534,2,2,4));
3.定义一个运算功能,参数为(x,y),当传入1个数字时,求x的阶乘,若是传入两个数字,求x的y次方
function fn(x,y){
   if(arguments.length == 1){
       var product = 1;
       for(i = 1 ; i <= x ; i++){
           product *= i;
      }
       return product;
  }
   return (Math.pow(x,y));
}
//console.log(fn(2));
console.log(fn(3,2));

03.做用域思考

//思考1:
var a = 10;
function fn(){
   console.log(a);   //10
}
fn();

//思考2:
var a = 10;
function fn(){
   var a = 20;
   console.log(a);    //20
}
fn();

//思考3:
var a = 10;
function fn(){
   var a = 20;
   console.log(a);    //20
}
console.log(a);     //10
fn();


//思考4:
function fn(){
   var a = 10;
   console.log(a);           //10
}
fn();
console.log(a);      //a is not defined;

//思考5:
var a = 10;
function fn(){
   console.log(a);     //变量提高了 undefined;
   var a = 20;
   console.log(a);    //20
}
fn();
//执行过程
function fn(){
   var a;
   console.log(a);     //undefined;
   a = 20;
   console.log(a);   //20
}

//思考6
var a = 10;
function outerFn(){
   console.log(a);   //undefined;
   var a = 20;
   function innerFn(){
       var a = 30;
       console.log(a);   //30
  }
   innerFn();
   console.log(a);   //20
}
outerFn();
console.log(a);    //10
//执行过程:
var a = 10;
function outerFn(){
   var a;
   console.log(a);   //undefined;
   a = 20;
   function innerFn(){
       var a = 30;
       console.log(a);   //30
  }
   innerFn();
   console.log(a);    //20
}
outerFn();
console.log(a);   //10

04.变量的做用域

(ES6没有做用域,只有在函数里面的做用域)事件

1.函数的做用域

全局变量作用域

局部变量

2.变量的关系

  1. 写在函数内部的叫作局部变量

  2. 在全局不能访问局部变量

  3. 在局部能访问全局变量

  4. 函数在不调用的时候,局部变量是不存在的

  5. 在函数运行完毕以后,变量被垃圾回收机制回收!

3.做用域链

根据函数内部能访问函数外部变量的这种关系,逐层向外查找变量的过程,叫作变量的做用域链

当前做用域——> 父级做用域 ——>...——>全局做用域 造成的做用域链条

eg:做用域
var a = 10;
function fn1(){
   var a = 20;
   fn2();
   function fn2(){

       // console.log(a);   //20(做用域链,逐层向外查找)

       // var a = 30;   // undefined (变量提高)

       var a = 30;
       console.log(a);   //30

  }
}
// console.log(a);   //10
//console.log(fn1());   //undefined
//console.log(fn2());   //fn2() is not defines;
fn1();

eg:做用域链
var a = 20;
function fn1(){
   var a = 10;
   function fn2(){
       console.log(a);     //10
  }
   fn2();    
}
fn1();
console.log(window.a);    //20

05.词法做用域

1.词法做用域(静态做用域)

做用域:在函数声明过程当中产生

2.动态做用域:

在函数调用的时候产生做用域,动态做用域!

3.js里面函数的做用域:是在声明时候产生的仍是在调用的时候产生的??

在函数声明的时候产生。

4.js的执行环境:

每一个函数的执行都会产生一个执行环境:全局执行环境是外围的执行环境,全局执行环境被认为是window对象,所以全部的全局变量和函数都做为window对象的属性和方法建立的。

eg:
var a = 10;
function fn1(){
   console.log(a);   //10;
}
function fn2(){
   var a = 20;
   fn1();
}
fn2();

06.变量的提高

1.js的解析过程:

  1. 预编译(预解析)

    a:对语法的检测。若是有语法错误,直接报错。(Uncaught SyntaxError: Unexpected token ,)

    b:变量提高

  2. 执行

2.变量提高

  1. 把声明的变量var a;都提高到当前做用域的最顶端

  2. 赋值语句和逻辑语句都不提高,原地等待执行

  3. function关键字声明的函数也会提高到做用域的最顶端

  4. 变量提高的规则:全部用var声明的变量先提高,而后再提高function声明的函数总体。(官方解释:函数的执行权重比较高)

  5. 匿名函数不会被提高

eg:
//第一组
var fn = 10;
function fn(){

}
console.log(fn);    //10;

//执行过程为:
var fn;
function fn(){

}
fn = 10;
console.log(fn);



//第二组:
console.log(a);    //a is not defined;



//第三组:
console.log(a);
var a = 10;     //undefined;

//执行过程为:
var a;
console.log(a);
a = 10;

//第四组
console.log(fn);      
function fn(){

}                 //fn(){}

//执行过程为:
function fn(){

}
console.log(fn);

//第五组:
var fn = 10;
var fn = function(){

}
console.log(fn);   //fn(){}由于fn就将上面的fn覆盖的。

//第六组:
var n = 10;
function test(){
   console.log(n);   //undefined;
   var n = 20;
   console.log(n);   //20
}
test();

box.onclick = function(){

}

07.变量的补充

变量的泄露

eg:
1.window.a = 10;
function fn(){
   window.a = 20;
   console.log(a);      //undefined;   //下面的变量进行变量的提高为,undefined;
   var a = 30;
   console.log(a);      //30
}
fn();
console.log(a);            //20   //变量的泄露window.a = 20 泄露出去覆盖了window.a = 10;

//执行过程为:
window.a = 10;
window.a = 20;
function fn(){
   var a;
   console.log(a);  //undefined;
   a = 20;
   var a =30;
   console.log(a);    //30
}


2.a = 10;
function fn(){
   a = 20;
   console.log(a) ;   //20;   将变量提高到当前做用域最顶端
   a = 30;
   var a = 30;
   console.log(a);   //30
}
fn();
console.log(a);    //10

08.函数的内部this指向

函数里面的this指向:

谁调用函数,this就指向谁!!

事件驱动:给谁绑定事件,this指向谁

function fn(){
   console.log(this);   //window;
}
fn();


// links.onclick = function(){
//     console.log(this);   //<a href="#" id = "links">DSF</a>
// }


// document.onclick = function(){
//     console.log(this);   //document;
// }

09.匿名函数和当即执行

//用括号括起来,而后前面加上分号;
function fn(){}
;(function(){  //加分号,防止影响上面的

})();
相关文章
相关标签/搜索