JavaScript中Function详解


Posted in Javascript onFebruary 27, 2015

关键字function用来定义函数。

//函数声明式定义:

function funcname([arg1[,args[...,argn]]]){

 statements 

}

//函数表达式定义:

var funcname = function ([arg1[,args[...,argn]]]){

 statements 

};

注意,function语句里的花括号是必需的,即使函数体只包含一条语句。

在JavaScript中,函数是Function类的具体实例。而且都与其它引用类型一样具有属性和方法。

函数名实际上是指向函数对象的指针,函数可以作为参数参与到传参和返回值中。

函数的对象特性

因为函数是Function的实例,而函数名仅仅是该实例的一个引用地址。因此可以作为参数和返回值参与到函数的传参过程中。

function call_some_function(some_function, some_argument) {

    return some_function(some_argument);

}

function add_10(num) {

    return num + 10;

}

console.log(call_some_function(add_10,20)); //30

函数的内部属性

arguments | this
•arguments对象中保存着传递给函数的参数
•arguments.length返回传入参数的个数
•Note: length属性表示函数定义时候默认接收的参数数量。arguments.length表示函数实际执行时接收的参数数量。

function test_arguments() {

    if (arguments.length == 2) {

        console.log(arguments.length); 

        console.log(arguments); 

    } else {

        console.log(arguments.length); 

        console.log(arguments); 

        arguments.callee(4, 5);

    };

}(1, 2, 3)

/**

 3

{ '0': 1, '1': 2, '2': 3 }

2

{ '0': 4, '1': 5 }

 **/

•arguments.callee()主要用在递归函数中调用函数自身的情境中。js和别的语言不同在于函数名只是一个指针,可以随时变化,函数中利用函数名来调用自身属于高耦合,可能会出现问题,而arguments.callee()调用自身就会规避掉这个问题

function factorial(num) {

    if (num <= 1) {

        return 1;

    } else {

        return num * factorial(num - 1);

    };

}

function callee_f(num) {

    if (num <= 1) {

        return 1;

    } else {

        return num * arguments.callee(num - 1);

    };

}

factorial(10); //运行正常

f = factorial;

factorial = null;

f(10); //error

callee_f(10); //运行正常

f = callee_f;

callee_f = null;

f(10); //运行正常

•this主要用来帮助函数引用函数所处作用域中的对象。

var color = 'red';

function syaColor() {

    console.log(this.color);

}

syaColor(); //red

var o = new Object();

o.color = 'blue';

o.sayColor = sayColor;

o.sayColor(); //blue

call()和apply()

call()和apply()是每个函数都包含的自有方法。之前已经提到了函数是定义的对象,那么调用函数时候,函数中的this是对当前与下变量的调用。而如果想改变函数执行所在域空间,则可以使用call()和apply()来实现。

color = 'red';

var o = {color: 'blue'};

function sayColor() {

    console.log(this.color);

}

sayColor(); //red

sayColor.call(this); //red

sayColor.call(o); //blue

app()和call()的作用是相同的,区别主要在于传入参数的不同。

call(this,para1,prar2,prar3) 第一个参数是函数要执行的作用域,后面的参数是函数的输入参数,有多少个依次写多少个。

apply(this,[para1,para2,prara3])第一个参数也是函数要执行的作用域,后面是一个Array的数组对象。

使用call()/apply()来扩充作用域最大的好处是对象和方法的解耦。

内置对象

Global对象可以理解成最外层的对象,所有的对象,以及不属于其它对象的属性和方法都被包含在Global对象中。
* isNaN(x) 用来检查参数x是否为数字。如果为数字返回false,否则返回true
* isFinite(x) 用来检查参数x是否为无穷大/小,如果是无穷大/小,则返回true
* parseInt(x) 用来解析字符串并返回整数
* parseFloat(x) 用来解析字符串并返回浮点数
* encodeURI()和encodeURIComponent()会对字符串进行特殊的UTF-8编码,规避一些特殊字符来让浏览器能够读懂。他俩的区别主要在于encodeURI()不会对本身属于URI的特殊字符进行编码,而encodeURIComponent()会对其发现的所有非标准字符进行编码。

var uri = "http://www.wrox.com/illegal value.htm#start";

//http://www.wrox.com/illegal%20value.htm#start

console.log(encodeURI(uri))

//http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start

console.log(encodeURIComponent(uri))

•对应的解码函数为decodeURI()和decodeURIComponent()
•eval(script) 用来将script的内容在解释器中执行并返回对应的结果。非常强大!

