OpenLayers 6开发传参读取JSON报json未定义错误如何解决

错误原因 #

报错是JavaScript块级作用域规则导致的：

• 用let声明的变量仅在声明所在的{}代码块内可访问，出了块范围就会被销毁
• 你将let json分别写在了if和else的分支代码块内部，当代码执行完if/else分支后，json变量已经超出了作用域范围，后续调用.readFeatures(json)时自然找不到该变量，就抛出了未定义错误
• 硬编码键名的版本没有拆分if/else分支，json变量的作用域覆盖了后续调用的代码，因此不会报错

修复方法 #

只需要把json变量的声明提到if判断的外层，分支内仅做赋值操作即可，修改后的核心代码如下：

async function getFeatureProperties() {
  try {
    let response = await fetch(urlAPI);
    if (!response.ok) {
      throw new Error(`HTTP error!\n Status: ${response.status}\n Type: ${response.type}\n URL: ${response.url}`);
    } else {
      let data = await response.text();
      // 将json变量声明提到if分支外层
      let json;
      if (attr !== null) {
        console.log(attr);
        json = JSON.parse(data)[attr];
      } else {
        console.log(attr);
        json = JSON.parse(data);
      }
      const features = new ol.format.GeoJSON({
        dataProjection: 'EPSG:4326',
        featureProjection: 'EPSG:3857'
      }).readFeatures(json);
      layerVector.getSource().addFeatures(features);
    }
  } catch (e) {
    console.log(e);
  }
}

内容的提问来源于stack exchange，提问作者MaxDragonheart