Home > Web Front-end > JS Tutorial > body text

Anonymous functions are a double-edged sword, with advantages and disadvantages

零下一度
Release: 2017-06-30 09:29:37
Original
1476 people have browsed it

As a functional programming language, you can imagine the important position and huge role of functions in JavaScript. But while it provides great convenience, it also inevitably brings huge problems.

Anonymous functions are a double-edged sword. They make functional programming languages ​​more perfect and make the code more difficult to read. You should know that anonymous functions come at a huge cost of semantics.

If a function does not have a name, it may not matter, and it will lose its meaning in most scenarios. The name of the function is the same as your name, your friend's name, and the name of your pet. It is important, otherwise why would you write it.

There is huge value in using named functions even in the most unnecessary places

You can probably just Enumerate many scenarios to prove the convenience of anonymous functions. It is undeniable that some scenarios undoubtedly have some truth, but most people use this as a starting point and do not do good things for small things. For example, there are many examples of

Array.some, Array.forEach, String.replace

. We can also confidently say that they do not need to use named functions. It is better to use anonymous functions. It’s convenient, and everyone does it. But don't forget that some, forEach, and replace themselves already have broad semantics. But you can still go one step further:

1.Array.some, the broad semantics is to find out whether there is some in the array, but what exactly is some?

2.Array.forEach, the broad semantics is traversal. Array provides countless functions for traversal. Why did you choose forEach instead of map, every, etc.?

3.String.replace, the broad semantics is replacement, but what exactly is it replaced with?

Code is written for people to read,

1. Can you not let me read your code and guess or deduce what you want to find out from the array? Is there an integer? , is there a null value?

2. Can you tell me directly through the function name what you want to do by traversing this array?

3. Can you tell me what you want to replace directly through the function name?

As a simple example, find out whether there is an integer price in the price array. isInteger may be an existing public function. If not, you will have it. It is concise and easy to read. When reading the main process, some codes do not need to be read. isInteger is such a code. What if there is an error? isInteger is testable and easy to test. If you are worried, perform unit testing on it. You may have noticed that with a small change, part of the code has become testable. Even though this isn't a public function, it's neater and more testable to write it as a named function.

var isAnyInteger = priceArr.some(Common.isInteger.bind(Common));

These are very extreme examples where anonymous functions can be written directly, but it is obvious that they can See, they can also be treated as boundaries of named functions, that is, writing named functions will do no harm and will only be better.

No matter how simple the code is, it is necessary to distinguish between architecture and implementation

Another hard-hit area is the then function, the anonymous function The code cannot be uglier. Even if everyone writes it this way, you should understand that you cannot write it this way. The correct posture should be written like this. Take the display order as an example:

/*
 * name        : getOrder
 * description : 获取订单数据 */function getOrder()
{//{{{var url = 'https://www.qunar.com/getOrder';//假如收集参数比较费劲,应该用一个函数专门去收集参数var params = getOrderParams();//假如参数体比较庞大,应该先将其赋予一个变量var params = {
        orderNo:'248663058'};//无论如何,现将参数赋予变量你都将获得在这里打印变量方便调试的便利console.log('getOrder url & params:', url, params);return $.post(url, params);
}//}}}/*
 * name        : renderOrder
 * description : 拿订单,拿到就在页面上展示出来,拿不到就告诉用户为什么没拿到 */function renderOrder()
{//{{{//高级函数,只安排工作,不自己实现//getOrder() 对该函数来说是不可见的,它要的只是订单数据,偷得抢的都可以    getOrder().then(render, remindUser);
}//}}}function render()
{//{{{}//}}}function remindUser()
{//{{{}//}}}
Copy after login

Of course, You may think that renderOrder is useless, and is just the same as a leader who only takes a salary and does not work. Wouldn’t it be enough to write then after $.post?

No, if one day the order can be obtained both locally and from the local cache, then getOrder will be upgraded to a sub-advanced function, which manages two functions getOrderFromServer and getOrderFromCache

If There are some things to do before or after getting the order, then renderOrder can handle it calmly.

Don’t even think about the word over-design. Most people don’t have this ability, so there is no need to worry about it.

You have been a senior architect from the beginning but just write code part-time

You can clearly see that, The extensive use of named functions makes the code structure very clear. Anyone can easily understand the main process. Anyone can easily implement each named function. What is to be implemented has been clearly written in the function name.

These named functions are like the skeleton of a house, and stacking them up becomes the skeleton of a building. Have you ever seen an architect build the walls and pour cement himself? The same goes for writing code. Functions are stacked to form a skeleton. As for how to implement each function, please help me implement it (when you first learn, you are asked to help yourself implement it).

The above is the detailed content of Anonymous functions are a double-edged sword, with advantages and disadvantages. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template