Note:在浏览器中,windows对象封装了Global对象,并承担了很多额外的任务和功能。

Math对象为另一个内置对象。为JavaScript提供了数学计算功能。

以上就是本文的全部内容了,希望小伙伴们能够喜欢,能够对大家有所帮助。

Javascript 相关文章推荐
textContent在Firefox下与innerText等效的属性
May 12 Javascript
TreeView 用法(有代码)(asp.net)
Jul 15 Javascript
Jquery的hover方法让鼠标经过li时背景变色
Sep 06 Javascript
用IE重起计算机或者关机的示例代码
Mar 10 Javascript
js中的setInterval和setTimeout使用实例
May 09 Javascript
javascript关于继承的用法汇总
Dec 20 Javascript
javascript设置和获取cookie的方法实例详解
Jan 05 Javascript
Bootstrap进度条与AJAX后端数据传递结合使用实例详解
Apr 23 Javascript
学习使用Bootstrap页面排版样式
May 11 Javascript
js 两个日期比较相差多少天的实例
Oct 19 Javascript
antd-mobile ListView长列表的数据更新遇到的坑
Apr 08 Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
Nov 27 Vue.js
JS实现图片产生波纹一样flash效果的方法
Feb 27 #Javascript
js实现鼠标触发图片抖动效果的方法
Feb 27 #Javascript
javascript实现当前页导航激活的方法
Feb 27 #Javascript
jquery 根据name名获取元素的value值
Feb 27 #Javascript
jQuery使用元素属性attr赋值详解
Feb 27 #Javascript
jquery实现公告翻滚效果
Feb 27 #Javascript
JS+CSS实现淡入式焦点图片幻灯切换效果的方法
Feb 26 #Javascript
You might like
phplock(php进程锁) v1.0 beta1
2009/11/24 PHP
php将数据库中所有内容生成静态html文档的代码
2010/04/12 PHP
php数据库连接时容易出错的特殊符号问题
2010/09/01 PHP
深入解读php中关于抽象(abstract)类和抽象方法的问题分析
2014/01/03 PHP
yii2项目实战之restful api授权验证详解
2017/05/20 PHP
编写兼容IE和FireFox的脚本
2009/05/18 Javascript
JQuery小知识
2010/10/15 Javascript
javascript面向对象之定义成员方法实例分析
2015/01/13 Javascript
分享我的jquery实现下拉菜单心的
2015/11/29 Javascript
Node.js实现JS文件合并小工具
2016/02/02 Javascript
JS正则表达式修饰符中multiline(/m)用法分析
2016/12/27 Javascript
Bootstrap超大屏幕的实现代码
2017/03/22 Javascript
不得不看之JavaScript构造函数及new运算符
2017/08/21 Javascript
一篇文章,教你学会Vue CLI 插件开发
2019/04/17 Javascript
小程序实现搜索界面 小程序实现推荐搜索列表效果
2019/05/18 Javascript
JS回调函数 callback的理解与使用案例分析
2019/09/09 Javascript
layui layer select 选择被遮挡的解决方法
2019/09/21 Javascript
node.js express框架实现文件上传与下载功能实例详解
2019/10/15 Javascript
[02:29]大剑、皮鞭、女装,这届DOTA2勇士令状里都有
2020/07/17 DOTA
Python 文件和输入输出小结
2013/10/09 Python
python标准算法实现数组全排列的方法
2015/03/17 Python
详解Python 函数如何重载?
2019/04/23 Python
Pytorch自己加载单通道图片用作数据集训练的实例
2020/01/18 Python
python梯度下降算法的实现
2020/02/24 Python
Django多层嵌套ManyToMany字段ORM操作详解
2020/05/19 Python
python软件都是免费的吗
2020/06/18 Python
Scrapy实现模拟登录的示例代码
2021/02/21 Python
Html5让容器充满屏幕高度或自适应剩余高度的布局实现
2020/05/14 HTML / CSS
Supersmart英国:欧洲市场首批食品补充剂供应商之一
2018/05/05 全球购物
美国在线购物频道:Shop LC
2019/04/21 全球购物
自荐信格式简述
2014/01/25 职场文书
售后服务承诺书范文
2014/03/26 职场文书
我为党旗添光彩演讲稿
2014/09/13 职场文书
六一儿童节新闻稿
2015/07/17 职场文书
golang中的空slice案例
2021/04/27 Golang
Python-OpenCV实现图像缺陷检测的实例
2021/06/11 Python