[toc]
# 每日英语
1. `unexpected` 未符合期望(关键字没写对的时候)
2. `document` 文档(有时候缩写为doc/docs)
3. `print` 打印(python print "hello world" )
4. `identifier` 标识符(解释器碰见不认识的代码时, 报错)
5. `model` 模型(DOM)
6. `current` 当前(currentStyle 当前样式)
7. `computed` 计算(getComputedStyle 计算当前样式)
8. `bug` 错误(本意臭虫)
9. `debug` 排错/调试(高级编辑器,ide必备功能)
# 重点再讲解
## 什么是解释性语言, 什么是编译性语言?
* 高级语言: 人类可以看懂的语言( 人类可以看懂, 电脑看不懂 )
* 机器语言: 电脑可以看懂的语言( 人类看不懂, 电脑可以看懂 )
* 解释性语言的翻译时机: 读取一句, 解释一句, 运行一句
> JIT(just in time):即时性的
* 解释器(翻译角色)js解释器也叫js引擎
* 编译性语言的翻译时机:先整体翻译, 转成机器码, 打包成操作系统可以识别的格式(exe)
* 编译器(翻译角色)
## 什么是弱类型语言, 什么是强类型语言?
* 弱类型语言:变量的数据类型改变, 不会报错, 没有问题(根据变量的值, 来确定变量类型)
* 强类型语言:变量的数据类型改变, 会报错(变量类型是提前声明的)
* 最主要的区别:数据类型是否可变
```javascript
// 有一个name是China;
var name = "China"; // 初始化语句, 声明一个变量name, 赋值“China”
name = "USA"; // 强类型, 弱类型都可以
name = 123; // 弱类型没问题, 强类型会报错
```
## JavaScript由哪几部分组成?
### ECMAScript
#### ECMAScript是什么?
* javascript 可以看成英语
* ECMAScript 标准, 语法
```javascript
// 有一个name是China;
var name = "China"; // 初始化语句, 声明一个变量name, 赋值“China”
name = "USA"; // 强类型, 弱类型都可以
name = 123; // 弱类型没问题, 强类型会报错
```
* 为什么有标准, 就会存在兼容性问题?
* 不同浏览器, javascript解释器不同, 对标准的执行严格程度(支持率)不同
* 解决兼容性, 只能增加代码量, 适配不同浏览器
* 越新的标准, 越不容易被兼容, 不要喜新厌旧, 稳定是第一位的.
## DOM是什么?
### DOM
> document object model(文档对象模型)
* javascript最主要做两件事
1. 找对象
2. 操作对象
* 兼容性问题(不同浏览器, DOM支持的属性和方法不一样)
* 兼容性导致代码量上升
![](https://box.kancloud.cn/5708c3107981623ef2f2379c46b0fb69_425x215.png)
代码必须符合规范才能执行. 初级bug
```javascript
var name1 = "Hello"; // 正常初始化
console.log(name1); // hello
def name2 = "hello"; // 报错, 不认识def
console.log(name2); // Unexpected identifier
```
## BOM是什么?
### BOM
#### 什么是BOM?
> browser object model
#### 兼容性问题
完全不用担心兼容性问题, 因为完全不兼容 不建议使用BOM, 完全解决兼容性问题
# JavaScript的有哪三种引用方式?
## 行内样式
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<input type="button" value="快点我, 快!!!" onclick="javascript:alert('good!!!')">
</body>
</html>
```
## 嵌入式
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
function clickMe(){
alert('hello world');
}
</script>
</head>
<body>
<input type="button" value="快点我, 快!!!" onclick="clickMe()">
</body>
</html>
```
## 引入式
```javascript
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="hello.js"></script>
</head>
<body>
<input type="button" value="快点我, 快!!!" onclick="clickMe()">
</body>
</html>
```
> hello.js
```javascript
function clickMe(){
alert('click me, please!!!!');
}
```
## 什么是变量?
> 值可以变化的量
### 如何初始化变量?
> 变量的声明+变量的赋值 = 变量的初始化
> 注意: name 是浏览器的保留字 , 不建议在 js 中使用
```javascript
var name = "China"; // 变量初始化语句
var name1; // 变量的声明语句
name1 = "USA"; // 变量的赋值语句
```
### 变量命名
#### 命名注意事项
1. 保留字不能用, name 不建议使用, 也是保留字
## 变量命名
### 命名注意事项
1. 保留字不能用, name 不建议使用, 也是保留字
1. 字母, 数字, 下划线,美元符号来组成, 但是数字不能开头
![](https://box.kancloud.cn/2bc9e2c234a8f4942d9ce6bfd504461c_637x138.png)
1. 可以使用中文作为变量名吗(可以)
```javascript
var 帅哥 = "许竣皓";
console.log(帅哥);
```
## 命名方式
1. 推荐驼峰命名(js大小写敏感)
```javascript
var userPassword; // 用户密码, 小驼峰
var UserPassword; // 用户密码, 大驼峰
```
## md5加密
> MD5是一种加密算法 他只是加密对象的简单描述 身份证和本人的关系 用来验证加密对象 与文件大小无关 理论上, md5无法解密 可支持, 一次md5的简单内容, 进行解密 可以多次md5, 修改加密后的字符串来提高安全性
## md5验证用户信息原理
1. 接受用户信息, 手机号, 密码明文
2. 如果手机号不存在, 提示用户不存在
3. 通过手机号, 查询数据库, 获取对应的密码密文
4. 使用同样的加密方式, 加密用户的密码明文, 得到当前密文
5. 比对数据库中的密文和当前密文
## 如何一次初始化多个变量?
```javascript
var a = 1, b = 2, c = 3, d = 4; // 一次声明多个不同变量,逗号分开
var a = b = c = d = 4; // 一次声明多个相同值的变量
```
## 如何显示变量值?
1. 控制台 console.log(变量)
```javascript
var a = 1, b = 2, c = 3, d = 4; // 一次声明多个不同变量,逗号分开
console.log(a);
console.log(b);
console.log(c);
console.log(d);
```
1. 弹窗 alert(变量)
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
var userName = "China";
alert(userName); // 弹出变量的值
</script>
</body>
</html>
```
1. 控制台中实时查看
```javascript
var userName = "China"; // undefined
userName; // 直接返回结果
```
## 什么是数据类型?
> 数据的分类
## js有哪些数据类型?
1. number
2. string
3. boolean
4. undefined&null
5. object
6. array
## 字符串和引号的关系
```javascript
var userName = "I love China !!!"; // 没有问题
var userName = 'I love China !!!'; // 没有问题
var userName = "I love China !!!'; // 有问题, 要成对出现
var userName = 'I love' China '!!!'; // 括号要包裹完全
var userName = 'I love "China" !!!'; // 单引号套双引号没有问题
var userName = "I love 'China' !!!"; // 双引号套单引号没有问题
// 转义: 把标点符号, 变成了字符串
var userName = "I love \"China\" !!!"; // 双引号套双引号, 需要转义
console.log(userName);
```
## 如何显示变量类型
> typeof 用来显示变量类型
```javascript
var userName = "I love China !!!"; // 没有问题
console.log(typeof userName); // string
console.log(typeof 1.33); // number
console.log(typeof []); // 数组, 是一个特殊的对象, 所以是object
console.log(typeof {}); // 是一个对象, 所以是object
```
## js的注释
### 什么是注释?
> 注释就是对代码的解释, 运行时直接跳过
### 注释方式有哪些?
> `//` , 单行注释, 一般写在行尾, 解释当前行
> ![](https://box.kancloud.cn/83b38d596114852de9ae2c5e53255a4b_668x188.png)
> /**/ 多行注释 , 可以单行可以多行, 单独写一行, 用来解释多行代码
> ![](https://box.kancloud.cn/eb16cf59600c31dfff872caeab578f46_671x193.png)
> 多行注释也可以对文件进行注释
> ![](https://box.kancloud.cn/52f2bc8b8a05c9c638ad951c733cb12a_675x301.png)
### 注释的作用?
1. 解释代码, 让代码易于阅读
2. 先注释, 方便修改
3. 方便排错(把最有可能出现问题的地方, 注释掉, 如果其他没有问题, 则可以定位错误)
### 排错有几种方式
1. 浏览器的控制台
2. 编辑器和ide的代码提示, 代码审查
3. debug
## 什么是语句?
> 一行代码就是一个语句, 用分号结束
```javascript
var a = 1;
var b = 2;
```
> 多行写一行, 需要加分号
```javascript
var a = 1; var b = 2;
```
## 什么是代码压缩?
1. 压缩文件大小, 加快下载速度
1. 把空白行, 换行干掉, 隐藏变量名
- 每日单词
- JavaScript 入门
- JavaScript 基础
- JavaScript 基础回顾
- JavaScript 函数
- 匿名函数,多维数组,数据类型转换
- JavaScript 类型转换, 变量作用域
- js 运算符(一)
- js 运算符(二)
- js 流程控制语句
- JavaScript 扫盲日
- JavaScript 牛刀小试(一)
- JavaScript 牛刀小试(二)
- JavaScript 再谈函数
- JavaScript-BOM
- JavaScript-定时器(一)
- JavaScript-定时器(二)
- 番外-轮播图源码
- JavaScript 轮播图和 DOM 简介
- JavaScript-DOM 基础-NODE 接口-属性
- JavaScript-DOM 基础-NODE 接口-方法
- NodeList-接口-HTMLCollection-接口
- Document 节点
- CSS 复习与扩展(一)
- CSS 复习与扩展(二)
- 走进 jQuery 的世界
- 使用 jquery
- 使用 jquery-2
- jquery 中高级
- jquery 备忘清单-1
- jquery 备忘清单-2
- 聊聊 json
- jquery 备忘清单-3