JavaScript作为一种基于对象(非严格面向对象)的语言,函数在JS中的地位非同一般:用函数声明类和对象。甚至函数本身也是对象。

一、函数的三种声明方式辨析。

1.function命令

function printAbc(){

console.log('ABC');

}

2.函数表达式(变量赋值形式)

var printAbc = function (){

console.log('ABC');

};

注意:1、使用函数表达式形式时务必要有分号。

2、此时function后函数名可有可无,且只在函数内部有效

var fname = function abc(){

console.log(abc.name);  /* xxx.name 方法非ECMAScript标准 */

}

fname();   //abc

abc(); //ReferenceError: abc is not defined

这种写法的用处有两个,一是可以在函数体内部调用自身,二是方便除错(除错工具显示函数调用栈时,将显示函数名,而不再显示这里是一个匿名函数)。

3.使用Function构造函数

JS中一切都是对象,声明函数也可以看作构造函数对象。

var f = new Function("a","b","return a+b");

f(1,2);   //3

第1到第N-1个参数是函数参数,第N个参数是函数体。

有些人认为,这种定义方式只有傻逼才会用,因为除了奇葩以外别无好处,但是其实真的是有用的- -。

实现一个在线运行和编辑JS代码的程序:

<html>
<head>
<title>JS Run Online</title>
<script type="text/javascript">
function btnOnclick(){
var getDiv = document.getElementById("TextArea");
var text = getDiv.value;
var f = new Function(text);
f();
}
</script>
</head>
<body>
<div align="center">
<textarea id="TextArea" cols="30" rows="10"></textarea>

<input type="button" value="Run" onclick="btnOnclick()">
</div>
</body>
</html>

这段程序功能看起来简单,但是如果用静态语言将是很难实现的,Function构造函数正是JavaScript是动态语言的有力证明——可以在运行过程中让程序修改程序本身,而动态语言的核心就是:所有参数,包括函数体,都视作字符串。(个人理解,不妥望指正)。

二、函数名的提升。

JS中,使用function命令声明函数是,该声明会被提到代码头部,如:

f();

function f() {};

以上代码并不报错,因为function f() {};被提到了代码头部。

但是,如果采用函数表达式,就是另外一种情况了:

f();

var f = function () {};

// TypeError: undefined is not a function

因为以上代码等同于:

var f;

f();

f = function () {};

当调用f的时候,f只是被声明,还没有被赋值,等于undefined,所以会报错。因此,如果同时采用function命令和赋值语句声明同一个函数,最后总是采用赋值语句的定义。

var f = function (){

console.log('1');

};

function f() {

console.log('2');

}

f();//1

因此,

1、函数若重复声明,则视作只声明了一次,以最后一次声明为准。

2、不能在条件语句中声明函数。

现实情况下,由于浏览器的容错性,条件语句中使用function命令不会报错,但是由于函数名提升,条件语句本身就会无意义:

if (0){

function f() { console.log('1'); }

}

f();//1

3、若确实需要用条件语句生成函数,只可采用函数表达式。

if (xxx){

var f = function (){xxx;};

};

三、函数的参数。

1、length属性。

函数定义时参数的个数。

function f (a,b) {}

console.log(f.length); //2

2、参数的省略。

函数从前向后取用参数,若多余,则后面忽略,若不足,则后面补undefined。若欲省略前面的参数,则应该主动显式传入undefined。

function f(a,b){
return a;
} f(,1) // error
f(undefined,1) // undefined

3、默认值。

可以通过以下方式设置参数默认值:

function f(a){
a = a || 1;
return a;
} f('') // 1
f(0) // 1

缺点是:a不能为0或空字符串,否则函数即使有参数也会使用默认值。

4、函数参数的传递方式。

JS的参数传递方式是值传递,这意味着函数体内修改参数值不会影响到外部:

var a = 1;

function f (a){

a = 2;

}

f(a);

console.log(a);    //1

值得注意的是,对于符合类型的数据,属性值得传递是地址传递:

var o = {a:1};

function f(o){

o.a = 2;

}

f(o);

console.log(o.a);    //2

var a = [6,7,8];

function f(a){

a[0] = 0;

a[1] = 1;

a[2] = 2;

}

f(a);

console.log(a[0],a[1],a[2]); // 0 1 2

利用这个特性,当我么需要对某个变量采用地址传递时,可以将它写成全局对象的一个属性:

var a = 1;

function f(a){

window.a = 2;

}

f(a);

console.log(a);   //2

4、arguments对象

//未完待续

