转载自chaos_JS 的JavaScript中的Function类型浅析

1. Function类型是js中引用类型之一,每个函数实际上都是Function类型的实例对象,具有自己的属性和方法。正因为函数式对象,所以函数名实际上也是一个指向函数对象的指针。

2. 常用的函数定义方式

1. 函数声明:
function sum(a , b ){
  return       a+b;
}

2. 表达式:
var sum = function(){
       return       a+b;
};    //注意分号

 //两种方式的区别: //解释器会率先读取函数声明,并使其在执行之前可以访问,而使用表达式则必须等到解析器执行到它所在的代码行,才会真正被解释执行(变量声明提前,而值留在原地)

alert (sum (10 ,10));function sum(a  ,b){  return a+b;}//↑上面的代码会正常执行,因为在代码执行前,解析器通过函数声明提升,读取并将函数声明添加到执行环境中,放到代码树的顶部
alert (typeof sum);alert(sum(10 , 10));var sum  = function (a  ,b){  return a+b;}//↑报错,原因在于函数位于一个初始化语句中,不是一个函数声明,不会被提前,而只会把var sum提前,用typeof操作符显示sum是undefined,所以报错
 

3. 函数名仅仅保存指向函数对象的指针,因此函数名与包含对象指针的其他变量没什么不同,也就是说,一个函数对象可以有多个名字:

function sum(a , b ){
  return       a+b;
}
console.log(sum(2 ,3));  //5

var anotherSum = sum;     //变量anotherSum也指向了同一个函数对象
console.log(anotherSum(4  , 5));    //9

sum = null;    //sum变量不再保存函数对象的指针了
console.log(anotherSum(1  , 3));    //anotherSum这个变量仍能调用

4. JS为何没有重载这个概念。

function add(a){
  return a+3  ;
}
function add(a){
    return a+5;
}
var result = add(3);    //8

//两个函数同名了,结果只能是后一个函数覆盖前一个,所以不能重载

5. 函数的内部属性:函数内部,有两个特殊的对象,arguments和this

  1. arguments:

    arguments是个类数组对象,包含着传入函数的所有参数,这个对象有一个叫callee的属性,属性值是一个指针,指向拥有这个arguments对象的函数本身

function foo (){
var a =arguments.callee;
return a.toString();
}
foo();
/*返回结果:  "function sum(){
  var a =arguments.callee;
  return a.toString();
  }"也就是说,一个函数内部,arguments.callee指的就是这个函数本身。这个函数在递归调用时有点用,有许多缺陷,在ES5严格模式被移除*/

  2. this:简单来说,this指的就是函数执行的环境对象,在哪个对象中执行,this就指哪个对象。展开来说比较复杂,单开一篇

//TODO:

  3. ES5规范了函数的另一个属性:caller,这个函数属性指的是调用当前函数的函数

function inner(){
      console.log(inner.caller);
}
function outer(){
     inner();
}

outer();
//function outer(){
     inner();
}

  4. length属性:表示函数希望接受的参数个数

function add(a ,b ,c){
    return a+b+c;
}
add.length;    //3

  5. 著名的prototype属性,简单来说,是一个对象,是通过调用构造函数而创建的一个对象,包含可以由特定类型的所有实例共享的属性和方法。展开来说比较复杂,单开一篇

//TODO:

6. 函数的两个方法:call()和apply(),作用都是在特定的作用域中调用函数,实际上就是设置函数内部的this值

  1. call():与apply()方法类似,区别在接收参数的方式不同,参数必须逐个列出来。

  2. apply():接收两个参数,一个是函数运行的作用域,另一个是参数数组,可以是数组,也可以是arguments这个类数组对象

function sum(a , b){
  return   a+b;
}

function callSum(a  ,  b){
    return sum.apply(this , arguments);
}//第二个参数是一个类数组对象arguments

function callSum1(a  , b){
    return sum.apply(this,  [a  , b]);
}    //第二个参数是一个数组
console.log(callSum(2 , 3)); //5
console.log(callSum1(3 ,5));    //8

  3. 传递参数并调用函数并非call()和apply()的用武之地,二者真正强大的地方是扩充函数运行的作用域

var color = ‘red‘;
var obj = {
  color  :‘blue‘
}
function foo(){
  console.log(this.color);
}

foo();    //‘red‘
foo.call(this);//‘red‘
foo.call(obj);    //‘blue‘
//最后一次调用foo()函数的执行环境变了,其中的this指向了obj对象,所以是‘blue‘

   使用call()和apply()扩充作用域的最大好处,就是使对象与方法之间解耦

  4. ES5定义了一个新方法:bind(),返回一个函数,这个函数中this值会被绑定到传给bind()函数的值

