You can see

• JS fun
• The most basic
• Conditional statements
• While, for loop statements
• Break and continue
• Label statement
• recommended

— Source: Hungry Man Valley

Something to say

This article ✍ helps me learn some basic JavaScript syntax, if you are an expert and want to fix flaws, if you are really bad like me, then my series of notes will help you.

---

JS fun

Comments from several people

Evaluation of JS by the father of JS

What’s good about it isn’t original. What’s original about it isn’t good. (Most of the good stuff was borrowed from other places, and the stuff I designed sucked.)

— Some critics of JS

Wang Yin:

Many JavaScript programmers also blindly despise Java, when JavaScriptPython and Ruby are worse. The JavaScript community has a reputation for being naive and ignorant. You often find very basic commonsense things that JavaScript “experts” talk about at conferences as if they were great discoveries. I don’t see the point of the JavaScript community having those meetings, as if they were just for networking and job hunting.

Some people’s defense of JS

There are only two programming languages in the world, the ones you curse every day and the ones nobody uses.

JavaScript: The world’s most misunderstood language.

The value of JS

• The value of a language is determined by the value it produces.

JS is the most widely used language in the world.

JS is a very low barrier language (you can learn JS by opening a browser console, as long as you don’t learn the crap). .

JS is a language that generates value (e.g. live streaming).

Advice received:

Learn JS to take its essence, discard its dross. 2. Love a language, but accept its flaws. 3. Never learn just one language, expand your horizons.

---

The most basic

Expressions and statements

• expression

The 1+2 expression has the value 3

The value of the add(1,2) function call expression is the return value of the function (only functions have return values).

The value of the console.log expression is the function itself

What is the value of the console.log(3) expression? (The value is undefined, the printed thing is 3)

• statements

Var a = 1

• The difference between the two

Expressions – generally have values, statements may or may not have values.

Statements generally change the environment (declaration, assignment).

The above two statements are not absolute. Sometimes expressions can change the environment, and sometimes statements can take values.

Case sensitivity

Var a and var a are different.

Object and object are different.

Function and function are different.

Space and carriage return

Most Spaces are meaningless, for example var a=1 is no different from var a=1.

Carriage return doesn’t matter most of the time.

There’s only one place you can’t add a return, and that’s after return. If you don’t add anything to return, it automatically adds undefined. This is the original JS

identifier

• The rules

The first character can be a Unicode letter or $or _ or Chinese and so on.

The following character, in addition to the above, can have a number (the number cannot be the first)

• Variable names are identifiers

Var_ = 1

Var $= 2

Var___ = 6

Var hello = ‘hi’…

Classification of annotations

• Bad comments (describe what you did)

Translate the code into Chinese (potentially confusing, hiding important comments, low signal-to-noise ratio).

Obsolete comments (code and comments may be different, obsolete).

Venting comments (professionalism issues).

• Good comments (why do you do this, the implication of the pit)

Step on the hole notes.

Why the code was written so strangely, what bugs were encountered (possibly special requirements).

Block block

• Package code together (code blocks)

{
  let a = 1
  let b = 2
}
Copy the code

• Often used with if/for/while

Here is the basic JS syntax

---

Conditional statements

Can see the if else statements, switch case, a question mark colon expression, && short circuit logic, | | short circuit logic basic usage

If else basic syntax

If (expression){statement 1}else{statement 2}

Parentheses cannot be saved, curly braces can be saved.

{} can be omitted when the statement has only one sentence. This is not recommended.

• Abnormal situation

A =1 assigns 1 to a, a===1 assigns 1 to A, and a===1 assigns 1 to A.

② Statement 1 can be very abnormal, such as nested if else

a = 2
if( a < 100)
  if( a < 10)
  	console.log('a less than 10')
// Run on Chrome console: a is less than 10
Copy the code

③ Statement 2 can be very perverted, such as nested if else

a=2
if( a < 100){
}else if{a > 1000} {console.log('a greater than 1000')}else{}// Get rid of the else curly braces in if else and change to else if, there are two lines of if else
Copy the code

④ Indentation can also be very abnormal, as follows

a = 1
if(a === 2)
  console.log('a')
  console.log( 'a is equal to 2')
Log ('a') console.log('a') console.log('a'). If the curly braces are omitted, only the first sentence console.log('a'), which is actually enclosed by an invisible parenthesis */
Copy the code

• The most recommended way of writing

The most recommended way for someone like me to write is the least ambiguous

