Js函数function基础理解

正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法。因此,函数名实际上是指向函数对象的指针,不与某个函数绑定。在常见的两种定义方式(见下文)之外,还有一种定义的方式能更直观的体现出这个概念:

var sum = new Function("num1", "num2", "return num1 + num2"); //不推荐

  Function的构造函数可以接收任意数量的参数,但最后一个参数始终被看做函数体。这种方式有个缺点是,会导致解析两次代码,第一次是基础的ES代码解析,第二次是解析传入构造函数中的字符串,这样会导致性能的下降,在此写出是帮助理解js中函数其实是对象这个概念。

 (一)js函数没有重载的概念

  说到重载的概念,我们来类比Java中的重载是怎么实现的:在Java中,方法是通过方法签名来唯一标识一个方法。方法签名包括:方法名、参数数量、参数顺序和参数类型这几个要素。因此两个方法的方法名相同,而其他签名要素不同,编译器就会认为是两个不同方法,从而可以存在同名的不同方法,以实现重载的概念。(引用:怎么深入理解js中为什么没有重载呢--segmentfault  中manxisuo的回答)。

  而上面我们说过,js中的函数名实际上是指向函数对象的指针,因此函数名可以说是一个函数的唯一标识,跟参数列表并没有关系,因此并不会出现同名的两个函数(因为一个指针同时只能指向一个对象)从而不存在重载的概念。 举个栗子:

function sum(num1, num2){
    return num1 + num2;
}

function sum(num1, num2, num3){
    return num1 + num2 + num3;
}

  上面这种可以换一种写法,会更直观一些:

var sum = function(num1, num2){
    return num1 + num2;
}

sum = function(num1, num2, num3){
    return num1 + num2 + num3;
}

  这样就很明显可以看出,上面一行将sum指向function(num1,num2),而接下来又将sum指向function(num1, num2, num3),从而造成第二次的指向覆盖了第一次的,因此更明显的看出js中并没有重载的概念。

(二)函数声明和函数表达式的区别

  我们知道,常用的定义函数方法有两个:函数声明和函数表达式。

  函数声明,可以说是最常见的定义方法,如下例:

function sum(num1, num2){
    return num1 + num2;
}

  函数表达式,这种定义方式在闭包及一些框架中使用较多,例如angular中常见的$scope.doSomething = function(){...}:

sum = function(num1, num2){
    return num1 + num2;
};

  上述两种定义方法几乎是相同的,但有一点小区别,请看下面这个例子:

//函数声明
alert(sum(100, 100));
function sum(num1, num2){
    return num1 + num2;
}
//函数表达式
alert(sum(100, 100));
var sum = function(num1, num2){
    return num1 + num2;
};

  这两段代码看起来差别不大,只是函数定义的方式不同而已。但事实是,第一段可以正常运行而第二段则会报错。这是因为,在代码开始执行之前,解析器就已经通过一个名为函数声明提升的过程,读取并将函数声明添加到执行环境中。简单来说,解析器会先将函数声明放在源代码树的顶部。而下面那段代码,函数位于一个初始化语句中(并不会将其提升到顶部),简单来说,在执行到这个赋值语句之前,sum并未指向任何一个函数,因此在之前调用函数则会报错。

时间: 2024-11-05 16:25:47

Js函数function基础理解的相关文章

通过原型链解析js函数一些难以理解的的作用域问题

基本原理 js函数在执行时,系统会创建一个隐式的属性scope,scope中存储的是函数的作用域链. 通过对这个scope的分析,就能解释JavaScript中许多难以理解的问题: 例1: function demo(){} demo(); scope属性是在函数执行时创建,如果这个函数是一个全局函数,他的scope里会保存一个Global object和一个activation object. global object保存的是全局的信息,而activition object保存的是函数内部的

JS函数传参理解

我的理解:js函数传递的参数如果是对象,那么他复制的值是地址.于是person的地址复制给了obj,obj.name='Nicholas'就修改了person.name.之后obj又指向了新地址,此时的obj.name和person毫无关系.所以最后的结果person.name='Nicholas';

JavaScript自运行函数(function(){})()的理解

今天打开JQuery源文件(jquery-1.8.3), 看到JQuery的初始化过程是这样的 (function( window, undefined ) {     // .... })( window ); 一开始看不懂这个写法, 经过几番搜索终于明白它的用法以及为什么这样用了, 我们一步步来分析. 1, 首先我们简化这个写法 除去参数, 经过简化后的写法可以写成 (function(){     console.log("Hello World"); })(); 后面都使用这个

js 函数function的几种形式

1 //有的时候我们一直都在使用函数,但是却不知道函数使用的正真含义 2 //其中一个重要的目的是为了提高代码的复用率 3 //其二函数可以传递参数并有返回值 4 //函数声明 5 6 //不带参数,不带返回值 7 function add(){ 8 var arr=Array("大海","小河","山川"); 9 10 for(var i in arr){ 11 console.log(arr[i]); 12 } 13 } 14 15 add(

js 函数Function

1.函数实际上是一个对象typeof functionName→function,通过instanceof判断属于哪个类. 2.函数名实际是一个指针,指向某个函数体. 3.函数内部有两个对象:arguments和this.arguments不光可以指向函数传进去的参数,并且,arguments.callee指向函数,比如函数outer,调用的时候可以写为outer(),此时就可以更改为arguments.callee(); this指的是一个执行环境,比如我们单独调用函数outer,那么此时th

javascript中的立即执行函数(function(){…})()

javascript中的立即执行函数(function(){…})() 深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是用(function(){…})()包住业务代码,使用jquery时比较常见. ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因并非如此.要

js中(function(){…})()立即执行函数写法理解

javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因并非如此.要理解立即执行函数,需要先理解一些函数的基本概念.

100多个基础常用JS函数和语法集合大全

网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法: 1.输出语句:document.write(""); 2.JS中的注释为//3.传统的HTML文档顺序是:document->html->(head,body)4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document)5.得到表单中元素的名称和值:document.getElementById

JS 关于(function( window, undefined ) {})(window)写法的理解【转】

JS 关于(function( window, undefined ) {})(window)写法的理解 [网络整理] (function( window, undefined ) {})(window); 这个,为什么要将window和undefined作为参数传给它? (function( $, undefined ) {})(jQuery); 同理 因为 ecmascript 执行JS代码是从里到外,因此把全局变量window或jQuery对象传进来,就避免了到外层去寻找,提高效率.und