Detailed explanation of basic syntax and data types of JavaScript

Detailed explanation of basic syntax and data types of JavaScript

Importing JavaScript

1. Internal Label

<script>
	alert("hello world");
</script>

2. External introduction

<script src="js/abc.js"></script>

Basic syntax

Defining variables

<script>
    var num = 1;
    alert(num);
</script>

Condition Control

if (2>1)
{
    alert("true");
}
<script>
    var score = 65;
    // alert(num);
    if (score>60&&score<70)
    {
        alert("60-70")
    }
    else if (score>70&&score<80)
    {
        alert(70-80)
    }
    else
    {
        alert("other")
    }
</script>

console.log("hello world"); Output in the browser console

Data Types

number

js does not distinguish between integers and decimals

123 //Integer 123
123.1 //Floating point number 123.1
1.122e3 //Scientific notation NaN //not a number
Infinity //Infinity

String

'a' "abc"

Normally, use single quotes or double quotes to wrap the string. Note the escape symbol \

\'
\n //line break\t //space\u4e2d //unicode encoding\x41 //ascii

To write a multi-line string, use backticks

var str = `haha
        nihao
        666`

Template String

let name='xay';
let words = `Hello, ${name}`;

String length

word.length

The characteristics of strings are immutable

Please add a description of the image

Case conversion

word.toUpperCase()
word.toLowerCase()

substring() is a string interception function

substring(1) // extract from the first string to the last substring(1,3) //[1,3)

Boolean

true false

Logical operations

&& //and| //or! //not

Comparison Operators

=
== // Different types, same value is true === // Absolutely equal, both type and value must be the same

NaN===NaN returns false and can only be judged by isNaN(NaN)

Arrays

<script>
    var arr = [1,2,3,4,5,'hello']
</script>

Please add a description of the image

When taking an array index, if it crosses the bounds, undefined will be output

After assigning a value to arr.length, the length of the array will also change. If the value assigned is too small, the elements in the array will be lost.

indexOf can get the subscript index of an element

Please add a description of the image

slice() can intercept part of the array, which is equivalent to substring in string

Please add a description of the image

push() pop() push and pop elements to the end respectively

Please add a description of the image

unshift() shift() push and pop elements to the head respectively

Please add a description of the image

sort() sorts by ascii

reverse()

concat() concatenates arrays

join() concatenates arrays using the specified symbol

Please add a description of the image

Object

In js, {…} represents an object. The key-value pair describes the attribute xxxxx:xxxxx. Multiple attributes are separated by commas, and the last attribute does not have a comma.

var person = {
    name: 'xay',
    age: 18,
    tags: ['js','java','python']
}

Object Assignment

Please add a description of the image

Dynamically delete the attribute delete person.name

Please add a description of the image

To add object properties, just assign values ​​directly

Please add a description of the image

Determine whether the attribute is in the object

Please add a description of the image

Process Control

If judgment

if (2>1)
{
    alert("true");
}
<script>
    var score = 65;
    // alert(num);
    if (score>60&&score<70)
    {
        alert("60-70")
    }
    else if (score>70&&score<80)
    {
        alert(70-80)
    }
    else
    {
        alert("other")
    }
</script>

While Loop

age=0;
while (age<100)
{
    age+=1;
    console.log(age);
}

for loop

for (let i = 0; i < 5; i++) {
    console.log(i);
}

for loop iterates over an array

var arr = [1,2,3,4,5,6,7,8,9,10];
for (var num in arr)
{
    console.log(num)
}

Map and Set

Map

var map = new Map([['tom',100],['jack',90],['haha',80]]);
var name=map.get('tom'); //Get value through key
console.log(name)

Similar to the dictionary in Python, set() adds data to the Map

map.set('admin',10);
map.delete('tom') //deletion in map 

Please add a description of the image

Set

Set can remove duplicates

var set = new Set([3,1,1,1,1]);

Please add a description of the image

set.add(2) //Add set.delete(1) //Delete console.log(set.has(3)); //Is there 3?

iterator

Iterating over a Map

var map = new Map([['tom',100],['jack',90],['haha',80]]);
for (let x of map)
{
    console.log(x);
}

Iterating over a Set

var set = new Set([3,1,1,1,1]);
for (let x of set)
{
    console.log(x);
}

Summarize

This article ends here. I hope it can be helpful to you. I also hope that you can pay more attention to more content on 123WORDPRESS.COM!

You may also be interested in:
  • Introduction to JavaScript basic syntax and data types
  • JavaScript learning notes_Brief talk about basic syntax, types, variables
  • JavaScript basic syntax js expression
  • Notes on learning basic javascript grammar
  • Let's learn the basics of JavaScript syntax

<<:  Problem analysis of using idea to build springboot initializer server

>>:  Notes on the MySQL database backup process

Recommend

Database query optimization: subquery optimization

1. Case Take all employees who are not the head o...

An article to master MySQL index query optimization skills

Preface This article summarizes some common MySQL...

Explanation of the execution priority of mySQL keywords

As shown below: from table where condition group ...

How to install babel using npm in vscode

Preface The previous article introduced the insta...

In-depth explanation of the global status of WeChat applet

Preface In WeChat applet, you can use globalData ...

Html to achieve dynamic display of color blocks report effect (example code)

Use HTML color blocks to dynamically display data...

How to elegantly implement WeChat authorized login in Vue3 project

Table of contents Preface Prepare Implementation ...

vue-router hook function implements routing guard

Table of contents Overview Global hook function R...

The combination and difference between ENTRYPOINT and CMD in dockerfile

In the previous article [Detailed explanation of ...

Using keras to judge SQL injection attacks (example explanation)

This article uses the deep learning framework ker...

Summary of Linux user groups and permissions

User Groups In Linux, every user must belong to a...

Detailed explanation of the use of Vue image drag and drop zoom component

The specific usage of the Vue image drag and drop...

Introduction to MySQL MHA operation status monitoring

Table of contents 1. Project Description 1.1 Back...