Knowledge points include: JavaScript overview, code writing specifications, three script forms that JavaScript can use, identifier naming conventions, keywords, data types, global variables, local variables, comments, assignment operators:, arithmetic operators:, comparison operator, logical operator.

Passing friends, please like and follow before you go, welcome to communicate in the comment area, and work hard to grow together!

refill

6.1 JavaScript overview and usage

JavaScript overview

JavaScript is a general-purpose, cross-platform, object-based, event-driven and secure client-side scripting language that can be directly embedded in HTML pages. Its characteristics are as follows: interpretation, nesting in HTML, weak data Typed, cross-platform, object-based, event-driven

Code writing specification:

When browsers parse JavaScript scripts, they ignore extra whitespace between identifiers and operators

Each statement occupies a separate line and ends with an English semicolon;

Code should be indented to increase code hierarchy

Three scripting forms that JavaScript can use

Inline JavaScript script

Embed JavaScript scripts in HTML, such as: mouse events and hyperlinks.

Internal JavaScript script

Extract these JavaScript scripts and place them in <script></script> tags. <script> tags are located in <head> or <body> tags

External JavaScript script

Store the JavaScript script in a separate file to completely separate the JavaScript script from the HTML code. Introduce the JS file into the HTML page through the <script> tag.

example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Javascript三个脚本</title>
    <script type="text/javascript">alert('head中的Javascript这是内部JavaScript脚本')</script>
</head>
<body>
<h1>校园评选活动</h1>
<img src="../images/sky.jpg" onclick="alert('你选择了一号种子选手')"/>
<img src="../images/sky.jpg" onclick="alert('你选择了二号种子选手')"/>
<img src="../images/sky.jpg" onclick="alert('你选择了三号种子选手')"/>
<a href="javascript:alert('请等待评选结果，谢谢.这是行内JavaScript脚本')">查看评选结果（这是行内JavaScript脚本）</a>
<!--alert()是警示框,和dialog()对话框都属于模拟弹窗，用来提示重要信息-->
<script type="text/javascript">alert('body中的Javascript这是内部JavaScript脚本')</script>
<script type="text/javascript" src="demo01.js"></script>
</body>
</html>

demo01.js

alert('外部JavaScript脚本，导入成功')

6.2 JavaScript Basic Syntax

Identifier Naming Convention

Identifiers are labels used to name variables, functions, or loops

The first letter of the identifier must be a letter, an underscore (_), or a dollar sign ($)

Identifiers are case-sensitive. It is recommended to use lowercase or camel notation. Identifiers consist of numbers, letters, underscores (_), and dollar signs ($).

Identifiers cannot be the same as keywords in JavaScript

keywords

Refers to pre-defined identifiers with special meaning in JavaScript. The reserved keywords refer to some keywords that are temporarily unused in JavaScript and may be used in later expansion. Neither keywords nor reserved keywords can be used as identifiers (including variable names, function names, etc.).

type of data

In JavaScript, the type of a variable can change, but the type at a certain moment is fixed.

Common data types are as follows