浅谈JavaScript函数的更多相关文章

  1. 浅谈javascript函数节流

    浅谈javascript函数节流 什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等 ...

  2. [转载]浅谈JavaScript函数重载

     原文地址:浅谈JavaScript函数重载 作者:ChessZhang 上个星期四下午,接到了网易的视频面试(前端实习生第二轮技术面试).面了一个多小时,自我感觉面试得很糟糕的,因为问到的很多问题都 ...

  3. [转]浅谈javascript函数劫持

    转自:Ph4nt0m Security Team 这么多年了,现在学习依然还是有很多收货,向前辈致敬.转载一方面是自己存档一份,另一方面是让更多喜欢安全的人一同学习. ================ ...

  4. 浅谈JavaScript 函数作用域当中的“提升”现象

    在JavaScript当中,定义变量通过var操作符+变量名.但是不加 var 操作符,直接赋值也是可以的. 例如 : message = "hello JavaScript ! " ...

  5. 浅谈javascript函数,变量声明及作用域

    javascript函数跟变量的声明.作用域这些概念网上都已经讲烂了. 这里写个博客,也相当于做个笔记. 变量声明 首先看个例子: var globalVar = "gv"; fu ...

  6. 浅谈javascript函数执行过程

    javascript函数执行过程: 1. 为函数创建一个执行环境 2. 复制函数的 [[scopes]] 属性中的对象构建起执行环境的作用链域 3. 创建函数活动对象并推入执行环境作用链域的前端 4. ...

  7. 浅谈JavaScript函数重载

    上个星期四下午,接到了网易的视频面试(前端实习生第二轮技术面试).面了一个多小时,自我感觉面试得很糟糕的,因为问到的很多问题都很难,根本回答不上来.不过那天晚上,还是很惊喜的接到了HR面电话.现在HR ...

  8. 浅谈JavaScript中的闭包

    浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...

  9. 浅谈JavaScript浮点数及其运算

    原文:浅谈JavaScript浮点数及其运算     JavaScript 只有一种数字类型 Number,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的.浮点数的精度问题 ...

随机推荐

  1. gulp的常用api

    gulp是什么? http://gulpjs.com/ 相信你会明白的! 与著名的构建工具grunt相比,有什么优势呢? 易于使用,代码优于配置 高效,不会产生过多的中间文件,减少I/O压力 易于学习 ...

  2. Java-Hibernate官方英文文档地址

    Hibernate官方英文文档地址  http://docs.jboss.org/hibernate/orm/4.3/manual/en-US/html/

  3. IOS常用开源库

    转自:http://www.csdn.net/article/2013-06-18/2815806-GitHub-iOS-open-source-projects-two/1 1. AFNetwork ...

  4. OC - 29.自定义布局实现瀑布流

    概述 瀑布流是电商应用展示商品通常采用的一种方式,如图示例 瀑布流的实现方式,通常有以下几种 通过UITableView实现(不常用) 通过UIScrollView实现(工作量较大) 通过UIColl ...

  5. Java反射学习(java reflect)(二)

    ok之前说了Java的反射和反射分析类,那这些东西有神马作用呢,下面就来说应用: 三.运行时使用反射分析对象 简单写一个Employee类,然后利用JAVA反射去取name域,getDeclareFi ...

  6. Sqoop import加载HBase过程中,遇到Permission denied: user=root, access=WRITE, inode="/user":hdfs:supergroup:drwxr-xr-x

    在执行hbase sqoop抽取的时候,遇到了一个错误,如下图: 在执行程序的过程中,遇到权限问题很正常,也容易让人防不胜防,有问题就想办法解决,这个是关键. 解决办法如下: 第一步:su hdfs, ...

  7. 浅谈 trie树 及其实现

    定义:又称字典树,单词查找树或者前缀树,是一种用于快速检索的多叉树结构, 如英文字母的字典树是一个26叉树,数字的字典树是一个10叉树. 核心思想:是空间换时间.利用字符串的公共前缀来降低查询时间的开 ...

  8. poj 1087.A Plug for UNIX (最大流)

    网络流,关键在建图 建图思路在代码里 /* 最大流SAP 邻接表 思路:基本源于FF方法,给每个顶点设定层次标号,和允许弧. 优化: 1.当前弧优化(重要). 1.每找到以条增广路回退到断点(常数优化 ...

  9. phpcms(4) V9 栏目管理

    phpcms V9框架系统后台管理之栏目管理,请参见下文的源码分析(添加栏目和修改栏目): 参照添加栏目的界面图示,便于对源代码的理解: <?php   // 文件路径:phpcms/modul ...

  10. 《vi中的替换艺术》-linux命令五分钟系列之十一

    vi方面的内容不知道分类到哪里好,就放到<Linux命令五分钟系列>里吧! 今天编程,关于栈的一个小例子,其间我需要把”S.”替换为”S->”(替换不包括双引号). 其实这个不难,不 ...