Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
3.7k views
in Technique[技术] by (71.8m points)

javascript - Function declarations should not be placed in blocks. Use a function expression or move the statement to the top of the outer function

I have the following code:

if (typeof console === "object" && typeof console.error === "function") {
    function e(msg) {"use strict"; console.info(msg);}
}

For which jsLint gives the following error:

Function statements should not be placed in blocks. Use a function expression or move the statement to the top of the outer function.

Why is it giving this error and what does it mean?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Explanation

From the jsLintErrors page about the warning Function statements should not be placed in blocks:

This error is raised to highlight code that may not work as you expect it to. In most environments Your code will run without error, but maybe not in the way you expect. In some environments it could cause a fatal syntax error.

That's because Function declarations are hoisted to the top of the scope in which they appear.

Therefore, it is not possible to conditionally declare a function with a block statement.

Example

Let's explore issues raised by this problem with a simple example:

if (true) {
    function example() {
        console.log('hello');
    }
}

The best case scenario is that your code is confusing. In the above example, it looks like what you'd like to do is only declare access to the function if the condition is true. However, when the function is hoisted to the top of the scope, it will actually be interpreted like this:

function example() {
    console.log('hello');
}
if (true) {}

This is dangerous because it doesn't look like what you'd expect based on the original code. The conditional block is actually empty (and unnecessary), and everybody has access to the function, regardless of whether the condition evaluates to true or false.

The worst case scenario is that the browser doesn't understand what to do with the nested function and throws a syntax error when trying to use it. This depends on the engine running JavaScript. It seems like Firefox is one such engine. If you run the following code in Firefox, it will throw an error when executing the following code:

if (true) {
    example();
    function example() {
        console.log('hello');
    }
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...