`
lcyangily
  • 浏览: 22290 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

js经典错误之变量申明

 
阅读更多

在写js的时候不经意间犯了一个经典的js错误,mark一下,长点记性。

(function(w, d, $) {
    /**
     * 这是基础对象,很多页面元素都基于这个定义组件如:AUI.DataGrid等。
     * 页面多次引用此文件。防止其他的插件被覆盖。先判断是否已经什么,不重复声明
     */
    if(typeof w.AUI == 'undefined') {
        var AUI = w.AUI = {};
    }
    
    AUI.Class = {...}
})(window, document, jQuery);

 

这样写乍一眼看没问题,其实犯了一个经典的js变量声明的错误。页面应用多次时,后面几个应用会在 AUI.Class定义处报 undefined 错误。

始终记住:js变量的作用域是函数级而不是块级,且定义都会提前。

 

修改后:

(function(w, d, $) {
    /** 不重新加载,重新加载会将AUI命名空间下所有组件删掉 **/
    var AUI;
    if(typeof w.AUI == 'undefined') {
        AUI = w.AUI = {};
    } else {
        AUI = w.AUI;
    }

    ....
})(window, document, jQuery);

 

 

 

分享到:
评论

相关推荐

    js-作用域-变量申明提升 - 甘劭 - 博客园1

    JavaScript中的作用域和变量声明提升是理解JS代码执行的关键概念。首先,作用域是指变量或函数可以在哪些区域中被访问的限制。JavaScript主要有两种作用域:全局作用域和函数作用域,而没有像C#、C、Java那样的块级...

    JavaScript变量知识简介

    JavaScript是Web开发中不可或缺的一部分...理解变量的作用域和申明提前对于避免潜在的错误和提高代码可读性至关重要。在编写JavaScript时,合理地使用变量和理解它们的生命周期可以帮助我们写出更清晰、更健壮的代码。

    js变量提升深入理解

    JavaScript中的变量提升(Variable Hoisting)是一个核心概念,它涉及到变量和函数声明的处理方式。在JavaScript引擎解析代码时,它会将所有的`var`变量声明和函数声明提升到它们所在作用域的顶部,无论这些声明实际...

    NODE.js入门手册

    本书旨在帮助读者掌握如何使用Node.js开发应用程序,并在此过程中深入讲解必要的高级JavaScript知识。不同于简单的“Hello World”教程,它侧重于实际应用。 - **状态** 当前阅读的是最终版书籍。除非发现错误或...

    JavaScript学习总结.pdf

    14. 变量提升:JavaScript 函数会先扫描整个函数体的语句,把所有申明的变量提升到函数顶部 知识点:变量提升 变量提升使得代码的执行更加灵活和多样化,可以满足不同的需求。 15. 全局变量:全局变量会绑定到 ...

    JavaScript中的函数申明、函数表达式、箭头函数

    在JS中,函数是第一类对象,可以作为变量赋值,作为参数传递,甚至可以作为其他函数的返回值。本篇文章将详细探讨JavaScript中的三种函数创建方式:函数声明、函数表达式和箭头函数。 1. **函数声明** 函数声明...

    编程之显示/隐式声明

    在JavaScript中,虽然变量类型在声明时可以不确定,但仍然需要使用var、let或const等关键字来显示声明变量。如下所示: ```javascript var count; ``` 或者使用let和const关键字: ```javascript let count; ...

    Javascript中 带名 匿名 箭头函数的重要区别(推荐)

    在JavaScript编程语言中,函数是其核心特性之一,有多种函数定义方式,包括带名函数、匿名函数以及ES6引入的箭头函数。这三种函数形式各有特点,下面将详细介绍它们之间的关键区别。 1. 带名函数: 带名函数,即在...

    submitHandle:提交句柄

    1. **申明submit变量**:在JavaScript中,我们可以创建一个变量`submit`来引用表单中的提交按钮。例如: ```javascript var submit = document.querySelector('input[type="submit"]'); ``` 这样,`submit`变量就...

    WAP WML(英文版)

    - **Errors**:错误处理机制,确保文档在出现错误时能够继续渲染。 #### 七、核心WML数据类型 - **Character Data**:表示文本节点,包含实际显示给用户的文本。 - **Length**:用于表示距离或尺寸的数据类型。 - ...

    精易模块[源码] V5.15

    3、修正“类_环境存取->读环境变量”不能读取当前进程环境变量的BUG,感谢易友【@詠不言敗】反馈。 4、修正“文本_逐字分割”返回数组不清除会保留上次内容的问题,感谢易友【@JadeジYu】反馈。 5、新增“文本_是否...

Global site tag (gtag.js) - Google Analytics