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 相关文章推荐
Jquery+JSon 无刷新分页实现代码
Apr 01 Javascript
Jquery实现鼠标移动放大图片功能实例
Mar 25 Javascript
javascript中的Function.prototye.bind
Jun 25 Javascript
js实现横向伸展开的二级导航菜单代码
Aug 28 Javascript
利用jsonp跨域调用百度js实现搜索框智能提示
Aug 24 Javascript
Vue.js分页组件实现:diVuePagination的使用详解
Jan 10 Javascript
使用async await 封装 axios的方法
Jul 09 Javascript
Javascript实现动态时钟效果
Nov 17 Javascript
如何使用50行javaScript代码实现简单版的call,apply,bind
Aug 14 Javascript
js实现GIF图片的分解和合成
Oct 24 Javascript
原生js+ajax分页组件
Jan 30 Javascript
javascript中导出与导入实现模块化管理教程
Dec 03 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查询域名状态whois的类
2006/11/25 PHP
看了就知道什么是JSON
2007/12/09 Javascript
document.getElementById为空或不是对象的解决方法
2010/01/24 Javascript
JavaScript高级程序设计 读书笔记之十一 内置对象Global
2012/03/07 Javascript
js获得鼠标的坐标值的方法
2013/03/13 Javascript
Node.js事件循环(Event Loop)和线程池详解
2015/01/28 Javascript
JavaScript跨平台的开源框架NativeScript
2015/03/24 Javascript
jquery实现向下滑出的二级导航下滑菜单效果
2015/08/25 Javascript
JavaScript常用标签和方法总结
2015/09/01 Javascript
JavaScript判断DIV内容是否为空的方法
2016/01/29 Javascript
nodejs实例解析(输出hello world)
2017/01/03 NodeJs
BootStrap 标题设置跨行无效的解决方法
2017/10/25 Javascript
vue-cli构建项目下使用微信分享功能
2018/05/28 Javascript
微信小程序Getuserinfo解决方案图解
2018/08/24 Javascript
解决vue语法会有延迟加载显现{{xxx}}的问题
2019/11/14 Javascript
浅谈python多线程和队列管理shell程序
2015/08/04 Python
python魔法方法-属性访问控制详解
2016/07/25 Python
Flask框架的学习指南之开发环境搭建
2016/11/20 Python
JS设计模式之责任链模式实例详解
2018/02/03 Python
Python多线程应用于自动化测试操作示例
2018/12/06 Python
使用python将多个excel文件合并到同一个文件的方法
2019/07/09 Python
浅谈Selenium 控制浏览器的常用方法
2020/12/04 Python
html5的pushstate以及监听浏览器返回事件的实现
2020/08/11 HTML / CSS
苹果中国官方网站:Apple中国
2016/07/22 全球购物
巴西宠物店在线:Geração Pet
2017/05/31 全球购物
SQL面试题
2013/04/30 面试题
怎么样写好简历中的自我评价
2013/10/25 职场文书
商务日语专业毕业生求职信
2013/10/26 职场文书
中医临床专业自我鉴定范文
2014/01/15 职场文书
中级会计职业生涯规划范文
2014/01/16 职场文书
公司司机岗位职责
2014/02/07 职场文书
环保倡议书怎么写
2014/05/16 职场文书
感恩母亲节活动总结
2015/02/10 职场文书
高中生自我评价范文2015
2015/03/03 职场文书
大学生求职意向书
2015/05/11 职场文书
法人代表证明书范本
2015/06/18 职场文书