Javascript函数

Javascript函数


定义函数
使用function关键字来定义函数,分为两种形式:
1.声明式函数定义
function add(m,n) {
    alert(m+n);
}

这种方式等同于构造一个Function类的实例的方式:
var add = new Function("m", "n", "alert(m+n);");


2.函数表达式
//将一个匿名函数赋值给变量add
var add = function(m, n) {
	alert(m + n);
};
add(1, 2);//3


//函数表达式作为参数传递给其他函数
var arr = [1, 3, 4, 2];
arr = arr.sort(function(a, b) {
	return a - b;
});
alert(arr);//1,2,3,4


//定义后立即调用
alert( function(m, n) {
	return m + n;
}(1, 2));


//函数表达式也可以定义名称(如用于递归)
var f=function fact(x){
	if(x<1) {
		return 1;
	}else{
		return x*fact(x-1);
	}
};




声明式函数定义和函数表达式的区别
1.声明式函数,定义语句属于顶级作用域范围,函数调用语句可写在函数声明语句之前(意思就是声明式函数是Javascript运行前进行运行环境)
add(1, 2);//3
function add(m, n) {
    alert(m + n);
}


2.函数表达式定义的函数在定义之前无法调用
//TypeError: add is not a function
add(1, 2);
var add = function(m, n) {
    alert(m + n);
};




函数的返回值
1.Javascript中的函数不需要声明返回类型,使用return关键字返回一个值。
2.若函数不包含return语句,或者直接使用"return;",则函数的返回值为undefined。



嵌套函数
function add(m, n) {
    function d(x) {
        return x * 2;
    }

    return d(m) + d(n);
}

alert(add(1, 2));//6




调用函数
1.普通的函数调用
var result = add(1, 2);


2.方法调用
所谓方法就是将一个函数赋给一个对象的属性:
//定义一个函数
function hello(name) {
	alert('hello,' + name);
};
var user = {};

//赋值给user的sayHi属性
user.sayHi = hello;

//方法调用
user.sayHi('张三');



JavaScript函数预编译期与执行期
1.事实上,JS的解析过程分为两个阶段:预编译期(预处理)与执行期。
2.预编译期JS会对本代码块中的所有声明的变量和函数进行处理(类似与C语言的编译),但需要注意的是此时处理
函数的只是声明式函数,而且变量也只是进行了声明但未进行初始化以及赋值。
<script type="text/javascript">
     Fn();  //执行结果:"执行了函数2",同名函数后者会覆盖前者
     function Fn(){ //函数1
        alert("执行了函数1");
     }

     function Fn(){  //函数2
        alert("执行了函数2");
     }
</script>


<script type="text/javascript">
      Fn();  //执行结果:"执行了声明式函数",在预编译期声明函数及被处理了,所以即使Fn()调用函数放在声明函数前也能执行。
      function Fn(){ //声明式函数
         alert("执行了声明式函数");
      }

      var Fn = function(){  //赋值式函数
         alert("执行了赋值式函数");
      }
</script>


//代码块一
<script type="text/javascript">
      alert(str);//浏览器报错,但并没有弹出信息窗
</script>
//代码块二
<script type="text/javascript">
      alert(str); //弹窗"undefined"
      var str = "aaa";
</script>
//js在预处理期对变量进行了声明处理,但是并没有进行初始化与赋值,所以导致代码块二中的变量是unfiened的,而代码一中的变量是完全不存在的,所以浏览器报错。



<script type="text/javascript">
      Fn();  //浏览器报错:"undefined"
</script>
<script type="text/javascript">
      function Fn(){ //函数1
          alert("执行了函数1");
      }
</script>

1.为什么运行上面的代码浏览器会报错呢?声明函数不是会在预处理期就会被处理了吗,怎么还会找不到Fn()函数呢?
其实这是一个理解误点,我们上面说了JS引擎是按照代码块来顺序执行的,其实完整的说应该是按照代码块来进行预处
理和执行的,也就是说预处理的只是执行到的代码块的声明函数和变量,而对于还未加载的代码块,是没法进行预处理
的,这也是边编译边处理的核心所在。



嵌套函数中的this
1.嵌套函数中,内层函数不会继承外层函数的this,即当内层函数作为方法调用时,内层函数的this指向当前调用对象;
2.当内层函数作为函数调用时,this的值为全局对象(非严格模式)或者undefined(严格模式)。
3.怎样在内层函数中访问外层函数的this呢?通常将this保存在一个局部变量中,通过变量来访问。
var obj = {
	f : function() {//作为方法调用
		var self = this;
		console.log(this === obj);//true,this指向当前对象

		f1();//作为函数调用

		function f1() {
		console.log(this === obj);//false,this为全局对象或者undefined
		console.log(self === obj);//true,self指向外层this,即当前对象
		}
	}
};



构造函数调用
1.当使用new关键字创建一个对象时,即调用了构造函数。构造函数若没有形参,可以省略圆括号
var obj = new Object();
//等价于
var obj = new Object;


2.调用构造函数,创建了一个新对象,这个新对象会成为该构造函数的调用上下文(this的值):
function User(name) {
    this.name=name;
    console.debug(this);
}

var user = new User('张三');




call() 和 apply() 间接调用
1.Javascript中函数也是对象,也拥有方法。其中 call() 和 apply() 可以用来间接调用函数。
2.call() 的第一个参数用来指定调用上下文(即this的值),后面的参数是传入调用函数的实参。
var name = 'A';
var user = {
	name : 'B'
};

function showName() {
	alert(this.name);
}

showName();//A,this为全局对象
showName.call(user);//B,this为user对象


apply() 和 call() 类似,区别在于,后面的实参需要以数组的形式传递



参考原文: http://www.admin10000.com/document/3752.html
参考原文: http://www.cnblogs.com/luotaoyeah/p/3823294.html

猜你喜欢

转载自huangyongxing310.iteye.com/blog/2326991