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 相关文章推荐
学习面向对象之面向对象的基本概念:对象和其他基本要素
Nov 30 Javascript
40款非常有用的 jQuery 插件推荐(系列一)
Dec 21 Javascript
浅析javascript中的DOM
Mar 01 Javascript
基于JavaScript实现右键菜单和拖拽功能
Nov 28 Javascript
微信小程序 缓存(本地缓存、异步缓存、同步缓存)详解
Jan 17 Javascript
vue实现登陆登出的实现示例
Sep 15 Javascript
bootstrap时间控件daterangepicker使用方法及各种小bug修复
Oct 25 Javascript
bing Map 在vue项目中的使用详解
Apr 09 Javascript
学习React中ref的两个demo示例
Aug 14 Javascript
vue初始化动画加载的实例
Sep 01 Javascript
简单两步使用node发送qq邮件的方法
Mar 01 Javascript
vue $set 给数据赋值的实例
Nov 09 Javascript
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
php 多线程上下文中安全写文件实现代码
2009/12/28 PHP
smarty内置函数config_load用法实例
2015/01/22 PHP
Yii2语言国际化自动配置详解
2018/08/22 PHP
PHP中通过getopt解析GNU C风格命令行选项
2019/11/18 PHP
javascript 去字符串空格终极版(支持utf8)
2009/11/14 Javascript
jquery validation插件表单验证的一个例子
2010/03/03 Javascript
jquery form表单提交插件asp.net后台中文解码
2010/06/12 Javascript
autoPlay 基于jquery的图片自动播放效果
2011/12/07 Javascript
jquery实现商品拖动选择效果代码(自写)
2013/05/28 Javascript
了解了这些才能开始发挥jQuery的威力
2013/10/10 Javascript
jQuery自定义事件的简单实现代码
2014/01/27 Javascript
纯JS实现动态时间显示代码
2014/02/08 Javascript
javascript输出AscII码扩展集中的字符方法
2016/12/26 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
2017/04/27 Javascript
React Native验证码倒计时工具类分享
2017/10/24 Javascript
vue2.0s中eventBus实现兄弟组件通信的示例代码
2017/10/25 Javascript
Vue项目自动转换 px 为 rem的实现方法
2018/10/29 Javascript
bootstrap table实现合并单元格效果
2018/12/24 Javascript
微信小程序分享功能onShareAppMessage(options)用法分析
2019/04/24 Javascript
小程序调用微信支付的方法
2019/09/26 Javascript
浅谈vuex为什么不建议在action中修改state
2020/02/02 Javascript
python快速查找算法应用实例
2014/09/26 Python
Python实现购物评论文本情感分析操作【基于中文文本挖掘库snownlp】
2018/08/07 Python
基于python中theano库的线性回归
2018/08/31 Python
flask的orm框架SQLAlchemy查询实现解析
2019/12/12 Python
Python基本类型的连接组合和互相转换方式(13种)
2019/12/16 Python
浅谈Pycharm最有必要改的几个默认设置项
2020/02/14 Python
基于python实现操作redis及消息队列
2020/08/27 Python
HTML5 canvas实现雪花飘落特效
2016/03/08 HTML / CSS
意大利专业化妆品品牌:KIKO MILANO
2017/02/01 全球购物
意大利在线购买隐形眼镜网站:VisionDirect.it
2019/03/18 全球购物
体育教师自荐信范文
2013/12/16 职场文书
毕业生代领毕业材料的授权委托书
2014/09/29 职场文书
幼儿园父亲节活动总结
2015/02/12 职场文书
2015年纪委工作总结
2015/05/13 职场文书
苹果发布了MagSafe固件更新,可以不外接电源实现最高7.5W充电
2022/04/21 数码科技