if(expression) {statement}else if(expression){statement}else} {statementsCopy the code

• What are the recommended methods to use

function fn(){
  if(expression){returnExpression}if(expression){returnExpression}returnExpression}// If there is a return statement, you can omit the else
Copy the code

Switch statement (note break, use it sparingly if not)

— If else updated version

• grammar

switch (fruit) {
case "banana":...break;
case "apple":...break;
default:... }// Fruit is the fruit of the road, walk that way, if not, walk default
Copy the code

• break

Most of the time, you can’t omit “break”

A few times, you can use break

a = 2
switch(a){
  case 1:
  case 3:
    console.log('singular');
    break;
  case 2:
  case 4:
    console.log('dual');
    break;
}
//case 2: no break continues following case 4: until break
//JS was born too early without using a good example
Copy the code

Question mark colon expressions (use question mark colon expressions instead of if else)

grammar

The expression 1? Expression 2: Expression 3

Example:

/ / the original
function max(a,b){
  if(a>b)return a;
  else return b;
}
//a>b is a, otherwise it is b
Copy the code

// question mark colon expression
function max(a,b){
return a>b ? a: b
}
//a>b is a, otherwise it is b. Isn't that a lot simpler
Copy the code

This is often used to simplify if and else statements

&& short circuit logic

&& means what and what. It can also be used instead of if else

A && B && C &&D takes the first false value, not the last false value, and most of the time it doesn’t take true/false

• Table A && B:

A\B	true	false
true	B(AB is true and B is the value of the expression)	B(if A is true, see B; if B is true, it is true; if B is false, it is false)
false	A(A = false)	A(A为假直接整个都是假)

Short circuit logic:

It’s B in the case that both are true, and as long as A is false, it’s A.

If the front is false, look at the front, if the front is true, look at the back.

• Code interpretation

if(window.f1){
  console.log( 'f1 there')}Copy the code

window.f1 && console.log( 'f1 there')
Copy the code

Don’t write if if you can write ampersand. For example, console && console.log && console.log(‘hi’) means: if console exists, it depends on whether console.log exists. Log console.log(‘hi’). Advantage :IE does not have console, the first false, after the implementation of no.

| | short circuit logic

Or, conversely, the same thing

C | A | B | | | | D take first true value or D, does not take A true/false

Code explanation:

a = a || 100

// If a is present, the value of a is assigned to a. If there is no A, the value of a is guaranteed to be 100

if(a){
  a = a
}else{
 a =100 / / the guaranteed value
}

Copy the code

---

While, for loop statements

While loop (when… When)

• grammar

While (expression){statement}

• Determine whether the expression is true or false

When the expression is true, the statement is executed and the expression is checked again after execution

When the expression is false, the following statement/escape is executed

• other

The do… While is not used very much

• Abnormal cycle

while(a ! = =1) {console. log(a)
  	a = a+ 0.1
}// An infinite loop freezes
/* a = 0.99999999999999 /* a = 0.1 Floating point numbers are imprecise, never equal to 1, always looping */

Copy the code

var a = 0.1 / / initialization
while(a ! = =1) {/ / determine
console.log(a) // Void void void void void
a = a + 0.1 / / growth
}
// All three of the four loops are necessary except for the body of the loop
Copy the code

The for loop

• Syntactic sugar

The for loop is a convenient way to write the while loop

• grammar

for(statement1; expression2; statements3){loop body}Copy the code

Execute statement 1, and then determine expression 2,

If true, the body of the loop is executed, followed by statement 3.

If false, exit the loop and execute the following statement.

Here’s a perverted example:

for(var i=0; i<5; i++){
  setTimeout(() = >{
    console.log(i)  
  },0)}// The result is 5 5,
Copy the code

Note setTimeout is later than the end of the loop. How to solve it? Let = let = let = let = let This is JS specially for us this kind of novice white add.

If the condition is not written, the loop body will always be executed, resulting in an infinite loop.

---

Break and continue

Break and continue mean to exit the nearest loop and the current loop, respectively

Let’s do it in code

Break:

for(var i=0; i < 10; i++){
  if(i%2= = =1) {break}}/ / the result: 1
Copy the code

The continue:

for(var i=0; i < 10; i++){
  if(i%2= = =1) {continue
  }else{
    console.log(i)
  }
}
// Result :0 2 4 6 8
Copy the code

---

Lable statement(Code block, understood. Maybe the interview will ask)

Syntax is tags plus code blocks

foo: {
  console.log(1);
  break foo;
  console.log('This line will not print');
}
  console.log(2);
  
// Result :1, 2
Copy the code

Foo, which is a tag, represents a block of code in curly braces, break foo jumps out of the block and goes directly to console.log(2).

Foo: 1 console.log(2) // Result :2Copy the code

  

{foo: 1 console.log(2)} // Result :2Copy the code

This is a code block, and the first line of the code block is a label, and the label says 1, and the second line prints 2

{ foo: 1; } // there is a block of code with a tag called foo, and the content of foo is 1Copy the code

This code block has only one line called 1

With only one sentence:

Chrome does not return the mark 1, hit the semicolon here becomes an object, Chrome has its own ideas.

Firefox simply returns 1 with no object.

— Congratulations on getting 🍗 one. If you remember, you can click here to return to the top 👆

–continue

---

recommended

• Ruan yifeng’s free tutorial introduction
• ‘JavaScript you don’t know’ can be read first volume, suitable for advanced

---

Now that I’ve seen this, I’m going to tell you a secret