for循环导致无法设置未定义的属性'0'

Question

在下面发布的代码中，我想遍历数组的内容

features[0]["values_"]["geometry"]["flatCoordinates"]

对于 for 循环之外的所有控制台语句，它们被打印出来并包含 data.however，当我运行应用程序时，我收到以下错误

ERROR TypeError: Cannot set property '0' of undefined

为了解决这个问题，我注释掉了 for 循环中的前两行，并打印了变量 'i' 的值。只有当我在循环中激活前两行时，才会收到错误消息。请让我知道如何修复此错误

代码:

private renderSelectedSite(){
    var features = (new GeoJSON()).readFeatures(this.selectedSite.geometry);
    console.log("this.selectedSite.geometry: ",this.selectedSite.geometry)
    console.log("features ",features)
    console.log("features ",features[0]["values_"]["geometry"]["flatCoordinates"])
    console.log("features ",features[0]["values_"]["geometry"]["flatCoordinates"].length)//84
    console.log("features ",features[0]["values_"]["geometry"]["flatCoordinates"][0])//736437.816446109
    var points: any[];
    for (var i = 0; i < features[0]["values_"]["geometry"]["flatCoordinates"].length; i++) {
        var e = features[0]["values_"]["geometry"]["flatCoordinates"][i];
        points[i] = transform(e,'EPSG:4326','EPSG:3857');
        console.log("points[i] ",i)
    }

Answer 1

您需要初始化变量points。

var points: any[] = [];

以下是我建议的一些 QOL 改进：

使用 const/let 而不是 var。请参阅 here 了解规范差异。
使用 Array#map 代替 for。

private renderSelectedSite(){
  const features = (new GeoJSON()).readFeatures(this.selectedSite.geometry);
  let points: any[] = features[0]["values_"]["geometry"]["flatCoordinates"].map(e => 
    transform(e,'EPSG:4326','EPSG:3857')
  );
}

正如@Cerbrus 在评论中提到的，我还将帮助进行类型检查以定义对象的类型（例如，使用 TS 接口）并使用点访问而不是使用括号表示法来访问属性。

更新：登录内部 `Array#map`

如果您有多个语句，请将回调括在花括号中并显式 return 响应。

let points: any[] = features[0]["values_"]["geometry"]["flatCoordinates"].map(e => {
  console.log(transform(e,'EPSG:4326','EPSG:3857'));
  return transform(e,'EPSG:4326','EPSG:3857');
});

console.log(points);

更新：重复问题

希望这也能解决 here and here 的问题。请停止针对同一问题发布重复问题。

如果您确定平面坐标始终只包含 8 个条目，则可以毫不费力地构建排列坐标。

const flatCoords = features[0]["values_"]["geometry"]["flatCoordinates"];
const coords = [
  [flatCoords[0], flatCoords[1]],
  [flatCoords[2], flatCoords[3]],
  [flatCoords[4], flatCoords[5]],
  [flatCoords[6], flatCoords[7]],
];

然后您可以迭代数组并使用 Array#map.

获取点

let points = coords.map(coord => transform(coord,'EPSG:4326','EPSG:3857'));

更新：平坐标动态数

您可以编写一个快速例程将平面坐标转换为所需格式

toCoords(flatCoords: any) {
  let coords = [];
  for (let i = 0; i < flatCoords.length; i += 2) {
    coords.push([flatCoords[i], flatCoords[i+1]])
  }
  return coords;
}

const coords = this.toCoords(features[0]["values_"]["geometry"]["flatCoordinates"];
let points = coords.map(coord => transform(coord,'EPSG:4326','EPSG:3857'));

for循环导致无法设置未定义的属性'0'

for-loop causes Cannot set property '0' of undefined

javascript

openlayers

geojson

typescript

angular

更新：登录内部 `Array#map`

更新：重复问题

更新：平坐标动态数

for循环导致无法设置未定义的属性'0'

for-loop causes Cannot set property '0' of undefined

javascript

openlayers

geojson

typescript

angular

更新：登录内部 Array#map

更新：重复问题

更新：平坐标动态数

更新：登录内部 `Array#map`