var x = 9;
var module = {
  x: 81,
  getX: function() { return this.x; }
};

module.getX(); // 81

var retrieveX = module.getX;
retrieveX(); // 9, 因为在这种情况下, "this" 指向全局变量

var boundGetX = retrieveX.bind(module);//把retrieveX()函数中的this永远与module绑定,再调用这个函数永远都是在module对象中运行
boundGetX(); // 81

时间: 2024-10-03 01:28:44

转载自chaos_JS 的JavaScript中的Function类型浅析的相关文章

JavaScript中的Function类型浅析

1. Function类型是js中引用类型之一,每个函数实际上都是Function类型的实例对象,具有自己的属性和方法.正因为函数式对象,所以函数名实际上也是一个指向函数对象的指针. 2. 常用的函数定义方式 1. 函数声明: function sum(a , b ){ return a+b; } 2. 表达式: var sum = function(){ return a+b; }; //注意分号 //两种方式的区别: //解释器会率先读取函数声明,并使其在执行之前可以访问,而使用表达式则必须

【JavaScript】【学习】3、JavaScript中的function类型

在JavaScript中,函数其实是对象 函数名其实是指向一个函数对象的指针=>将函数名赋值为null,函数依然存在 =>使用布袋括号的函数名是访问函数指针,而不是调用函数 1,函数不会重载,声明两个同名函数,后者会覆盖前者 2,函数声明与函数表达式 函数的两种声明方式: function functionName() {do something} var functionName = new function(){do something}; 两种方式的区别在于在后者之前使用alert(fu

JavaScript中的Function类型

函数实际上是对象,每个函数都是Function类型的实例,定义Function函数的方式如下: 1 //第一种:函数声明 2 function sum(num1,num2){ 3 return num1 + num2; 4 } 5 6 //第二种:函数表达式 7 var sum = function(num1,num2){ 8 return num1 + num2; 9 } 10 11 //第三种:Function构造函数 12 var sum = new Function("num1"

JavaScript中的Function类型总结

1.创建函: 2.没有重载 3.作为值得参数 1)将一个函数作为参数传递给另一个函数 2)将一个一个函数作为另一个函数的结果返回 4.函数的内部属性 1)argument:保存函数参数的类数组对象 2)this对象:引用的是函数据以执行的环境对象 3)caller属性:保存着调用当前函数的函数的引用 5.函数属性和方法 1)length属性:表示函数希望接收的命名参数的个数 2)apply().call():在特定的作用域中调用函数,实际上等于设置函数体内this对象的值. apply():接收

(转)JavaScript中判断对象类型的种种方法

我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串.如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在). 但 type

JavaScript中两种类型的全局对象/函数(转)

转自:http://www.cnblogs.com/snandy/archive/2011/03/19/1988626.html 这里所说的JavaScript指浏览器环境中的包括宿主环境在内的.第一种是ECMAScript Global Object,第二种是宿主环境(Host)下的全局对象/函数. 一.核心JavaScript内置对象,即ECMAScript实现提供的不依赖于宿主环境的对象 这些对象在程序执行之前就已经(实例化)存在了.ECMAScript称为The Global Objec

JavaScript中的Date类型详解与moment简介

关于JavaScript中的Date类型,相信JSer们都不会陌生吧,但是也必然为那个复杂难记的各种转换函数所头疼,本文将分享一下我对JS中的Date类型的一些知识小总结,并把其中容易犯错的地方指出来,同时简介和推广moment.js这个js库,希望大家看完文章后以后在对Date类处理如鱼得水. 1 时间的唯一性与多样性 某一时刻在全世界任何地区应该是唯一的,时区的不同是为了让地球不同时区的人的中午十二点都是太阳正上当头,形成交流上没有那么多障碍.而这一标准就是大家熟知的格林威治标准时间(Gre

JavaScript中的值类型和引用类型

先抛出一个题目,阿里的笔试面试题(很基础,但确实是阿里的笔试题) var a = {"x": 1}; var b = a; a.x = 2; a = {"x": 3}; console.log(b.x); 大家觉得最后在控制台输出的结果是多少? 如果你答案是2,那你就没必要接下去看了.如果不是.那你就接着看下去来解决你的疑惑吧! JavaScript中的值类型和引用类型 在javascript里面有两种变量类型,一种是值类型,一种是引用类型. 值类型:数值.布尔型.

javascript中的Function和Object

写的很好,理解了很多,特此转发记录 转自:http://blog.csdn.net/tom_221x/archive/2010/02/22/5316675.aspx 在JavaScript中所有的对象都继承自Object原型,而Function又充当了对象的构造器,那么Funtion和Object到底有着什麽样的关系呢 ? 首先,一切都是对象. 1 alert(Object instanceof Object); // true 2 alert(Function instanceof Objec