[Part IV | JavaScript Basics] 1: JS overview, variables and input and output

Table of contents

| Overview

| JS writing position

Assign information to variables by entering the statement prompt

| data type

JS data type special

Introduction to Simple Data Types

Simple data type Number

simple data type String

Simple data types Boolean, Undefined, Null

get type

type conversion

| Overview

Although JavaScript has "Java", it is a completely different language from Java, and even the types are different (JS is a scripting language, Java is a compiled language)

But they are grammatically similar in most places. After all, this is a not-so-professional and potentially flawed note written for back-end developers, so everyone knows Java by default.

If you don't know Java, you can come here to find out:

https://blog.csdn.net/m0_57265007/category_12003054.htmlhttps://blog.csdn.net/m0_57265007/category_12003054.html

Of course, it doesn't matter if you don't know Java. Most of the basics of this article have been introduced. But it is not zero-based, and it is more suitable for students who have a certain programming foundation to learn.

Next, let's get started...

The role of JS

Operating principle

The composition of JavaScript (the fourth part, that is, this part, learns JS syntax. The fifth part later learns JS WebAPI)

| JS writing position

code example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 内嵌JS（一打开就弹出窗口） -->
    <script>
        alert('Hello JavaScript!')
    </script>
    <!-- 外部JS文件 -->
    <script src="js/1.外部js.js"></script>
</head>
<body>
    <!-- 行内式JS（点击按钮弹出窗口） -->
    <input type="button" name="button" value="Click" onclick="alert('Hello JavaScript!')"/>
</body>
</html>

| input output

code example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        alert('请输入信息');
        prompt('请输入您的岁数：');
        console.log('控制台语句');
    </script>
</head>
<body>
</body>
</html>

| variable

Naming conventions

basic use

statement

assignment

initialization

code example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var num = 10;
        alert('num的数值是：'+num);
    </script>
</head>
<body>
    
</body>
</html>

Assign information to variables by entering the statement prompt

code example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // var num = 10;
        // alert('num的数值是：'+num);

        var name = prompt('请输入您的名字：');
        alert('您好，'+name);
    </script>
</head>
<body>
    
</body>
</html>

Examples of special circumstances

| data type

JS data type special

Variables are places where values are stored, and they have names and data types. The data type of a variable determines how the bits representing those values are stored in the computer's memory. JavaScript is a weakly typed dynamic language . This means that there is no need to declare the type of the variable in advance, and the type will be determined automatically during the running of the program.
JavaScript has dynamic typing, which also means that the same variable can be used with different types:

JavaScript data types: simple data types (Number, String, Boolean, Undefined, Null);

complex data type (Object)

Introduction to Simple Data Types

Simple data type Number

JavaScript number types can be used to store both integer values and decimals (floating point numbers).
How to express base? Add 0 in front of octal and 0x in front of hexadecimal in JS
The maximum value of JS numbers: Number.MAX_VALUE, this value is: 1.7976931348623157e+308; the minimum value: Number.MIN_VALUE, this value is: 5e-32
Three special values: Infinity (infinity), -Infinity (infinitely small), NaN (not a number)
The function judges that Number is all non-numeric NaN isNaN(x)

simple data type String

Use single or double quotes to enclose. Because the attributes in HTML tags use double quotes, here in JS we recommend using single quotes as the outermost layer of parentheses .
JS can nest double quotes with single quotes, or nest single quotes with double quotes

Escapes:

Get the string length: XXX.length For example: var strLength = str.length;
String splicing: string + any type = new string after splicing If "any type" is other data types, quotation marks are not required

Simple data types Boolean, Undefined, Null

Boolean: can be 0/1 false/true

code example

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var boolNum = true;
        alert('Boolean true + 1 = ' + (boolNum+1));

        var num;
        alert('num = ' + num);

        var num2 = null;
        alert('num2 = ' + num2);
    </script>
</head>
<body>
    
</body>
</html>

Undefined: If there is no assignment after the simple data type declaration, the default is Undefined
Null: Generally, the object is not copied, and the default is Null