JavaScript函数介绍

1、函数定义

一、函数声明

//函数声明
function add1(i,j){
	return i+j;
};

二、函数表达式

//函数表达式
var add2 = function(i,j){
	return i+j;
};

三、对象实例化(通常不使用)

//对象实例化(通常不使用)
var add3 = new Function('i','j','return (i+j)');

2、函数声明与对象实例化、函数表达式的区别

一、函数声明能够在函数声明以前调用。  而对象实例化、函数表达式只能在定义以后才能调用。

add1(1,1);
//函数声明
function add1(i,j){
	return i+j;
};

//函数表达式
var add2 = function(i,j){
	return i+j;
};

add2(1,2);

//对象实例化(通常不使用)
var add3 = new Function('i','j','return (i+j)');
add2(1,3);

二、对象实例化:函数没法访问到父函数变量,经过对象实例化定义的全部函数都在window对象上。

//函数声明
(function(){
	var i  = 10;
	function add(j){
		console.log(i+j);		//11
		//debugger;
	};
	add(1);
	console.dir(add); //
})();

//函数实例化
//对象实例化:add函数没法访问到父函数i变量,经过对象实例化定义的全部函数都在window对象上
(function(){
	var i  = 10;
	var add = new Function('j','console.log(i+j);debugger;'); //报错
	add(1);
})();

3、构造函数

4、构造函数与普通函数的区别

一、本质上没有区别。
二、构造函数一般会有this指定实例属性,原型对象上一般有一些公共方法。
三、构造函数命名一般首字母大写。javascript

5、函数调用

一、构造函数调用模式

//构造函数
function Car(type,color){
 this.type = type;
 this.color = color;
 this.status = "stop";
 this.light = "off";
}
Car.prototype.start = function(){
 this.status = "driving";
 this.light = "on";
 console.log(this.type + " is " + this.status);
}
Car.prototype.stop = function(){
 this.status = "stop";
 this.light = "off";
  console.log(this.type + " is " + this.status);
} 
var audi = new Car("audi", "silver");//this === audi;
var benz = new Car("benz", "black");//this === benz;
var ferrari = new Car("ferrari", "yellow");;//this === ferrari;

二、方法调用模式(作为对象属性的方式调用)

audi.start(); 	//this === audi;

三、函数调用模式(函数内的子函数的this指向window)

function add(i, j){
	return i+j;
};
var myNumber = {
	value: 1,
	double: function(){
		var helper = function(){
			this.value = add(this.value,this.value);  //错误
            console.log(this === window); //true

	    }
		helper();
	}
};

//闭包里保存myNumber(this)对象做用域来解决
var myNumber = {
	value: 1,
	double: function(){
		var that = this;
		var helper = function(){
			that.value = add(that.value,that.value);
	    }
		helper();
	}
};
myNumber.double();

四、apply(call)调用模式

4.一、Function.prototype.apply:函数借用

function Point(x,y){
	this.x = x;
	this.y = y;
};

Point.prototype.move = function(){
	this.x+=x;
	this.y+=y;
};

var p = new Point(0,0);

p.move(2,2);		//p.x = 2;p.y = 2;

var circle = {x:1,y:1,r:1};

//传入对象引用,参数数组
p.move.apply(circle,[2,3]);	//circle = {x:3,y:4,r:1};
p.move.call(circle,2,3);	//circle = {x:3,y:4,r:1};

4.二、Function.prototype.bind:函数借用,返回引用,用户自定义调用函数时机。

//对象引用,参数列表
var circlemove = p.move.bind(circle,2,1);
//延迟1秒调用
setTimeout(circlemove,1000);

4.三、为何JS中须要apply?若是JS中没有apply须要多作哪些工做呢?

6、函数内部参数:arguments

arguments是函数内部(Array-like)类数组的对象。能够经过arguments[index]得到传入的参数,arguments.length来获取传入的参数长度。java

//arguemnts转数组
function add(i,j){
	var args = Array.prototype.slice.apply(arguments);
	args.forEach(function(item){
		console.log(item);
	});
};
add(1,2,3);

一、arguments.callee

指向函数自己。能够实现匿名函数递归调用。数组

//arguments.callee使用
console.log(
 (function(i){
    if (i==0) {
       return 1;
     }
     return i*arguments.callee(i-1);
 })(5) );
// 递归
function factorial(i){
  if (i==0) {
    return 1;
  }
  return i*factorial(i-1);
}

7、闭包

一、介绍

函数内部调用一个函数,内部函数引用了父函数的变量,父函数做用域就会放在闭包做用域里面供内部函数使用。闭包

function(){
	var a = 0;
	function b(){
		a = 1;
		debugger;
	}
	b();
}();

二、应用场景:

1.封装、属性隐藏app

2.模块化异步

3.记忆函数模块化

三、闭包实现记忆函数(减小函数的计算量)

// 普通递归函数跟记忆函数调用次数对比
 var factorial = (function(){
   var count = 0;
   var fac = function(i){
     count++;
     if (i==0) {
       console.log('调用次数:' + count); 
       return 1;
     }
     return i*factorial(i-1);
   }
   return fac;
 })();
 for(var i=0;i<=10;i++){
   console.log(factorial(i)); 
 }

 // 记忆函数
 var factorial = (function(){
   var memo = [1];
   var count = 0;
   var fac = function(i){
     count++;
     var result = memo[i];
     if(typeof result === 'number'){
       console.log('调用次数:' + count); 
       return result;
     } 
     result = i*fac(i-1);
     memo[i] = result;
     return result;
   }
   return fac;
 })();
 for(var i=0;i<=10;i++){
   console.log(factorial(i)); 
 }

8、First-class function 一等公民

一、函数使用方式

1.普通变量保存函数

2.参数传递this

3.返回值返回spa

二、利用函数的灵活特性实现函数科里化

function add(value){
    var helper = function(next){
       value = typeof(value)==="undefined"?next:value+next;
       return helper;
    }
    helper.valueOf = function(){
      return value;
    }
   return helper;
};
add(2)(3)(5).valueOf();//10

三、利用函数的灵活特性实现函数异步回调

相关文章
相关标签/搜索