This article has participated in the “Digitalstar Project” and won a creative gift package to challenge the creative incentive money.

For starters, Javascript seems easy at first glance because of its C-like syntax

But no matter how it works, the constant changes made to the language (ESNext) and its framework can be overwhelming for beginners.

Learning pays off because JS can do almost anything you want with ease.

  • Want to build a Web application? no problem
  • Want to build CLI tools? no problem
  • Want to build desktop applications? Easier said than done

The increasing number of packages and libraries available every day shows just how abstract JS is when building software applications.

However, JS seems to be hated by a lot of people, mainly because it’s too traditional compared to its competitors. Anyone who might have missed the JS theoretical side will be confused.

Many people ignore the theoretical aspects of Javascript before delving into it. These concepts help us understand the different paths and patterns we take when building Javascript applications. These patterns exist in every framework in JS Land, so it makes sense to know these concepts before learning the language itself.

The characteristics of JS

More than (1) paradigm

Javascript supports procedural, object-oriented, and event-driven functional programming! It is very beneficial to master the object-oriented programming style of JS.

Object-oriented programming helps programmers visualize the components of a software application more easily. In addition, learning Typescript (Javascript with Types) makes it easy for programmers to implement the best design patterns in the industry. These design patterns are used to solve the most common problems encountered in software programming in the most efficient way.

This versatility makes Javascript very approachable and powerful.

(2)

Javascript, unlike C/C++, does not read the program at once, but rather interprets it line by line. This means JS is slower than compiled languages such as C/C++.

Warning: Javascript is notorious for being an extremely passive language at runtime, making troubleshooting errors very difficult.

But with time and practice, you’ll learn how to run it smoothly. The most common error involves your variables returning NULL values. When such problems do occur, head to Stack Overflow, because I promise you, no matter how outrageous, you are not the first person to encounter a mistake. It’s also a good idea to use console.log() freely when developing your project. This helps you pinpoint the moment in the program’s life cycle when your variables might have fallen off.

(3) single thread

Javascript can only perform one task at a time. It queues different tasks into different queues based on their type. In the most abstract sense, Javascript basically groups synchronous and asynchronous tasks and queues them separately.

Synchronous tasks are statements that are processed immediately when they are encountered, that is, they run immediately. These tasks include logging statements, variable declarations, condition checking, and so on.

Asynchronous tasks involve tasks that may require variable time to return output. An example of an asynchronous task might request information from a Web API.

In addition, Javascript has a Job Queue that handles A JS Feature called Promises.

You can actually see the single-threaded nature of Javascript by right-clicking on this web page and clicking the Check TAB. Next, go to the console TAB on the window you just opened. Enter the following code and press Enter. \

while(true) {}
Copy the code

You can now observe that the page has no response at all. This is because the Javascript on this page is now busy running the infinite while loop we executed above.

(4) a non-blocking

We’ve talked about asynchronous tasks before. Since JS runs in a single-threaded environment, it does not wait by default!

Asynchronous code blocks are executed only after all synchronous code blocks have been executed, regardless of where the code is in the program.

console.log("I am the first statement.")

setTimeout(() = > {
console.log("I am the second statement")},1000)

console.log("I am the third statement.")
Copy the code

Here console.log() logs the statements to the console, and the setTimeout() function runs the second statement a second later.

While checking the output

I'm the first statement and I'm the third statement and I'm the second statementCopy the code

We can see that the third statement is recorded before the second statement. This is because of the inherent way IN which JS handles blocks of synchronous and asynchronous code.

(5), a senior

JavaScript is a high-level language. Advanced languages may simply mean that they are closer to what humans speak. High-level languages provide more functionality to help programmers better express what they are trying to build.

This advanced feature of Javascript helps it best serve the client side of the Web. One of the major limitations of JS in the past was that it could only provide services on the client side, not file manipulation like most server-side languages.

However, this has changed NodeJS to allow developers to build back-end servers using Javascript. Thus, software developers can operate on both the server side and the client side using just one language. This causes full stack engineers to become prominent.

(6) Dynamic type

Javascript is also a dynamically typed language. This means that unlike C, which needs to specify data types for variables, we can use type-inference in Javascript to automatically detect the type of data and save variables. \

// In C variables must have data types. To change a data type from one type to another, we need to use type conversions
int a = 5;
char b = "a";
float c = 7.036;
Copy the code

In Javascript, we declare variables or constants using let and const, respectively. \

let a = 5
console.log(a) / / 5
a = 'Hello World'
console.log(a) // Hello World

const b = 'JS cool' 
console.log(b) / / JS is cool

b = 'I changed my mind.'
console.log(b) // Error: const cannot be changed
Copy the code

While type inference may seem like a plus because of its ease of use, it immediately becomes a scam for large projects that need type safety as a feature.

For this reason, larger projects use TypeScript, which is just a wrapper around Javascript that provides types, interfaces, and various other functions.

Learning strategies

It takes a while to settle in JS Land, but I have a simple checklist, Minimum Requirements, for learning frameworks like Express or ReactJS.

First, don’t rush to learn these frameworks. You need to spend some time mastering Vanilla Javascript.

Basic knowledge of

  1. Variables and constants
  2. Conditional block (if-else)
  3. Loops (for, while, forEach)
  4. Switch Case
  5. Functions

These are essential programming basics for you.

Advanced Section (Minimum)

  1. Asynchronous/wait
  2. Promises
  3. In Javascript class
  4. Rest/Spread syntax
  5. Array/object iterators
  6. An array of deconstruction
  7. Module (import, export)

Keep learning as you build your project, and soon you’ll have a strong grasp of the language.

Excellent articles of the past

❤️ Glassy login form using HTML and CSS (including the free full source code)❤️ Creating bar charts in Python catch animation ✨ 7 tips and tricks for making your console.log() output stand out ❤️ Using HTML, CSS and JS create online music player (including free complete source code)❤️

I’ve been writing tech blogs for a long time, mostly through nuggets, and this is the basic concept in one of my JS articles. I like to share technology and happiness through articles. You can visit my blog at juejin.cn/user/204034… For more information. Hope you like it! 😊

💌 welcomes your comments and suggestions in the comments section! 💌

The nuggets will be drawing 100 nuggets in the comments section after project Digital. see the event article for details