String: String is 0~n characters enclosed by double quotes (") or single quotes (')

Boolean: The boolean type includes two values, true and false

Null: The value of a variable in the table is null

Undefined: When the declared variable is not initialized, the default value is undefined

Array: A collection of variables or functions that can store data of the same type or data of different types

Number: The numeric type can be a 32-bit integer or a 64-bit floating-point number; and an integer can be in the form of decimal, octal, or hexadecimal

Function: A function is a special object data type that can be stored in a variable, array or object

Object: Objects defined by properties and methods; common objects are String, Date, Math, and Array, etc.

Operators, Expressions, and Syntax Constructs

variable

A variable is a type of identifier.

Definition of variables: Variables are declared with the keyword var.

var variable1, variable2, ... ;

Type of variable: "Variable variables in JavaScript are weak data types. You do not need to specify the data type of the variable when declaring a variable, and declare it through the keyword var.

example:

<script type="text/javascript">
    var name ,age ;
    var type="student" ;
    var school=" XX大学";

var x=30;
    alert(typeof x);
    x= "在变量的使用过程中，变量的类型可以动态改变，类型由所赋值的类型来确定。通过typeof运算符或typeof()函数来获得变量的当前数据类型。";
    alert(typeof(x));
</script>

global variable

Scope of variables: refers to the effective scope of variables, according to scope variables can be divided into global variables and local variables.

<script type="text/javascript">
    var name="全局变量"
    //函数的定义
    function test (){
        name=name+"是";
        add="定义在函数之外的变量或者未定义直接使用的变量";
    }
    //函数的调用
    test ();
    alert("名称:"+name+"指"+add);
    alert(tel) ;//此处会报错

</script>

local variable

A local variable refers to a variable declared inside a function, which is only valid for the current function body.

<script type="text/javascript">
    var name="此处为全局变量的信息";//定义全局变量
    //函数的定义
    function test(){
        var name="此处为局部变量的信息";//定义局部变量
        alert (name) ;//弹出信息:“此处为局部变量的信息”
    }
    //调用函数
    test() ;
    alert (name);
    //弹出信息:“此处为全局变量的信息”
</script>

Notes

Single line comment: double slash "//"

var age=18 ; //Define the age of the student

//define the student's major

var major="Computer major";

Multi-line comments: use "/*..*/" for identification.

6.3 Operators

assignment operator :

Used to assign values to variables, use the equal sign (=) to assign values in JavaScript.

<script type="text/javascript">
    //定义变量时进行赋值
    var goodName="王一一";
    //定义变量后，进行赋值
    var aaa;aaa="我想哈哈哈";
    //多变量同时定义，并赋值
    var math=chinese=englidh=88;
    //将表达式的值赋给变量
    var shuxue=math*0.8;
    </script>

There are also the following enhanced assignment operators

Arithmetic Operators:

Arithmetic operators are used to perform basic mathematical operations

Add (+), subtract (-), multiply (*), divide (/), take remainder (%), add (++) and subtract (--), etc.

Self-addition (++) and self-subtraction (--) are unary operators

Operators can appear on both the left and right sides of the operand. For example: a++ is to take the value of a first, and then add 1 to the variable a, that is, add one to the original basis. --a means that the variable a is first decremented by 1, and then the value of a is taken, that is, decrementing one from the original basis.

comparison operator

The result of the comparison is a boolean

The difference between == and = = = is:

== supports automatic type conversion, returns true as long as the values of the two variables before and after are the same, and ignores the comparison of data types = == only returns true when the values of the two variables are the same and the data types are the same

Greater than, when the value on the left is greater than the value on the right, return true; otherwise return false

Greater than or equal to, when the value on the left is greater than or equal to the value on the right, return true; otherwise, return false

Less than, returns true when the value on the left is less than the value on the right; otherwise returns false

Less than or equal, if the value on the left is less than or equal to the value on the right, return true; otherwise, return false

Not equal, when the values on the left and right are not equal, return true; otherwise, return false

Equal, returns true if the left and right values are equal, otherwise returns false

!==

Strictly not equal, when the values on the left and right are not equal or the data types are different, return true; otherwise, return false

===

Strictly equal, returns true when the values on the left and right are equal and the data types are the same:

Logical Operators

Operations on boolean variables (or constants)

.and (&&): When both operands are true at the same time, the result is true; otherwise, false or ): When both operands are false at the same time, the result is false; otherwise, true

Not (!): There is only one operand, the operand is true, the result is false; otherwise the result is true

Ternary operator "?:"

question mark colon

expression ? value1 : value2;

<script type="text/javascript">
    document.write(11>'11'?"数字11大于字符'11'":"数字11不大于字符'11'");
        //document.write()是向页面流中输出指定的文本信息
</script>

JavaScript Fundamentals - Ease of Use, Basic Syntax and Operators

Article directory

foreword