使用单词'英语'因为变量/对象名称在javascript中不起作用

Using the word 'english' as a variable/object name does not work in javascript

本文关键字：javascript 对象 不起作用 变量 单词 英语 因为      更新时间：2023-09-26

我在js文件中有以下代码：

var english = { 
  firstname: 'Tony ', 
  lastname:'Smith',
  address: {
    street: "777 guid str",
    city: "New York",
    state: "NY"     
  } 
}; 
var spanish = { 
  firstname: 'Roberto ', 
  lastname:'Tzuark',
  address: {
    street: "227 guid str",
    city: "New York",
    state: "NY"     
  }
};
function greet(person) {
  console.log('hi ' + person.firstname + person.lastname);
}

以及html中的以下代码：

    <form id="myForm" method="get">
    <button type="button" name="english" onClick="greet(english)">english</button>
    <button type="button" name="spanish" onClick="greet(spanish)">spanish</button>
    </form>

当点击按钮时，我在控制台中得到一个"未定义"的错误。然而，如果我将变量名"english"answers"spanish"更改为ANYTHING else，效果会很好。这些没有列在javascript保留字中(http://www.w3schools.com/js/js_reserved.asp)

为什么它不起作用？

您有一个名为"english"的按钮，它被放在window上。有两个修复程序，都，您应该应用它们：

  1. 不要命名按钮。除非多个按钮具有相同的名称和不同的值，否则没有理由为按钮元素指定name属性。

  2. 不要在HTML中使用内联事件处理程序。使用JavaScript将它们单独附加。

    （函数（）{var english=…；var西班牙语=…；var englishButton=document.getElementById（'english'）；var spanishButton=document.getElementById（'spanish'）；englishButton.addEventListener（'click'，function（）{问候语（英语）；})；englishButton.addEventListener（'click'，function（）{问候语（西班牙语）；})；})（）
    <form id="myForm" method="get">
    <button type="button" id="english">english</button>
    <button type="button" id="spanish">spanish</button>
</form>

    …确保您的<script>元素位于<body>的末尾。IIFE存在，因此您的变量不是全局变量，这意味着它们不会与window的属性冲突。

这是因为这些变量会被从DOM元素（按钮）的名称"english"answers"spanish"派生的全局变量覆盖。您可以更改按钮的名称，以免干扰您的变量，例如：

<form id="myForm" method="get">
    <button type="button" name="english_button" onClick="greet(english)">english</button>
    <button type="button" name="spanish_button" onClick="greet(spanish)">spanish</button>
</form>

你可以在这里阅读：

带有id的DOM树元素会成为全局变量吗？

相关文章：