总结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 相关文章推荐
<script defer> defer 是什么意思
May 10 Javascript
JavaScript 动态将数字金额转化为中文大写金额
May 14 Javascript
9款2014最热门jQuery实用特效推荐
Dec 07 Javascript
Javascript编程中几种继承方式比较分析
Nov 28 Javascript
Seajs 简易文档 提供简单、极致的模块化开发体验
Apr 13 Javascript
jQuery插件EasyUI获取当前Tab中iframe窗体对象的方法
Aug 05 Javascript
javascript作用域链与执行环境详解
Mar 25 Javascript
谈谈对vue响应式数据更新的误解
Aug 01 Javascript
JS开发中基本数据类型具体有哪几种
Oct 19 Javascript
javascriptvoid(0)含义以及与"#"的区别讲解
Jan 19 Javascript
VUE动态生成word的实现
Jul 26 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 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
手冲咖啡应该是现代精品咖啡店的必备选项吗?
2021/03/03 冲泡冲煮
生成缩略图
2006/10/09 PHP
PHP中的浅复制与深复制的实例详解
2017/10/26 PHP
laravel 解决多库下的DB::transaction()事务失效问题
2019/10/21 PHP
WordPress伪静态规则设置代码实例
2020/12/10 PHP
javascript XMLHttpRequest对象全面剖析
2010/04/24 Javascript
基于Jquery制作的幻灯片图集效果打包下载
2011/02/12 Javascript
JS分割字符串并放入数组的函数
2011/07/04 Javascript
js判断数据类型如判断是否为数组是否为字符串等等
2014/01/15 Javascript
JS实现带鼠标效果的头像及文章列表代码
2015/09/27 Javascript
javascript性能优化之事件委托实例详解
2015/12/12 Javascript
js阻止浏览器默认行为触发的通用方法(推荐)
2016/05/15 Javascript
JavaScript中对象的不同创建方法
2016/08/12 Javascript
基于jquery二维码生成插件qrcode
2017/01/07 Javascript
thinkjs之页面跳转同步异步操作
2017/02/05 Javascript
jquery uploadify隐藏上传进度的实现方法
2017/02/06 Javascript
Angular.js 4.x中表单Template-Driven Forms详解
2017/04/25 Javascript
Nodejs--post的公式详解
2017/04/29 NodeJs
vue实现的上拉加载更多数据/分页功能示例
2019/05/25 Javascript
手把手15分钟搭一个企业级脚手架
2019/09/16 Javascript
js实现登录拖拽窗口
2020/02/10 Javascript
jQuery实现html可联动的百分比进度条
2020/03/26 jQuery
基于Echarts图表在div动态切换时不显示的解决方式
2020/07/20 Javascript
Python实现桶排序与快速排序算法结合应用示例
2017/11/22 Python
python的常用模块之collections模块详解
2018/12/06 Python
Python多叉树的构造及取出节点数据(treelib)的方法
2019/08/09 Python
pyenv与virtualenv安装实现python多版本多项目管理
2019/08/17 Python
浅析canvas元素的html尺寸和css尺寸对元素视觉的影响
2019/07/22 HTML / CSS
中国跨境海淘网站:考拉海购
2016/08/01 全球购物
应聘美工求职信
2013/11/07 职场文书
售房协议书
2014/08/19 职场文书
党的群众路线教育实践活动整改落实情况报告
2014/10/28 职场文书
出差报告格式模板
2014/11/06 职场文书
电力工程合作意向书
2015/05/11 职场文书
六五普法先进个人主要事迹材料
2015/11/03 职场文书
Python使用Beautiful Soup(BS4)库解析HTML和XML
2022/06/05 Python