总结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 相关文章推荐
Extjs学习笔记之八 继承和事件基础
Jan 08 Javascript
IE6/7/8/9不支持exec的简写方式
May 25 Javascript
使用jQuery动态加载js脚本文件的方法
Apr 03 Javascript
js 显示base64编码的二进制流网页图片
Apr 04 Javascript
js判断上传文件类型判断FileUpload文件类型代码
May 20 Javascript
jQuery Ajax页面局部加载方法汇总
Jun 02 Javascript
jQuery fadeOut 异步实例代码详解
Aug 18 Javascript
JavaScript实现瀑布流以及加载效果
Feb 11 Javascript
bootstrap表单按回车会自动刷新页面的解决办法
Mar 08 Javascript
JS实现按钮颜色切换效果
Sep 05 Javascript
Vue插件之滑动验证码
Sep 21 Javascript
Jquery 获取相同NAME 或者id删除行操作
Aug 24 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
重置版战役片段
2020/04/09 魔兽争霸
PHP下10件你也许并不了解的事情
2008/09/11 PHP
PHP CURL CURLOPT参数说明(curl_setopt)
2013/09/30 PHP
web server使用php生成web页面的三种方法总结
2013/10/28 PHP
PHP采集类snoopy详细介绍(snoopy使用教程)
2014/06/19 PHP
ThinkPHP调用common/common.php函数提示错误function undefined的解决方法
2014/08/25 PHP
PHP中一些可以替代正则表达式函数的字符串操作函数
2014/11/17 PHP
简介WordPress中用于获取首页和站点链接的PHP函数
2015/12/17 PHP
浅谈PHP命令执行php文件需要注意的问题
2016/12/16 PHP
PHP实现链式操作的三种方法详解
2017/11/16 PHP
PHP中上传文件打印错误错误类型分析
2019/04/14 PHP
HTML TO JavaScript 转换
2006/06/26 Javascript
漂亮的提示信息(带箭头)
2007/03/21 Javascript
jquery.ui.progressbar 中文文档
2009/11/26 Javascript
Chrome中JSON.parse的特殊实现
2011/01/12 Javascript
JavaScript高级程序设计 客户端存储学习笔记
2011/09/10 Javascript
将字符串转换成gb2312或者utf-8编码的参数(js版)
2013/04/10 Javascript
jQuery实现鼠标划过修改样式的方法
2015/04/14 Javascript
AngularJS控制器controller给模型数据赋初始值的方法
2017/01/04 Javascript
Vue.js数据绑定之data属性
2017/07/07 Javascript
Angular4学习笔记之实现绑定和分包
2017/08/01 Javascript
jQuery Ajax async=>false异步改为同步时,解决导致浏览器假死的问题
2019/07/22 jQuery
Python2.5/2.6实用教程 入门基础篇
2009/11/29 Python
Python开发如何在ubuntu 15.10 上配置vim
2016/01/25 Python
Python解惑之整数比较详解
2017/04/24 Python
Python对ElasticSearch获取数据及操作
2019/04/24 Python
python 控制Asterisk AMI接口外呼电话的例子
2019/08/08 Python
TensorFlow——Checkpoint为模型添加检查点的实例
2020/01/21 Python
Django如何使用jwt获取用户信息
2020/04/21 Python
html5清空画布方法(三种)
2017/10/16 HTML / CSS
Fossil美国官网:Fossil手表、手袋、珠宝及配件
2017/02/01 全球购物
写一个方法1000的阶乘
2012/11/21 面试题
工作经常出错的检讨书
2014/09/13 职场文书
2014幼儿教师个人工作总结
2014/12/03 职场文书
《草虫的村落》教学反思
2016/02/20 职场文书
辞职申请书范本
2019/05/20 职场文书