`
webcode
  • 浏览: 6042442 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

JavaScript 面向对象程序设计 变量,函数定义之不可不知

 
阅读更多

变量定义是指用

vara;

这种形式来声明变量。

函数定义是指用

functiona(...){...}

这种形式来声明函数。

vara=1;

是两个过程。第一个过程是定义变量 a,第二个过程是给变量 a 赋值。

同样

vara=function(...){};

也是两个过程,第一个过程是定义变量 a 和一个匿名函数,第二个过程是把匿名函数赋值给变量 a。

变量定义和函数定义是在整个脚本执行之前完成的,而变量赋值是在执行阶段完成的。

变量定义的作用仅仅是给所声明的变量指明它的作用域,变量定义并不给变量初始值,任何没有定义的而直接使用的变量,或者定义但没有赋值的变量,他们的值都是 undefined。

函数定义除了声明函数所在的作用域外,同时还定义函数体结构。这个过程是递归的,也就是说,对函数体的定义包括了对函数体内的变量定义和函数定义。

通过下面这个例子我们可以更明确的理解这一点:

alert(a);
alert(b);
alert(c);
vara="a";
functiona(){}
functionb(){}
varb="b";
varc="c";
varc=function(){}
alert(a);
alert(b);
alert(c);

猜猜这个程序执行的结果是什么?然后执行一下看看是不是跟你想的一样,如果跟你想的一样的话,那说明你已经理解上面所说的了。

这段程序的结果很有意思,虽然第一个 alert(a) 在最前面,但是你会发现它输出的值竟然是 function a() {},这说明,函数定义确实在整个程序执行之前就已经完成了。

再来看 b,函数 b 定义在变量 b 之前,但是第一个 alert(b) 输出的仍然是 function b() {},这说明,变量定义确实不对变量做什么,仅仅是声明它的作用域而已,它不会覆盖函数定义。

最后看 c,第一个 alert(c) 输出的是 undefined,这说明 var c = function() {} 不是对函数 c 定义,仅仅是定义一个变量 c 和一个匿名函数。

再来看第二个 alert(a),你会发现输出的竟然是 a,这说明赋值语句确实是在执行过程中完成的,因此,它覆盖了函数 a 的定义。

第二个 alert(b) 当然也一样,输出的是 b,这说明不管赋值语句写在函数定义之前还是函数定义之后,对一个跟函数同名的变量赋值总会覆盖函数定义。

第二个 alert(c) 输出的是 function() {},这说明,赋值语句是顺序执行的,后面的赋值覆盖了前面的赋值,不管赋的值是函数还是其它对象。

理解了上面所说的内容,我想你应该知道什么时候该用 function x(..) {…},什么时候该用 var x = function (…) {…} 了吧?即:前者是在定义函数,或者则在定义变量并且赋值

最后还要提醒一点,eval 中的如果出现变量定义和函数定义,则它们是在执行阶段完成的。所以,不到万不得已,不要用 eval!另外,即使要用 eval,也不要在里面用局部变量和局部方法!


分享到:
评论

相关推荐

    javascript 面向对象程序设计博客文章

    JavaScript是一种广泛应用于Web开发的动态编程语言,尤其以其强大的...以上就是JavaScript中面向对象程序设计的一些关键知识点,通过理解并熟练运用这些概念,开发者可以构建出更加健壮和易于维护的JavaScript应用。

    JavaScript面向对象程序程序设计PPT与代码

    JavaScript是一种广泛应用于Web开发的脚本语言,尤其在构建交互式网页和...这份"JavaScript面向对象程序程序设计PPT与代码"资源将详细解释这些概念,并可能包含实际示例,帮助你深入理解和应用这些面向对象编程技术。

    JavaScript面向对象编程指南(第2版).rar

    JavaScript是一种广泛应用于Web开发的脚本语言,尤其在构建交互式网页和动态应用程序时不可或缺。面向对象编程(Object-Oriented Programming,OOP)是JavaScript中的一个重要概念,它允许开发者通过对象来组织代码...

    javascript 经典面向对象设计

    标题“JavaScript经典面向对象设计”指出了本书的主要内容是关于如何使用面向对象编程(OOP)原则和技术来编写高质量、可扩展且可重用的JavaScript应用程序及库。描述中提到本书相比其他中文资料更为清晰,深入到...

    javascript面向对象编程

    JavaScript是一种广泛应用于Web开发的动态、弱类型、基于原型的脚本语言,它不仅支持函数式编程,还具有强大的面向对象编程能力...通过阅读《javascript面向对象编程.pdf》这样的资料,你可以深入理解并掌握这些概念。

    Javascript 面向对象编程小结

    这意味着变量和函数的定义仅在其定义的函数内部可见,但不包括在同一个代码块(如循环或条件语句)中。这可能导致一些意外的副作用,因此推荐使用`let`和`const`(ES6引入的块级作用域变量声明)来代替`var`。 此外...

    Javascript面向对象基础

    下面我们将详细探讨JavaScript面向对象的基础知识。 1. **对象和数据类型**: 在JavaScript中,一切都是对象,包括基本数据类型(如字符串、数字、布尔值)。然而,与数字或字符串不同,对象是键值对的集合,可以...

    JavaScript面向对象编程

    JavaScript面向对象编程是一种基于原型(Prototype)的编程范式,它是动态类型语言,允许开发者创建具有复杂特性的对象。在JavaScript中,面向对象主要通过构造函数、原型链和闭包来实现。以下是对这一主题的详细...

    JavaScript面向对象高级编程

    在当今的软件开发中,JavaScript语言因其在Web前端开发中的广泛应用而变得极其重要。...通过理解这些概念和实践知识,开发者可以在进行JavaScript面向对象高级编程时,设计出更加合理、易于维护和扩展的应用程序。

    JavaScript前端开发程序设计教程(微课版)-PPT课件.zip

    其中,箭头函数简化了函数定义,let和const提供了更灵活的变量声明方式,防止了变量提升带来的问题。模块化则让大型项目的组织变得更加有序。 AJAX(Asynchronous JavaScript and XML)技术使得页面可以在不刷新的...

    JavaScript面向对象编程指南

    JavaScript是一种广泛应用于Web开发的动态编程语言,尤其在构建交互式和富媒体网站时不可或缺。...《JavaScript面向对象编程指南》这本书会是深入这一主题的好资源,建议仔细阅读并实践其中的示例。

    面向对象javascript笔记

    面向对象的JavaScript编程是JavaScript开发中的重要概念,它允许我们以类和对象的方式来组织和处理数据。以下是对标题和描述中涉及的知识点的详细解释: 1. **引用**:在JavaScript中,对象是通过引用传递的,这...

    JavaScript前端开发程序设计教程.rar

    3. 箭头函数:简化函数定义,避免了`this`指向问题。 4. 模块化:通过`import`和`export`实现模块导入导出。 5. 类和继承:更符合传统面向对象编程的语法。 6. Promise:用于异步操作,解决回调地狱问题。 7. async/...

    javascript面向对象编程的几种模式详解

    JavaScript是一种广泛用于Web开发的脚本语言,尤其在构建交互式网页和应用程序时不可或缺。面向对象编程(Object-Oriented Programming, OOP)是JavaScript的核心特性之一,它提供了多种模式来创建和操作对象。以下...

    JavaScript面向对象编程(最终版).pdf

    以下是一个简单的JavaScript面向对象编程示例,其中定义了一个构造函数Human,用于创建包含name属性和sayHello方法的对象实例: ```javascript function Human(name) { this.name = name; this.sayHello = ...

    JavaScript面向对象编程入门与实践

    ### JavaScript面向对象编程入门与实践 #### 一、JavaScript中的对象与属性 在JavaScript中,对象是面向对象编程的核心组成部分。对象可以被视为包含属性和方法的数据集合。具体来说: - **属性**:对象的特征,...

    javascript面向对象编程教程.rar PDF

    JavaScript是一种广泛应用于Web开发的脚本语言,尤其在构建交互式网页和动态应用程序时不可或缺。本教程主要聚焦于JavaScript的面向对象编程(OOP)概念,这是理解和掌握高级JavaScript编程的关键。面向对象编程允许...

Global site tag (gtag.js) - Google Analytics