函数创建方式及区别,粗略总结函数原理

2024-02-25 17:48

本文主要是介绍函数创建方式及区别,粗略总结函数原理,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

JS中函数的创建

版权声明:本文为博主原创文章,未经博主允许不得转载。


首先什么是函数

函数其实一个封装一段代码的对象,之所以要封装是为了便于我们以后代码的重用。通俗的说就是一项任务可能被反复的使用,就要定义函数,以便以后反复使用。

函数的创建

函数声明
定义:
使用function关键字声明一个函数,再指定一个函数名,叫函数声明。
表达式:
function 函数名(参数列表){函数体;return 返回值}

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

函数表达式
定义:
使用function关键字声明一个函数,但未给函数命名,最后将匿名函数赋予一个变量,叫函数表达式,这是最常见的函数表达式语法形式。
表达式:
var 函数名=function (参数列表){函数体;return 返回值}

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

函数构造法
定义:
使用new方法创建一个函数,并传参给函数,声明一个变量接收此函数(参数必须加引号)
表达式:
var 函数名=new function (“参数1”,“参数2”, ……;“函数体;return 返回值”}

var add3=new Function('n1','n2','return n1+n2');
console.log(sum3(2,3));//5

三者的区别
函数声明和函数表达式不同之处在于:

解析器会先读取函数声明,并使其在执行任何代码之前可以访问;

而函数表达式则必须等到解析器执行到它所在的代码行才会真正被解释执行。

从技术角度讲,函数构造法其实是一个函数表达式。一般不推荐用这种方法定义函数,因为这种语法会导致解析两次代码(第一次是解析常规ECMAScript代码,第二次是解析传入构造函数中的字符串),从而影响性能。

//函数声明
fnName();
function fnName(){...
}
//正常,因为‘提升'了函数声明,函数调用可在函数声明之前//函数表达式
fnName();
var fnName=function(){...
}
//报错,变量fnName还未保存对函数的引用,函数调用必须在函数表达式之后

出现这样的原因,是因为函数声明提前(Function declaration Hoisting),后面会讲解声明提前是什么
函数的原理
让引擎按照函数的步骤执行任务
存储:
函数名其实就是一个普通的变量
函数本身是一个引用类型的对象(保存多个数据的复杂数据结构)
函数名通过函数的地址值,引用函数对象
强调: 声明时,不会执行函数的内容。
调用:
1. window中声明变量,准备保存函数的返回值
2. 找到函数对象,创建函数执行时的临时存储空间
3. 将调用时传入的参数值,放入临时存储空间的参数变量中
4. 执行函数体,修改临时存储空间中的变量值
5. 将返回值,返回window中,保存到指定变量
6. 函数执行后,临时存储空间释放!导致,函数内局部变量一同释放
所以: 函数中的参数变量和var的变量,只能在函数调用时,内部使用,出了函数,无法使用。

声明提前
在开始执行程序前,引擎会首先查找所有var声明的变量和function声明的函数,将他们集中到当前作用域的顶部优先创建

总结
强烈建议,所有要用到的变量集中声明在当前作用域的顶部

ES6:
尽量用let代替var
强调:
1. let必须在严格模式下使用!
2. let作为局部变量时,必须放在代码段开头
局部变量let之前的变量不可用
3. 用var 函数名=function(){…} 代替function 函数名(){…}
区别: function 函数名(){…} 会被声明提前
var 函数名=function(){…} 不会被声明提前

    揭示了本质: 函数名其实就是一个变量函数名通过地址引用着函数对象

这篇关于函数创建方式及区别,粗略总结函数原理的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/746218

相关文章

Debezium 与 Apache Kafka 的集成方式步骤详解

《Debezium与ApacheKafka的集成方式步骤详解》本文详细介绍了如何将Debezium与ApacheKafka集成,包括集成概述、步骤、注意事项等,通过KafkaConnect,D... 目录一、集成概述二、集成步骤1. 准备 Kafka 环境2. 配置 Kafka Connect3. 安装 D

Java中ArrayList和LinkedList有什么区别举例详解

《Java中ArrayList和LinkedList有什么区别举例详解》:本文主要介绍Java中ArrayList和LinkedList区别的相关资料,包括数据结构特性、核心操作性能、内存与GC影... 目录一、底层数据结构二、核心操作性能对比三、内存与 GC 影响四、扩容机制五、线程安全与并发方案六、工程

Android 悬浮窗开发示例((动态权限请求 | 前台服务和通知 | 悬浮窗创建 )

《Android悬浮窗开发示例((动态权限请求|前台服务和通知|悬浮窗创建)》本文介绍了Android悬浮窗的实现效果,包括动态权限请求、前台服务和通知的使用,悬浮窗权限需要动态申请并引导... 目录一、悬浮窗 动态权限请求1、动态请求权限2、悬浮窗权限说明3、检查动态权限4、申请动态权限5、权限设置完毕后

Springboot中分析SQL性能的两种方式详解

《Springboot中分析SQL性能的两种方式详解》文章介绍了SQL性能分析的两种方式:MyBatis-Plus性能分析插件和p6spy框架,MyBatis-Plus插件配置简单,适用于开发和测试环... 目录SQL性能分析的两种方式:功能介绍实现方式:实现步骤:SQL性能分析的两种方式:功能介绍记录

SQL 中多表查询的常见连接方式详解

《SQL中多表查询的常见连接方式详解》本文介绍SQL中多表查询的常见连接方式,包括内连接(INNERJOIN)、左连接(LEFTJOIN)、右连接(RIGHTJOIN)、全外连接(FULLOUTER... 目录一、连接类型图表(ASCII 形式)二、前置代码(创建示例表)三、连接方式代码示例1. 内连接(I

Python itertools中accumulate函数用法及使用运用详细讲解

《Pythonitertools中accumulate函数用法及使用运用详细讲解》:本文主要介绍Python的itertools库中的accumulate函数,该函数可以计算累积和或通过指定函数... 目录1.1前言:1.2定义:1.3衍生用法:1.3Leetcode的实际运用:总结 1.1前言:本文将详

Android里面的Service种类以及启动方式

《Android里面的Service种类以及启动方式》Android中的Service分为前台服务和后台服务,前台服务需要亮身份牌并显示通知,后台服务则有启动方式选择,包括startService和b... 目录一句话总结:一、Service 的两种类型:1. 前台服务(必须亮身份牌)2. 后台服务(偷偷干

Java深度学习库DJL实现Python的NumPy方式

《Java深度学习库DJL实现Python的NumPy方式》本文介绍了DJL库的背景和基本功能,包括NDArray的创建、数学运算、数据获取和设置等,同时,还展示了如何使用NDArray进行数据预处理... 目录1 NDArray 的背景介绍1.1 架构2 JavaDJL使用2.1 安装DJL2.2 基本操

最长公共子序列问题的深度分析与Java实现方式

《最长公共子序列问题的深度分析与Java实现方式》本文详细介绍了最长公共子序列(LCS)问题,包括其概念、暴力解法、动态规划解法,并提供了Java代码实现,暴力解法虽然简单,但在大数据处理中效率较低,... 目录最长公共子序列问题概述问题理解与示例分析暴力解法思路与示例代码动态规划解法DP 表的构建与意义动

JS 实现复制到剪贴板的几种方式小结

《JS实现复制到剪贴板的几种方式小结》本文主要介绍了JS实现复制到剪贴板的几种方式小结,包括ClipboardAPI和document.execCommand这两种方法,具有一定的参考价值,感兴趣的... 目录一、Clipboard API相关属性方法二、document.execCommand优点:缺点: