JavaScript-ECMAScript学习归纳总结

JavaScript-ECMAScript学习归纳总结

现在所说的JavaScript包含了三个部分

1. ECMAScript：js的语法规范
2. DOM：操作网页的功能
3. BOM：操作浏览器的功能

ECMAScript归纳总结：

1.书写JS代码的方式：

方式1：通过script标签即可

<script>alert('hello world')</script>

方式2：把JS代码写在单独的文件JS文件中，通过script标签引入

<script type="text/javascript" src="路径"></script>

2.注释：

JS的注释：

// 单行注释 ctrl + /
/* 多行注释 */

HTML的注释：

<!-- html的注释 -->

CSS的注释：

/*  CSS注释 */

3.JS的输出语句：

alert('警告');
confirm('你确定要删除吗？');
prompt('请输入你的银行卡密码。');
document.write('hell world');
console.log('调试见');

4.变量：

变量的命名规则：

① 由字母，数字，下划线，$符号组成，不能以数字开头
② 不能是关键字和保留字
③ 区分大小写

命名规范：

① 定义的变量要有意义
② 驼峰命名规范：除了第一个单词，其它单词首字母都需要大写

JS的特点：

代码从上往下执行，一行报错，后面的代码不执行

var age;	// 声明变量 未声明时：is not defined => bug
age = 18; 	// 变量赋值
var age1 = 18, age2 = 20;	// 声明多个变量，以‘,'号隔开

5.JS五种简单的数据类型（浏览器能直接认识的）

值类型:简单数据类型或者基本数据类型 在存储时变量中存储的是值本身 因此叫做值类型
引用类型：复杂数据类型 在存储时变量中存储的仅仅是地址(引用) 因此叫做引用数据类型

typeof判断类型：
① 只能判断简单数据类型的类型（number，string，boolean，undefined）
② typeof判断复杂类型，全都是Object。
③ 例外：typeof如果判断是函数，返回值为function
④ typeof null结果为Object

function fn(){
   }
console.log(typeof(fn));		// 输出结果为function
var ss = null;
console.log(typeof(ss));		// 输出结果为Object

（1）数字

① 八进制：数字0开头，如077
② 十六进制：0x开头，用0-9,A-F表示，如0xFF或0XFF
③ 浮点数：11.2 11.1 // 不要拿小数的运算结果作比较
④ 科学计数法：var num = 5e-5 // 5*10的-5次方

浮点数精度丢失问题：

所有编程语言中，小数时算不准确的，其他语言中，一般会对小数做处理，JS没有，所以不要拿小数的运算结果作比较

数字范围：

Infinity > Number.MAX_VALUE
Number.MIN_VALUE > 0

（2）字符串

字符串必须用’或者"包含

使用+可以实现字符串的拼串：

俩边都是数字，+为加法的功能
俩边只要有字符串，+表示字符串的拼接

（3）布尔类型

true 和 false

（4）undefined类型

当一个变量没有赋值的时候，值就是undefined

（5）undefined类型

null：表示一个空的对象

6.操作符

（1）算术运算符

+	-	*	/	%
20 % 3 = 2  // 求余数，保留整数	
+ 号有拼接功能
-  *  /  % 只有算术的功能，如果有字符串，将字符串变成数字来算

（2）赋值运算符

= += -= *= /= %=

var num = 10;
var num = num + 10;
num %= 2  // num = num % 2

（3）自增自减（一元操作符）

① 自增：++age，先让age+1，再返回结果；age++，先返回结果，再让age+1
② 自减：–a,先让a-1，再返回结果；a–，先返回结果，再让a-1

var a = 1;
var b = ++a + ++a;
console.log(b);	// 答案为5

（4）逻辑运算符

① 与(&&)：只有俩个都为true，结果才为true
② 或(||)：只要有一个为true，结果就为true
③ 非(!)：取反

（5）比较运算符（> < == === >= <= !=）

= 为赋值运算符，不是比较运算符
== 比较俩个值是否相等，不会比较类型
=== 全等，值相同，类型也相同

运算优先级

① ()最高
② 一元运算符：++ –
③ 算术运算符：* / % 高于 + -
④ 比较运算符
⑤ 逻辑运算符

7.数据转换

（1）其它类型转换为数字类型

① Number()
② parseInt() // parse：转换 interesting：整数
③ parseFloat() // 转换成浮点数
④ 直接运算：+0 -0

转换成数字类型的注意点：

NaN：不是一个数字，NaN是number类型，表示一个没办法用数字表示的值

var age = '18';console.log(age - 0)	//  结果为数字18
console.log(isNaN(num))	// 返true说明是NaN，说明不是数字

（2）转换成字符串

① String() num = String(num)
② toString num = num.toString
③ 拼串（推荐）：num = num + ’ ’

（3）转换成布尔类型

① Boolean()
② 简单的方式(推荐)：!!

转换布尔值为false的六种情况：

① undefined
② false
③ 0
④ “”(空字符串)
⑤ null
⑥ NaN

8.流程控制

（1）顺序结构

从上到下执行的代码就是顺序结构，程序默认就是由上到下顺序执行的。

（2）分支结构

① if语句：
if(条件){} if(){}else{} if(){}else if(){}else{}
② 三元运算符（条件满足为值一，不满足为值二）：
var 结果 = 条件 ? 值一 : 值二
③ switch-case // 每个case都有break

分支结构三种语法的应用场景：

① if…else…：适用于范围的判断
② 三元运算符：只适用于非常简单的if…else…
③ switch…case：适用于具体值的判断

// if语句
var score = prompt('请输入自己的成绩')