JavaScript基础 函数传参

实参：实际参数（所有的数据类型都可做实参）
形参：形式参数（变量）

function fn( x , y , z ...){   //x,y ...叫形参（变量名）
    alert( 1 );               ===>相当于在函数内部定义了一个变量；
}
fn( 8 );//实参（实际参数）



function fn( x ){
    aleret( x ); 
}
fn( 55 ); //弹出55；把55传给x    x=55;

实参与形参一一对应；

例：

function fn( x , y ){
    alert( x + y );
}

fn( 10 , 20 );  //x = 10  y = 20     弹出：30

fn( 8 , 2 ); //x = 8 y = 2 弹出：10

fn( 2 , 3 ， 4 ); //4没有对应的形参，4不会被传

fn( 2 ) //弹出：NaN  x = 2  y = undefined      x + y 弹出NaN

fn( '2' ) // x = '2'  y = undefined  x + y = 2undefined

例题：

var a = 10;
var b= 20;
function fn(){ //a是形参 a = b  ===> a = 20
    alert( a + b ); //这里b局部（里面）变量，里面没有定义b变量，只能从外部调用，b=20;
}
fn( b ) ===>这里b是变量 b = 20
弹出：40

注意：局部变量可以从全局里调用；
      全局变量不能从局部里调用；

例：

var a = 10;
function fn(){
  alert( a );
  var b = 20; 
}
alert( b );  ==> 调用不了var b = 20; 

解决方法：
      var x ; //定义一个x;
      function fn(){
            var b = 20;
            x = b ;     
      }
      alert( x ); 

全局定义一个变量，然后到局部里赋值；再出来。

var a = 10;
var b= 20;
function fn(){
    alert( a + c ); 
}
报错

注意：
NaN 不会报错是合法数据，只是里面某个地方做了非法的运算；
null 、undefined 、NaN不会报错；是合法的数据；
报错：里面有语法错误；

---

不定参
arguments ==>存储所有实参的集合是个类数组；

例：

function add(){
    alert( arguments[ 2 ] );
}
add( 2 , 5 , 8 );  弹出 8；

想当于：arguments = [ 2 , 5 , 8 ]; 类数组
所以alert( arguments[ 2 ] ) 就会弹出 8

function add( x , y , z ){
      alert( arguments[ 2 ] );
}
add( 2 , 5 , 8 );

这里有 x , y , z 形参不会影响 arguments

案例：
1、点击盒子运行有名函数且要传参数

function fn( b ){
    alert( b );
};
如果这样写：
document.onclick = fn( 2 ); //fn()马上会自执行，没点击之前就马上执行；

解决方法：
document.onclick = function (){
    fn( 2 );
}
//点击的时候才会执行 function (){ fn( 2 ); }

2、传一个函数

function y( x ){
    x();
}
y( function (){ alert(2); } )

这里想当于 y()里的函数当成一个实参传进去 x = function ( ){ alert(2); }
里面的 x( ) 再让函数执行；

function y( x ){
    x( 10 );            a
}
y( function (x){
 alert( x );            b
 } ) ===>弹出 10；

相当于：
y( function (x){            等同于 ==> y(   function ( x ){ alert( x ); }      )
 alert( x );                              把括号里传到 a 函数里
 } )                                      x =  function ( x ){ alert( x ); } 
                                          x( 10 ) 把10传到给 x    就弹出 10                                  

注意： a函数与b函数的x是不一样；a的全局的x；b的是局部里的x；

---

return返回值

返回return后面的数据

例：

function x( ){
    alert( 2 );
}
x()   ===>弹出 2
alert ( x() ) ===>弹出undefined;

所有函数没有return的时候返回都是undefined

function x(){
   alert( 2 );
    return '阿里';
}
alert ( x() ); 弹出 ===> 阿里

return后面是什么返回的就是什么！

例题：

function add(){
    var length = argument.length;
          sum = 0;
      for(var i=0 ; i<length ; i++){
            sum += argument[ i ];
      }
      return sum;
}
var x = add( 3 , 4 , 6 ); ==> 13
var y = add ( 5 , 7 , 8 ); ==> 20

alert( add( x + y) ) ==>弹出 33

---

return阻断 （只对函数起作用）

例：

var x = 10;
(function fn(){
    x++;
    return ; //执行到这里就返回了；下面的代码就不执行；
   x -- ;
})();
alert( x );

例：

var i = 0;
function fn(){
    for( ; i<100 ; i++ ){
            if( i === 50 ){
                 return; //执行到这里的被阻断，下面的i++ 跟for里面的 i++ 都不执行
            }
         i++;
    }   
}
fn();
alert( i );

函数一旦执行到return 就立马结束，后面的代码不会再执行；

例题：

document.onclick = a();
      function a(){
        alert( 1 );
}

为什么没有点击事件；就是因为没有return的时候返回值是undefined，传给document；
解决方法：

document.onclick = a();
      function a(){
          return function (){
                      alert(1);
             }
      }
}

直接返回一个函数给document

document.onclick = a()();

      function a(){  ===>外层
          alert( 1 );
          return function (){   ===>1层
                      alert(2);
                      return function (){ ===>2层
                        alert( 3 );
                      }
                 }
            }
      }  ==>弹出 3 

a()执行完后返回一层

              function (){   ===>1层
                      alert(2);
                      return function (){ ===>2层
                        alert( 3 );
                      }
                 }

a()()再让一层执行 返回的是2层

                function (){ ===>2层
                        alert( 3 );
                      }

最后弹出3；