JavaScript-Quick Start

I. Overview

Development history: https://www.w3school.com.cn/js/pro_js_history.asp
The scripting language developed in 10 days has low code rigor and will not report errors in many places.

The introduction of Javascript: internal label and external introduction

Internal label: type in the body

<script>//内部标签
			alert("hellw world");
		</script> 

External introduction: usually placed at the bottom of the head or body

<script src="xxx.js"></script> //外部引入

JS file

alert("hello")

Note: In the script tag, the single-line comment is // and the multi-line comment is /* */, which is the same as java. If different import methods are in the same file, the alerts inside will pop up in order.

2. How to use the browser console

Use JavaScript to achieve process control, such as:

<script>
		var score=59;//定义变量：变量类型 变量名=值
		if(score>60&&score<70){
    
    
			alert("60-70");
		}else if(score>70&&score<80){
    
    
		    alert("70-80");
		}else{
    
    
			alert("other");
		}
</script> 

Then the content of the pop-up window is "other". If
you want to further observe the running results of each step in the process control, you can run the file from the editor to the browser, and you can open it by right-clicking (review element)/Ctrl+Shift+I The content of the control page is as follows: The

above picture is the initial interface, among which:
Element : Analyze HTML and CSS code.
Console (console) : write JavaScript code, and output.
Common commands-print variables in the browser console: console.log(); is similar to Java's System.out.println();. The following is the result displayed by the variable score in the printed script.

Sources : The current source directory.

There is a monitoring tool in the debugging tool on the right, which has a breakpoint function. You can jump to the breakpoint by refreshing the webpage after breaking the breakpoint. Half-circle arrow plus dot (Step over next) means execution to the end, down arrow plus dot (Step into next) to go one step down, and up arrow plus dot (Step out of current) to go one step up. Used for debugging to find errors step by step.

Network : Network request.
Application : It is equivalent to the database in the web, and saves some simple data in the web page.
①Local Storage: Local storage is used more in H5, but it is not used much now. It should be used in VUE, such as state management.
②Session Storage: Store Session.
③Cookies: the most used later.

Three, data type introduction

Variable : variable type variable name = variable value
naming variable name:
first place: letter, $, _
content: number, the rest is the same as above
Note: keywords cannot be named, and Chinese should not be used for naming as much as possible.
number : Integer (does not distinguish between integers and decimals), floating-point numbers (with precision problems, try not to use them for calculations), scientific notation, negative numbers, NaN (not a number), infinity (infinite)
string : single quotes enclose
null : Empty
undefined : undefined
logical operation : &&, ||,!
Comparison operator : = assignment
means equal: == (the data type on both sides of the equal sign can be different, and the value is true)
=== (the data type on both sides of the equal sign must be the same, and the value is true)
Note: Judging NaN cannot be used Comparison operator, you can use isNaN(), as shown in the figure:

Array : square brackets are generally used, and the elements in the array can have different attributes.

var arr = [1,null,'1',true];//可读性更高
new Array(1,null,'1',true);

Object : generally use braces, and each attribute is separated by a comma.

var person={
    
    
   name:"lywl",
   age:"19",
   tags:['html','css','js']
}

The value can be directly taken through person.

Five, strict inspection mode

For example, define the following variables:

i=1;//全局变量（默认），未定义
let j=2;//定义局部变量,一般用于ES6

In order to make Javascript more rigorous and avoid some errors, available

‘use strict’

Must be placed in the first line of the script tag, so that i is not defined as a variable, thereby reporting an error. So when writing code daily, remember to define variables first.

Note: IDEA needs to be set to support ES6 syntax.