Question

我陷入困境，我知道这可能是愚蠢的！我试着弄清楚这段代码末尾的括号“）（）”是做什么的？ jsFiddle因为如果删除它们就不会显示任何内容。我需要在代码的这一部分添加更多功能，但由于括号我得到了错误。

(function () {

    var n = 143,
        duration = 750,
        now = new Date(Date.now() - duration),
        count = 0,
        data = d3.range(n).map(function () {
            return 0;
        });

    var margin = {
        top: 6,
        right: 0,
        bottom: 20,
        left: 40
    },
    width = 560 - margin.right,
        height = 120 - margin.top - margin.bottom;

    var x = d3.time.scale()
        .domain([now - (n - 2) * duration, now - duration])
        .range([0, width]);

    var y = d3.scale.linear()
        .range([height, 0]);

    var line = d3.svg.line()
        .interpolate("basis")
        .x(function (d, i) {
        return x(now - (n - 1 - i) * duration);
    })
        .y(function (d, i) {
        return y(d);
    });

    var svg = d3.select("body").append("p").append("svg")
        .attr("width", width + margin.left + margin.right)
        .attr("height", height + margin.top + margin.bottom)
        .style("margin-left", -margin.left + "px")
        .append("g")
        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

    svg.append("defs").append("clipPath")
        .attr("id", "clip")
        .append("rect")
        .attr("width", width)
        .attr("height", height);

    var axis = svg.append("g")
        .attr("class", "x axis")
        .attr("transform", "translate(0," + height + ")")
        .call(x.axis = d3.svg.axis().scale(x).orient("bottom"));

    var path = svg.append("g")
        .attr("clip-path", "url(#clip)")
        .append("path")
        .data([data])
        .attr("class", "line");

    tick();

    d3.select(window)
        .on("scroll", function () {
        ++count;
    });

    function tick() {

        // update the domains
        now = new Date();
        x.domain([now - (n - 2) * duration, now - duration]);
        y.domain([0, d3.max(data)]);

        // push the accumulated count onto the back, and reset the count
        data.push(Math.random()*10);
        count = 0;

        // redraw the line
        svg.select(".line")
            .attr("d", line)
            .attr("transform", null);

        // slide the x-axis left
        axis.transition()
            .duration(duration)
            .ease("linear")
            .call(x.axis);

        // slide the line left
        path.transition()
            .duration(duration)
            .ease("linear")
            .attr("transform", "translate(" + x(now - (n - 1) * duration) + ")")
            .each("end", tick);

        // pop the old data point off the front
        data.shift();

    }
})()

谢谢！

Answer 1

立即调用函数表达式（IIFE）

在此好读：http://benalman.com/news/2010/11/immediately-invoked-function-expression/

您当然可以添加任何函数，但由于作用域，您只能在相同或更深的范围内调用这些函数。

例如test（）函数：http://jsfiddle.net/ZaJZu/

Answer 2

您定义了匿名函数。通常是一个命名函数，如：

function myfunc(){
   //code
}

可以叫：

myfunc();

正是这个()括号正在进行中。它在完成时调用了匿名函数。如果你不想要这些，那么命名你的函数并从你需要的地方调用它，如上面的例子所示。

Updated fiddle without Parenthesis

Answer 3

整个事物的外括号将函数转换为函数表达式（而不是函数声明）。还有其他方法可以做到这一点，但括号是常见的惯例。函数表达式末尾的（）是触发立即函数调用的函数。

这不是一个自调用的匿名函数，因为它是一个递归函数。该模式称为立即调用函数表达式（IIFE）。它通常用在模块模式中，但它也经常用于将一个小的内联函数的结果赋给变量。常规的旧的invoked-later函数表达式（最后没有（））也通常作为回调传递或分配给变量，或者在对象文字中内联使用来定义方法。

javascript函数未定义错误

3 个答案: