JS编程建议——63:比较函数调用和引用本质

简介: 63:比较函数调用和引用本质

建议63:比较函数调用和引用本质
在被调用之前,JavaScript函数仅是词法意思上的结构,没有实际的价值,在预编译函数时,也仅是简单地分析函数的词法、语法结构,并根据函数标识符预定一个函数占据的内存空间,其内部结构和逻辑并没有被运行。但是,一旦函数被调用执行,其上下文环境也会随之产生。可以说,上下文环境是函数运行期的一个动态环境,它是一个动态概念,与函数的静态性是截然不同的概念。每个函数都有一个独立的上下文环境(即执行环境)。先看下面这个示例中变量a和变量b是否相等。
function f(){

var x = 5;
return x;

}
var a = f;
var b = f;
alert( a === b );
“alert( a === b );”的返回值为true,说明变量a与变量b完全相同。继续观察下面的示例。
function f(){

var x = 5;
return function(){
    return x;
}

}
var a = f();
var b = f();
alert( a === b );
“alert( a === b);”的返回值为false,说明变量a与变量b不完全相同。这就是函数引用和函数调用的区别,下面的示意图能够很好地说明它们的异同,分别如图3.1和图3.2所示。

下面介绍函数引用与函数调用的本质区别。当引用函数时,多个变量内存储的是函数的相同入口指针。因此,对于同一个函数来说,不管有多少个变量引用该函数,这些变量的值都是相同的,都为该函数的入口指针地址。例如,针对上面第二个示例来说,如果变量a和b都引用函数f,而不是调用,则它们是完全相同的。
相反,函数调用是执行该函数,并把返回的值传递给变量a和b。也就是说,变量a和b存储的是值,而不是函数的入口指针地址。
有这么一个问题:在第一个示例中,如果变量a和b也都调用函数f,它们却相同(如下所示),而在下面这个示例中的调用却不相同。
function f(){

var x = 5;
return x;

}
var a = f();
var b = f();
alert( a === b ); //true
在第一个示例中,函数调用后返回的是值类型数据(即数值5),两个数值5自然是相同的。但是在第二个示例中,函数调用返回值是一个闭包函数,即引用类型的数据。虽然返回的闭包结构是完全相同的,但由于它们存储在不同变量中,即它们的地址指针是完全不同的,因此也无法相同。再看下面这个示例:
function F(){

this.x = 5;

}
var a = new F();
var b = new F();
alert( a === b );
“alert( a === b );”的返回值为false,说明变量a与变量b不完全相同。
function F(){

this.x = function(){
    return 5;
}

}
var a = new F();
var b = new F();
alert( a === b );
“alert( a === b );”的返回值为false,说明变量a与变量b不完全相同。
函数与实例的关系,如图3.3所示。通过new运算符可以复制函数的结构,从而实现函数实例化的目的。实例化的过程实际就是对函数结构进行复制和初始化的操作过程。因此,当实例化函数F并赋值给变量a时,a所引用的函数结构并非原来函数的结构,而是内存运行区中另一块函数结构,自然它们是完全不相同的。

相关文章
|
6月前
|
JavaScript 前端开发 Java
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
148 24
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
|
7月前
|
JavaScript Ubuntu Linux
如何在阿里云的linux上搭建Node.js编程环境?
本指南介绍如何在阿里云Linux服务器(Ubuntu/CentOS)上搭建Node.js环境,包含两种安装方式:包管理器快速安装和NVM多版本管理。同时覆盖全局npm工具配置、应用部署示例(如Express服务)、PM2持久化运行、阿里云安全组设置及外部访问验证等步骤,助你完成开发与生产环境的搭建。
|
存储 JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果+1
JavaScript编程实现tab选项卡切换的效果+1
|
8月前
|
JavaScript 前端开发 IDE
【编程向导】Js与Ts差异详解:选择与权衡
JavaScript 一直是 Web 开发的基石,以其灵活性和动态性著称,但其松散类型可能导致大型项目中出现难以调试的错误。TypeScript 作为 JavaScript 的超集,通过引入静态类型系统,提供了更高的类型安全性和更好的工具支持,尤其适合大型团队和复杂项目。本文详细对比了 JavaScript 和 TypeScript 的优缺点,并提供了实际代码示例,帮助开发者根据项目需求选择合适的工具。
911 2
|
11月前
|
前端开发 JavaScript 持续交付
提高JavaScript编程效率
提高JavaScript编程效率
133 3
|
11月前
|
自然语言处理 JavaScript 前端开发
JavaScript闭包:解锁编程潜能,释放你的创造力
【10月更文挑战第25天】本文深入探讨了JavaScript中的闭包,包括其基本概念、创建方法和实践应用。闭包允许函数访问其定义时的作用域链,常用于数据封装、函数柯里化和模块化编程。文章还提供了闭包的最佳实践,帮助读者更好地理解和使用这一强大特性。
91 2
|
JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果
JavaScript编程实现tab选项卡切换的效果
|
JavaScript 前端开发 数据处理
掌握JavaScript中的二进制运算,提升你的编程技能!
掌握JavaScript中的二进制运算,提升你的编程技能!
|
存储 前端开发 JavaScript
深入理解 JavaScript 函数:提升编程技能的必备知识(下)
深入理解 JavaScript 函数:提升编程技能的必备知识(下)
深入理解 JavaScript 函数:提升编程技能的必备知识(下)
|
存储 前端开发 JavaScript
深入理解 JavaScript 函数:提升编程技能的必备知识(中)
深入理解 JavaScript 函数:提升编程技能的必备知识(中)
深入理解 JavaScript 函数:提升编程技能的必备知识(中)

热门文章

最新文章