Question

我正在阅读可在this link找到的开放式图层文档，但我对语法一无所知。

代码中有一部分是这样的：

function flickrStyle(feature) {
      //where does this feature come from?
      var style = new ol.style.Style({
        image: new ol.style.Circle({
          radius: 6,
          stroke: new ol.style.Stroke({
            color: 'white',
            width: 2
          }),
          fill: new ol.style.Fill({
            color: 'green'
          })
        })
      });
      return [style];
    }

    var flickrLayer = new ol.layer.Vector({
      style: flickrStyle //??? where is parameter which needs to be sent? Should this be something like flickrStyle(someParam)
    });

正如你所看到的，source是从flickrStyle函数中提取的，这显然需要特征参数，但我无法在代码中看到实际发送参数的任何地方。

这是如何运作的？

Answer 1

如果您合理且一致地格式化它会更清楚一些（通常情况下）：

function flickrStyle(feature) {
    //where does this feature come from?
    var style = new ol.style.Style({
        image: new ol.style.Circle({
            radius: 6,
            stroke: new ol.style.Stroke({
                color: 'white',
                width: 2
            }),
            fill: new ol.style.Fill({
                color: 'green'
            })
        })
    });
    return [style];
}

var flickrLayer = new ol.layer.Vector({
    style: flickrStyle //??? where is parameter which needs to be sent? Should this be something like flickrStyle(someParam)
});

传递给style: flickrStyle的对象中的ol.layer.Vector属性正在传递函数引用本身，而不是对它的调用。查看ol.layer.Vector documentation，如果/必要，ol.layer.Vector知道调用函数（传入feature参数的参数）。

显然，特定的函数不使用feature参数（并且可能只是从参数列表中省略了它），但也许作者将它留在那里，因为它确实传递了该参数的值（每个从上述文档链接的StyleFunction docs，可以编辑该函数以便以后使用它。

这是一个更简单的例子：

// Stand-in for ol.layer.Vector
class Foo {
  constructor(options) {
    this.style = options.style;
    this.counter = 0;
  }
  addElement() {
    const div = document.createElement("div");
    ++this.counter;
    div.innerHTML = "Div #" + this.counter;
    if (typeof this.style === "function") {
      this.style(div); // <=== This is like ol.layer.Vector's call to the function
    }
    document.body.appendChild(div);
  }
}

// Our style function
function ourStyleFunction(element) {
  element.style.color = Math.random() < 0.5 ? "blue" : "green";
  element.style.fontWeight = "bold";
}

// Creating an object passing in that function as an option
const f = new Foo({
  style: ourStyleFunction
});

// Doing something with it that makes it call the function
f.addElement();
f.addElement();
f.addElement();
f.addElement();

Answer 2

你是对的，$sum没有在那个方法中使用。

feature

javascript中函数参数的语法不清楚

2 个答案: