javascript - Javascript 中对象的各个属性

标签 javascript html css variables this

假设我有 5 个按钮。当客户端按下其中一个按钮时,JS 将 this 对象发送到一个函数,该函数通过访问比方说 this.state 变量来更改按钮的状态。我遇到的问题是我不知道如何在 JS 中创建这些单独的变量,以便每个按钮都有其单独的变量,而其他按钮不使用这些变量。我可以使用 CSS 并更改某种 CSS 属性来完成这项工作,例如,一个 CSS 属性不会对页面中的元素执行任何操作,但可以包含不同的属性,例如从 0 到 2 的数字,它们代表状态。但这看起来不太好,因为那不是 CSS 的用途:) 我想知道这个网站上是否有人知道创建这些单独变量的方法?我是 JS 的新手,我知道我需要阅读它,但现在我正在努力解决这个问题并且无法在搜索引擎上找到解决方案。感谢所有愿意提供帮助的人!

最佳答案

页面上的每个按钮都是对象类型“HTMLButtonElement”的一个实例。这意味着您可以像对待任何其他对象一样对待它。

假设您没有按钮,只有 var me = {};。你可以很容易地写
me.state = true; 它将在对象上创建属性。

现在假设您有两个对象,var btn1 = {}, btn2 = {};。设置 btn1.state = true;。即使它们是相同对象类型(在本例中为通用“对象”类型)的实例,btn2.state 也没有受到影响。

此外,访问不存在的属性会返回特殊值undefined。当用于松散比较时,此值被认为是 false(即只是 if( btn2.state)
btn2.state == false)。这意味着如果您没有提前明确定义它也没关系,因为它的行为就像一个 false 值。

另一件需要考虑的事情是,即使两个变量可能包含同一对象类型的不同实例(例如上面的 btn1btn2),它们也不是相等,因为它们是不同的实例。请考虑以下事项:

var btn1 = {}, btn2 = {};
alert(btn1 == btn2); // false
var btn1copy = btn1;
alert(btn1 == btn1copy); // true, both variables point to the same instance

“btn1copy”在上面的代码中并不是一个合适的名字。它不是实例的副本,而是引用的副本。这意味着,因为我们明确地将 btn1btn1copy 设置为相等,所以对一个的更改影响另一个。观察:

var btn1 = {}, btn2 = {}, btn1copy = btn1;
btn1copy.state = true;
alert(btn1.state); // true
alert(btn2.state); // undefined

我希望这可以帮助您更多地了解 JavaScript 对象。如果我只是让您更加困惑,那么我深表歉意!如果我还能帮助您理解,请告诉我。

关于javascript - Javascript 中对象的各个属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19837321/

相关文章:

javascript - 在移动设备或特定分辨率下添加 <br> 标签

javascript - 如果当前时间大于且小于特定时间,如何调用函数

javascript - jQuery - 左边距减去 div 宽度的一半

css - 使菜单项和子菜单项垂直显示而不相互覆盖

html - 媒体查询 CSS 问题

javascript - 加载内容滚动底部

php - 显示表中的 MySQL、PHP 过滤结果?

html - 文本居中,即使大于容器

html - 打印的网页看起来与实际页面有很大不同

javascript - 了解 Webpack : why does it add these lines of javascript?