javascript - 全局作用域函数如何确定变量不再存在?

标签 javascript html dom

我编写了一个将行为绑定(bind)到元素的函数。假设我们有两个输入。然后我们希望能够显示这些输入的提示,

function ElementHinter(element){
  element.showNotice = function( message, type) {
    var errorBorderStyle = "1px solid #cc3e22";
    var warningBorderStyle = "1px solid #cc9322";

    var parent = element.parents('.value');
    element.css("border", type == element.ERROR ? errorBorderStyle : warningBorderStyle);
    if (!parent.find('.error-message').length) {
      messagePublisher(message, type);
    }   
  }

  element.removeNotice = function() {
    element.css("border-color", "#aaa #c8c8c8 #c8c8c8 #aaa");
    element.parents('.value').find('.error-message').remove();
  }


  var messagePublisher = function(message, type) {
    var parent = element.parents('.value');
    var errorStyle = "#cc3e22";
    var warningStyle = "#cc9322";

    var html = "<span class='error-message'>" + message + "</span>";
    parent.css("color", type == ElementHinter.ERROR ? errorStyle : warningStyle);
    jQuery(parent).append(html);
  }
  return element;
}

ElementHinter.ERROR = "ERROR"
ElementHinter.WARNING = "WARNING"

var priceElement    = ElementHinter($('input#price'));
var discountPercent = ElementHinter($('input#discount'));

priceElement.showNotice("Bad price friend",ElementHinter.WARNING);
discountPercent.showNotice("Bad discount friend",ElementHinter.WARNING);

现在,如果我去掉 varmessagePublisher两个通知都将显示在仅一个元素上。为什么会发生这种情况?如果我去掉var element 是什么意思在这种情况下意味着什么?

最佳答案

如果没有var,变量将变为全局。因此,如果没有 var,则只有一个 messagePublisher 变量,并且由所有实例共享。就好像您有这样的声明:

var messagePublisher;

在您的函数之外

如果您习惯使用以下语句启动脚本文件或函数:

"use strict";

(完全一样),那么如果您在较新的 JavaScript 中省略 var (或 letconst),您将收到错误)。

关于javascript - 全局作用域函数如何确定变量不再存在?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43372832/

相关文章:

javascript - Backbone 集合 sortBy

c# - ASP.NET 将参数传递给母版页中的 Javascript 函数

javascript - HTML5 Canvas 字符跳转

javascript - 单击按钮时添加新的文本字段,并通过单击 Laravel 4 中的按钮删除

javascript - 在 Meteor 中只允许单击一次按钮

css - 使用 CSS 生成的内容(即伪元素)是否比添加更多 DOM 元素更有效(即解析/渲染速度更快)?

javascript - HTML 按钮的 "onclick"属性在单击之前调用函数

html - 如何垂直对齐到具有定义的宽度/高度的 div 内容的中心?

javascript - Jquery-从 <td> 内的输入获取值到数组中

javascript - 如何使用htmlunit查看javascript生成的DOM?