排列对象的属性不等于原始值

时间:2017-03-28 19:27:54

标签: javascript

对于可怕的头衔感到抱歉 - 我试过了。

我试图保留一个对象的引用列表,这些对象与具有给定类的HTML页面上的元素一一对应。我可以使用Map作为键和我的自定义对象作为值来执行此操作,但是对象已经具有引用该元素的属性,因此我尝试剥离数据复制并仅对对象进行排列。但是,我认为这是一项简单的任务似乎并没有像我期望的那样发挥作用。

我甚至记录了应该比较相等的对象,它们看起来是相同的。

这是我最小,完整,可验证的例子:

<!DOCTYPE html>
<html>
<head></head>
<body>
<div id="a-widget" class="widget"></div>
<div class="widget"></div>
<script type="text/javascript">
  var widgetsArr = new Array();
  var widgetsMap = new Map();

  function createWidget(element) {
      var widget = Object.create(null);
      widget.element = element;
      return  widget;
  }

  function initWidgets() {
      var elements = document.getElementsByClassName('widget');
      for (var i=0; i < elements.length; ++i) {
          widgetsArr.push(createWidget(elements[i]));
          widgetsMap.set(elements[i], createWidget(elements[i]));
      }
  }

  function getWidgetByElementFromArr(element) {
      widgetsArr.forEach(function(item, index, array) {
          if (item.element === element)
              console.log(item);
              return item;
      });
  }

  function getWidgetByElementFromMap(element) {
      var widget = widgetsMap.get(element);
      console.log(widget);
      return widget;
  }

  initWidgets();
  console.log(widgetsArr[0]);
  console.log(widgetsArr[0] === getWidgetByElementFromArr(document.getElementById('a-widget')));
  console.log(widgetsMap.values().next().value);
  console.log(widgetsMap.values().next().value === getWidgetByElementFromMap(document.getElementById
('a-widget')));
</script>
</body>
</html>

1 个答案:

答案 0 :(得分:2)

传递给<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:orientation="vertical" tools:context="com.demo.MainActivity"> <WebView android:id="@+id/webview" android:layout_weight="4" android:layout_width="match_parent" android:layout_height="0dp" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_alignParentStart="true" > </WebView> <Button android:layout_below="@+id/webview" android:text="Button" android:layout_weight=".5" android:layout_width="match_parent" android:layout_height="0dp" android:layout_x="154dp" android:layout_y="431dp" android:gravity="center" android:id="@+id/button" /> </LinearLayout> 的函数不会导致循环终止或返回与您预期的值相同的值。它将始终循环遍历整个数组,而不返回奇异值。请改用forEach

find

该函数的其他问题:它没有function getWidgetByElementFromArr(element) { return widgetsArr.find(function(item, index, array) { return (item.element === element); }); } 语句。 return正文周围缺少{}

注意,所有地方都不支持if,因此请根据需要使用填充或使用find或其他一些解决方法。