E003Web学习笔记-JavaScript（一）：JS基础

拼搏现实的明天。 2024-04-17 05:57 85阅读 0赞

# 一、概述 #

## 1、概念 ##

客户端脚本语言；

**解释：**运行在客户端浏览器中，每一个浏览器都有JavaScript的解析引擎；

**脚本语言：**不需要便宜，直接就可以被浏览器解析执行；

## 2、功能 ##

增强用户与html的交互，可以控制html元素，让页面有动态效果，增强用户体验；

## 3、发展史 ##

![20190825120110601.jpg][]

# 二、JavaScript基础语法 #

## 1、与HTML的结合方式 ##

### ①内部JS ###

### ②外部JS ###

**代码示例：**

**外部JS：**

alert("hello world!_外部!");

**HTML：**

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>JS基础语法演示</title>
    		
    		<script src="js/js.js" type="text/javascript" charset="utf-8"></script>
    		
    		
    		<script type="text/javascript">
    			alert("hello world!_内部!");
    		</script>
    	</head>
    	<body>
    		<div class="c1">
    			Hello!
    		</div>
    	</body>
    </html>

## 2、注释 ##

// 单行注释
    /*多行注释
    多行注释
    多行注释*/

## 3、数据类型 ##

### 原始数据类型（基本数据类型）； ###

①number：数字——整数、小数、NaN（特殊的数字not a number不是数字的数字类型）；

②string：字符、字符串；

③boolean：true、false；

④null，一个对象为空的占位符；

⑤undefined：未定义，如果一个变量没有给初始化值，则默认为undefined；

### 引用数据类型（对象）； ###

## 4、变量 ##

### 变量： ###

一小块存储数据的内存空间；

Java语言是强类型语言，而JavaScript是一个弱类型语言；

**强类型：**在开辟空间时，定义了存储数据的类型，只能存储相应类型的数据；

**弱类型：**在开辟空间时，没有定义存储数据的类型，对所存储数据的类型没有要求；

### 声明JS变量： ###

**语法：**var 变量名 = 变量值;

**代码演示：**

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>JS变量演示</title>
    		<script type="text/javascript">
    			var a = "哈哈哈";
    			document.write(a);
    		</script>
    	</head>
    	<body>
    	</body>
    </html>

### 获取变量的数据类型： ###

typeof(变量名);

## 5、运算符 ##

### ①一元运算符：只有一个运算数的运算符，如++ -- +（正号） ###

### ②算术运算符，如+ - \* / % ###

### ③赋值运算符，如 = += -= ###

### ④比较运算符，如> >= < <= == ===（全等于） ###

**比较方式：**

1、类型相同：直接比较
    字符串按照字典顺序比较；
    
    2、类型不同：先进行类型转换，再比较
    === 全等于，判断之前先进行类型的比较，如果不一样直接返回false

### ⑤逻辑运算符，如&& || ！ ###

**备注：**

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>逻辑运算符演示</title>
    		<script type="text/javascript">
    			var obj = null;
    			var obj1 = "";
    			// 备注:此处无论是否为null或者空字符串,返回的都是false
    			if(obj){
    				alert("不是空啦");
    			}
    			if(obj1){
    				alert("不是空啦");
    			}
    		</script>
    	</head>
    	<body>
    		
    	</body>
    </html>

### ⑥三元运算符，如? : ###

##  ##

## 6、JS里面的特殊语法（了解） ##

①js中语句结尾以分号结尾，如果一行只有一条语句，则分好可以省略（不建议这样做）；

②变量的定义可以使用var关键字，也可以不用（也不建议这样做），但是注意：用则定义的是局部变量，不用则定义的是全部变量；

## 7、流程控制语句 ##

跟Java一模一样！

[20190825120110601.jpg]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/15/96bb2ef6d2c947b385ee144f13f95c2a.jpg