JavaScript-快速入门

一、概述

发展历史：https://www.w3school.com.cn/js/pro_js_history.asp
10天开发出的脚本语言，代码严谨性不高，许多地方不会报错。

Javascript的引入：内部标签与外部引入

内部标签：在body里输入

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

外部引入:通常置于head或body底部

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

JS文件中

alert("hello")

注意：在script标签中，单行注释为 // ，多行注释为 /* */ ，与java相同。若不同引入方式在同一文件中，则里面的alert按顺序依次弹出。

二、浏览器控制台如何使用

运用JavaScript可实现流程控制，例如：

<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> 

则弹出弹窗内容为"other"
想进一步观察流程控制途中每一步的运行结果，可将文件从编辑器运行到浏览器后，可通过右键-检查（审查元素）/Ctrl+Shift+I来打开控制页面，其内容如下：

上图为初始界面，其中：
Element：分析HTML和CSS代码。
Console（控制台）：写JavaScript代码，并且输出。
常见命令——在浏览器的控制台打印变量：console.log();与Java的System.out.println();相似。以下便是打印script中的变量score所显示的结果。

Sources：当前的源码目录。

右侧的调试工具中有监视工具，有打断点的功能，打了断点刷新网页就可以跳转至断点处。半圆形箭头加点（Step over next）是执行到结束，下箭头加点（Step into next）往下走一步，上箭头加点（Step out of current）是往上走一步。用于调试一步一步找错误。

Network：网络请求。
Application：相当于web里的数据库，将一些简单的数据保存在网页里。
①Local Storage：本地存储，在H5里用的比较多，但现在不怎么用，在VUE里要使用它，如状态管理。
②Session Storage：存Session的。
③Cookies：后面可能用的最多的。

三、数据类型介绍

变量：变量类型 变量名=变量值
变量名命名：
首位：字母，$，_
内容：数字，其余同上
注意：关键字不可命名，中文尽量不用来命名。
number：整数（不区分整数小数），浮点数（存在精度问题，尽量不用来计算），科学计数法，负数，NaN（not a number），infinity（无限大）
字符串：单引号括起
null：空
undefined：未定义
逻辑运算：&&，||，！
比较运算符：=赋值
表示等于：==（等号两边数据类型可以不一样，值一样则为true）
===（等号两边数据类型必须一样，值一样为true）
注意：判断NaN不能用比较运算符，可以用isNaN()，如图：

数组：一般用中括号，数组中元素可为不同属性。

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

对象：一般用大括号，每个属性间用逗号隔开。

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

可通过person.直接取其值。

五、严格检查模式

例如定义如下变量：

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

为了使Javascript更严谨，避免产生一些错误，可用

‘use strict’

必须放在script标签中第一行，使i不被定义为变量，从而报错。所以日常写代码时，要记得在前面先定义好变量。

注意：IDEA需要设置支持ES6语法。