Functional JavaScript (1) Introduction _ javascript skills

JavaScript is a powerful but misunderstood language. People have different opinions about whether it is an object-oriented or functional language-but now let us leave all these arguments behind. Let's pretend that we want to complete a task: Write JavaScript code according to functional language principles as much as possible.

The next series of articles will help you and me start this journey. First, we need to correct some concepts that may have functional language errors in your mind.

The function type in JS language is seriously misunderstood.

Obviously, a considerable number of developers need to use the functional paradigm of JavaScript every day. I would like to say that more JavaScript developers do not really understand these things.

I think the reason is that the vast majority of development languages for Web servers come from C, and everyone knows that these languages are not functional languages.

There are usually two levels of confusion. The first layer is about the usage in the following example, which is very common in jQuery:

$(".signup").click(function(event){    $("#signupModal").show();    event.preventDefault();});

In the above Code: We passed an anonymous function as a parameter, which is the notorious callback function in JavaScript. Will these functions be called? No!

The example above illustrates a key feature of functional language: a function is a parameter. On the other hand, this example only uses three lines of code to violate almost all functional programming paradigms that can be violated.

The second-level questions are more subtle. Look at this: Only a few trendy JS developers look at themselves like this:

Well, it's really good! But I already fully understand functional programming, and I have used Underscore. js in all projects.

Underscore. js is a well-known and ubiquitous JavaScript library. For example, suppose I have a group of words and I need the first two letters of each word. This is very simple to write using Underscore. js:

var firstTwoLetters = function(words){    return _.map(words,function(word){        return _.first(word,2);    });};

Let's look at this JavaScript example. I used exquisite and practical functions in the function formula: _. map and _. first. What do you think about this?

Although functions such as underscore. js and _. map are very useful functional paradigms, it is hard for me to put these things together in this example. Do we really need to do this?

If we start to think about how to make it more functional, we can rewrite the above example as follows:

// ...a little bit of magicvar firstTwoLetters = map(first(2));

Think about it. This line of code has the same effect as the above five lines. Many words are just parameters or placeholders. The real logic is to combine map function, first function, and constant 2 in a meaningful way.

Some may wonder: Where is the magic in this example? After all, the magic of any example is like boasting, right?

I am planning to use the following two articles to explain the magic of the above example. If you are curious, continue to read it.

This series of blogs aims to help you apply the beauty of functional programming to your JavaScript code.

In the next section, I will discuss functional and non-functional elements in JavaScript. With this knowledge, we can integrate these elements to gradually form a complete functional programming system in our minds and understand their performance in JavaScript.