总结js函数相关知识点


Posted in Javascript onFebruary 27, 2018

要知道,在js中,引用类型是一种数据结构,包含5种引用类型,分别是Object,data,Array,re请输入代码gExp,Function。今天我们就说Function这种数据结构。

在js种函数实际上是对象,每个函数都是Function类型的实例。和其他引用类型一样,都具有属性和方法。

1. 函数定义有几种方法

1)函数声明语法定义

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

2)函数表达式

注意函数表达式后边有一个分号;

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

使用Function 构造函数

使用构造函数可以接收任意数量的参数,但最后一个参数始终被看成是函数体,而前面的参数则枚举出了参数

var sum=new Function("num1","num2","return num1+num2")

当然第三种方法不友好,也不推荐。

函数名仅仅是指向函数的指针,所以函数名与包含对象指针的其他变量没有什么不同。也就是说一个函数可能会有多个名字。
在这里函数声明和函数表达式有什么区别呢?

解析器在向执行环境中加载数据的时候,对函数声明和函数表达式是不一样的。解析器首先会读取函数声明,并且使得这段函数声明代码在任何代码之前都可调用。这就是我们平时所说的函数声明提升。函数表达式不一样,他必须等到函数解析器执行到他所在的代码块的时候,才会被真正的执行。比较下面2个例子

console.log(sum(10,10));

function sum(n1,n2){
  return n1+n2;
}

以上代码会正常执行

再看!

console.log(sum(10,10));

var sum=function(n1,n2){
  return n1+n2;
}

以上执行器就会报错!

2.函数没有重载

如果声明了2个同名函数,结果是后面的函数覆盖了前面的函数。

function sun(a){
 return a+100;
}
function sun(a){
 return a+200;
}

var result=sum(2)//202

3.函数的内部属性

包括this,arguments

具体不再叙述了

4.函数的属性和方法

函数有2个属性,length和prototype

length表示函数希望接收命名参数的个数。

function a(name){
 //todo
}
function b(name,age){
 //todo
}
function c(){
 //todo
}

a.length //1
b.length //2
c.length //0

prototype属性对于引用类型来说很重要,会有专门讲解,此处不再这赘述。

每个函数都包含2个非继承的方法 apply,call

这两个方法的用途都是在特定的作用域中调用函数,其实就是设置函数体内的this指代的值。

首先。apply()方法接收2个参数,一个是函数运行的作用域,另一个是参数数组,第二个参数可以是数组的实例,也可以是arguments.

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

function test1(a,b){
  return sum.apply(this,arguments);
}

function test2(c,d){
  return sum.apply(this.[c,d]);
}

console.log(test1(1,1)) //2

console.log(test2(1,1)) //2

call方法和apply方法没有多大的区别。区别就是call方法的第二个参数必须得传递的参数一个个列举出来。

使用call和apply来扩充作用域最大的好处就是对象不和任何方法耦合

Javascript 相关文章推荐
Javascript中匿名函数的多种调用方式总结
Dec 06 Javascript
jquery的ajax简单结构示例代码
Feb 17 Javascript
select多选 multiple的使用示例
Jun 16 Javascript
chrome不支持form.submit的解决方案
Apr 28 Javascript
JS实现网页Div层Clone拖拽效果
Sep 26 Javascript
jQuery实现的AJAX简单弹出层效果代码
Nov 26 Javascript
js中最容易被忽视的事件问题大总结
May 15 Javascript
JavaScript中object和Object的区别(详解)
Feb 27 Javascript
AngularJS 异步解决实现方法
Jun 12 Javascript
基于Node.js实现压缩和解压缩的方法
Feb 13 Javascript
jQuery/JS监听input输入框值变化实例
Oct 17 jQuery
修改Vue打包后的默认文件名操作
Aug 12 Javascript
详解jQuery中的isPlainObject()使用方法
Feb 27 #jQuery
详解Vue Elememt-UI构建管理后台
Feb 27 #Javascript
详解react-native WebView 返回处理(非回调方法可解决)
Feb 27 #Javascript
Vue2.5通过json文件读取数据的方法
Feb 27 #Javascript
vue2.5.2使用http请求获取静态json数据的实例代码
Feb 27 #Javascript
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 #jQuery
关于ES6箭头函数中的this问题
Feb 27 #Javascript
You might like
php安装ssh2扩展的方法【Linux平台】
2016/07/20 PHP
laravel如何开启跨域功能示例详解
2017/08/31 PHP
jQuery 研究心得 取得属性的值
2007/11/30 Javascript
JQuery从头学起第二讲
2010/07/04 Javascript
javascript判断是否按回车键并解决浏览器之间的差异
2014/05/13 Javascript
深入理解JavaScript系列(34):设计模式之命令模式详解
2015/03/03 Javascript
jQuery双向列表选择器DIV模拟版
2016/11/01 Javascript
清除js缓存的多种方法总结
2016/12/09 Javascript
微信小程序实战之顶部导航栏(选项卡)(1)
2020/06/19 Javascript
jQuery 利用ztree实现树形表格的实例代码
2017/09/27 jQuery
jQuery实现滚动效果
2017/11/17 jQuery
vue-awesome-swiper滑块插件使用方法详解
2017/11/27 Javascript
javascript的惯性运动实现代码实例
2019/09/07 Javascript
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
2020/02/06 Javascript
Node.js API详解之 os模块用法实例分析
2020/05/06 Javascript
JavaScript实现像雪花一样的Hexaflake分形
2020/07/07 Javascript
有关wxpython pyqt内存占用问题分析
2014/06/09 Python
Python的另外几种语言实现
2015/01/29 Python
Python下载懒人图库JavaScript特效
2015/05/28 Python
Python单元测试实例详解
2018/05/25 Python
python斐波那契数列的计算方法
2018/09/27 Python
在pytorch中实现只让指定变量向后传播梯度
2020/02/29 Python
一个非常简单好用的Python图形界面库(PysimpleGUI)
2020/12/28 Python
CSS3旋转——彩色扇子兼容firefox浏览器
2013/06/04 HTML / CSS
电影T恤、80年代T恤和80年代服装:TV Store Online
2020/01/05 全球购物
美国相机和电子产品零售商:Beach Camera
2020/11/26 全球购物
技术学校毕业生求职信分享
2013/12/02 职场文书
社区优秀志愿者材料
2014/02/02 职场文书
个人党性剖析材料
2014/02/03 职场文书
采购求职信
2014/03/17 职场文书
篮球比赛拉拉队口号
2014/06/10 职场文书
生产操作工岗位职责
2014/09/16 职场文书
红领巾广播站广播稿(3篇)
2014/09/20 职场文书
2014卖家双十一活动策划书
2014/09/29 职场文书
2014年政协委员工作总结
2014/12/01 职场文书
三好学生竞选稿
2015/11/21 职场文书