总结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 相关文章推荐
jquery 实现密码框的显示与隐藏示例代码
Sep 18 Javascript
Javascript学习笔记之函数篇(四):arguments 对象
Nov 23 Javascript
JavaScript获取Url里的参数
Dec 18 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
Jan 29 Javascript
js选项卡的实现方法
Feb 09 Javascript
js实现继承的5种方式
Dec 01 Javascript
通用无限极下拉菜单的实现代码
May 31 Javascript
JavaScript自学笔记(必看篇)
Jun 23 Javascript
jquery 抽奖小程序实现代码
Oct 12 Javascript
Angular4如何自定义首屏的加载动画详解
Jul 26 Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
Mar 08 Javascript
jQuery-App输入框实现实时搜索
Nov 19 jQuery
详解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 身份验证方面的函数
2009/10/11 PHP
qq登录,新浪微博登录接口申请过程中遇到的问题
2014/07/22 PHP
php图片添加水印例子
2016/07/20 PHP
php foreach如何跳出两层循环(详解)
2016/11/05 PHP
JS仿flash上传头像效果实现代码
2011/07/18 Javascript
用Jquery重写windows.alert方法实现思路
2013/04/03 Javascript
鼠标划过实现延迟加载并隐藏层的js代码
2013/10/11 Javascript
jquery给图片添加鼠标经过时的边框效果
2013/11/12 Javascript
浅析js中的浮点型运算问题
2014/01/06 Javascript
Bootstrap每天必学之导航
2015/11/26 Javascript
JS动态遍历json中所有键值对的方法(不知道属性名的情况)
2016/12/28 Javascript
原生js仿浏览器滚动条效果
2017/03/02 Javascript
js实现方块上下左右移动效果
2017/08/17 Javascript
[js高手之路]从原型链开始图解继承到组合继承的产生详解
2017/08/28 Javascript
jQuery替换节点元素的操作方法
2018/03/18 jQuery
node.JS事件机制与events事件模块的使用方法详解
2020/02/06 Javascript
python3操作mysql数据库的方法
2017/06/23 Python
python模块之paramiko实例代码
2018/01/31 Python
Python爬虫包BeautifulSoup异常处理(二)
2018/06/17 Python
Python学习笔记之读取文件、OS模块、异常处理、with as语法示例
2019/06/04 Python
Django实现跨域的2种方法
2019/07/31 Python
动态设置django的model field的默认值操作步骤
2020/03/30 Python
在终端启动Python时报错的解决方案
2020/11/20 Python
详解CSS透明opacity和IE各版本透明度滤镜filter的最准确用法
2016/12/20 HTML / CSS
奥地利网上书店:Weltbild
2017/07/14 全球购物
zooplus意大利:在线宠物商店
2019/08/07 全球购物
圣彼得堡鲜花配送:Semicvetic
2020/09/15 全球购物
环境工程与管理大学毕业生求职信
2013/10/02 职场文书
师范应届生教师求职信
2013/11/05 职场文书
运输服务质量承诺书
2014/03/27 职场文书
中国梦主题教育活动总结
2014/05/05 职场文书
班主任师德师风自我剖析材料
2014/10/02 职场文书
招商引资工作汇报材料
2014/10/28 职场文书
2014年置业顾问工作总结
2014/11/17 职场文书
出国导师推荐信
2015/03/25 职场文书