javascript - 解析包含字符串的 float

Question

我读到一个列表，其中包含 28 个元素，如下所示:28.6 ft2。该列表不是按数字顺序读取的，一堆用于不同区域的 float 。然后我单击页面上的过滤器，它将元素从最小到最大排序。我有一个预先加载了设计数据的数组，所以当我第一次做时，我期望它完全匹配。我需要使用预加载的 floatarray 并将它们从最小到最大排序。这是我的代码:

var areaArray = ['5,089.8 ft2', '2,511.5 ft2', '15,076.8 ft2', '5,019.8 ft2', '471.4 ft2', '462.9 ft2', '5,149.3 ft2', '1,753.6 ft2', '6,520.5 ft2', '3,327.4 ft2', '3,192.9 ft2', '2,678.5 ft2',
  '2,793.6 ft2', '1,195.0 ft2', '148.5 ft2', '39,077.1 ft2', '5,007.7 ft2', '1,746.4 ft2', '1,247.7 ft2', '230.0 ft2', '345.8 ft2', '114.1 ft2', '229.8 ft2', '349.3 ft2', '116.3 ft2',
  '235.2 ft2', '119.5 ft2', '3,038.3 ft2'
];
//the area element list
var area = element.all(by.css("[data-bind='html: area']"));

 //this has been shortened per request
  }).then(function() {
    browser.driver.get('http://iplan-qa.meetingmatrix.com/Apps/CapacityChart/mmidemo/auto/auto');
    browser.driver.sleep(2000);
    //clicks the area filter button
    element.all(by.css("[data-bind='text: displayName, visible: displayName']")).get(3).click().click();
    browser.driver.sleep(3000);
    area.count().then(function(count) {
      console.log(count);
      j = 0;

      function int_arr(a, b) {
        return parseFloat(a) - parseFloat(b);
      }
      areaArray = areaArray.sort(int_arr);
      areaArray = areaArray.reverse();
      for (var i = 0; i < count; i++) {
        //scrolls down the list element by element
        browser.executeScript("arguments[0].scrollIntoView();", area.get(i).getWebElement());
        area.get(i).getText().then(function(text) {
          console.log(text, areaArray[j], j);
          expect(text).toEqual(areaArray[j++]);
        });
      }

    });
  });
};

结果是这样的:

5,089.8 ft2 5,089.8 ft2 0
2,511.5 ft2 2,511.5 ft2 1
15,076.8 ft2 15,076.8 ft2 2
5,019.8 ft2 5,019.8 ft2 3
471.4 ft2 471.4 ft2 4
462.9 ft2 462.9 ft2 5
5,149.3 ft2 5,149.3 ft2 6
1,753.6 ft2 1,753.6 ft2 7
6,520.5 ft2 6,520.5 ft2 8
//this is be shortened per request

39,077.1 ft2 1,247.7 ft2 0
15,076.8 ft2 1,746.4 ft2 1
6,520.5 ft2 1,753.6 ft2 2
5,149.3 ft2 1,195.0 ft2 3
5,089.8 ft2 2,511.5 ft2 4
5,019.8 ft2 2,678.5 ft2 5
5,007.7 ft2 2,793.6 ft2 6
3,327.4 ft2 3,038.3 ft2 7
3,192.9 ft2 3,327.4 ft2 8

Answer 1

你不能对这些数据进行排序，将整个值解析为一个数字:

function int_arr(a, b) {
    return parseFloat(a) - parseFloat(b); // parseFloat('5,089.8 ft2') -> 5
}

您需要在空格上拆分值并将数字转换为浮点表示，删除 ,

所以 '5,089.8 ft2' 在用于比较时变为 5089.8，而不是 5

function int_arr(a, b) {
  var na = a.split(' ')[0].replace(',', '');
  var nb = b.split(' ')[0].replace(',', '');
  return parseFloat(na) - parseFloat(nb);
}

var areaArray = ['5,089.8 ft2', '2,511.5 ft2', '15,076.8 ft2',
 '5,019.8 ft2', '471.4 ft2', '462.9 ft2', '5,149.3 ft2', '1,753.6 ft2', 
 '6,520.5 ft2', '3,327.4 ft2', '3,192.9 ft2', '2,678.5 ft2'
];

areaArray.sort(int_arr);


document.getElementById("result").innerHTML = JSON.stringify(areaArray);

<div id="result"></div>