JavaScript是什么
- 是一种运行再客户端（浏览器）的脚本语言
JS的作用
- 网页特效
- 表单验证
- 服务器端的JS
- 命令行工具
- app
- 游戏开发
- 数据交互
JS的组成
- ECMAscript：核心，描述了语言的基本语法和数据类型，是一套标准（定义一种语言的标准与具体实现无关）
- DOM：一套操作页面元素的API
- BOM：一套操作浏览器功能的API
JS的基础语法
书写环境
- 放在body结束标签的前面
- 独立的JS文件，通过script标签引入(注意：引用外部的script标签内不可以写JavaScript代码)
输出语法
- 调用弹出框功能——alert()
- 调用对话框功能——prompt()
- 确认框——confirm()
- 页面输出——document.write()
- 控制台输出——console.log()
// 调用弹出框功能
alert('Hello world');
// 调用对话框功能
prompt('Hello');
// 确认框
confirm('Are you sure?');
// 向页面输入对应的值
document.write('你好呀');
// 向控制台输出日志
console.log('我是出现在控制台 ，一般用于后期调试代码');
变量（一块被命名的存储空间）
语法：
- 先声明，再赋值
- 直接声明并赋值
- 先集体声明，再集体赋值
- 直接集体声明并赋值
- 不声明直接赋值，不会报错，但是不符合规范（带来作用域问题）
- 不声明不赋值，直接使用会报错
// 先声明
var a;
// 后赋值
a = 1;
console.log(a);
// 声明并赋值 使用最多
var a = 1;
console.log(a);
// 同时声明多个变量 并单独赋值
var a, b, c, d, e;
a = 1;
b = 2;
c = 3;
d = 4;
e = 5;
console.log(a, b, c, d, e);
// 同时声明多个变量并且直接赋值
var a = 1,
b = 2,
c = 3;
// 不声明直接赋值 不要这么使用 会带来作用域问题
// a = 1;
// console.log(a);
// 不声明不赋值 直接使用 直接报错
// console.log(a);
// console.log(name);
// console.log(window);
变量起名规则和规范
规则：
- 字母，数字，下划线，$符号可以用来变量命名，不能用数字开头命名，使用小驼峰命名法
- 不能使用关键字和保留字（var，for，while...）
关键字：有特殊意义的字符
保留字：现在没有意义，但是以后可能会有意义的字符
3.区分大小写
规范：
- 变量名有意义
- 遵守驼峰式命名法：首字母小写，后面单词首字母大写
两个变量的值交互
方法：
- 借助另一个容器
var a = 10;
var b = 20;
var temp = a;//a为10，temp为10
a = b;//a为20，b为20
b = temp;//b为10，temp为10
//此时，a = 20; b = 10;完成了交换
- 运算（基本不用）
a = a + b;
b = a - b;
a = a - b;
数据类型
- 在程序设计中，数据类型被定义为数据的种类，也就是说一系列可能值以及基于这些值的基本操作，可以更加充分和高效的利用内存和使用数据
六大数据类型
基本数据类型（简单数据类型）：
- number 数值型
- string 字符串
- Boolean 布尔值
- undefined 未定义
- null 空引用
引用数据类型（复杂数据类型）：
- object 对象
- function 函数
- array 数组
number数据类型
- 所有数字都是Number数据类型
- 利用typeof运算符可以返还当前数据的数据类型（针对简单数据）
image.png
- 特殊值：NaN not a number //不是一个数字
- 小数的计算可能导致精度的损失（解决：扩大成整数去运算）
string数据类型
- 所有添加了引号的数据都是字符串数据类型，单双引号都可
- 单双引号虽然都可以，但是不要引号嵌套；如果要嵌套，要一个单引号一个双引号，成对出现
-
转义字符
image.png
布尔数据类型
- 布尔数据类型只有两个值：true/false（多用于条件判断）
//Boolean false/true 多用于条件判断语句
if (条件) {
true的执行体
} else {
flase的执行体
}
undefined数据类型
- 未定义，变量只声明没有赋值，浏览器会默认赋值一个undefined
null数据类型
- 表示一个空的对象，一般用于将一些对象清空
var a = null;
console.log(typeof (a));//结果为object对象，这是历史遗留问题
数据类型之间的相互转换
//问题，数据类型不统一，可能得不到我们想要的数据类型，这时候我们就要进行数据转换
var a = 1;
var b = '2';
console.log(a + b);//12 ——> 1 + '2' = 12(拼接)
将数据转换成数值：
- 把字符串转换成整数——parselnt()
2.把字符串转换成浮点数——parseFloat()
- 在转换的过程当中，遇到不能转换的就停止转换，将已得结果输出）
3.把任意值转换成数值——Number（）
- 如果要转换的字符串中有一个不是数值的字符，返回NAN
4.隐式转换： 如果在数字字符串前面添加一个'+'号，会自动隐式转换成数字类型
/*
将数据转换成Number的三种方式
1.parseInt(数据);
2.parseFloat(数据);
3.Number(数据);
*/
var a = '1';
// console.log(a); 结果是String
//转换
//共同点：都可以将数据转换成Number类型
var b = parseInt(a);
var c = parseFloat(a);
var d = Number(a);
console.log(b, typeof (b));//1 Number
console.log(c, typeof (c));//1 Number
console.log(d, typeof (d));//1 Number
//不同点
var a = 1.11;
var b = parseInt(a);//只能转换成整数，小数点后面的值省略，会造成精度损失
var c = parseFloat(a);//可以转换成小数
var d = Number(a);
console.log(b, typeof (b));//1 Number
console.log(c, typeof (c));//1.11 Number
console.log(d, typeof (d));//1.11 Number
var a = '1.1aaaaa1';
var b = parseInt(a);
var c = parseFloat(a);//在转换的过程当中，遇到不能转换的就停止转换，将已得结果输出
var d = Number(a);//会检测这个值是否有不能转换成Number的，如果有，直接输出NAN（Not A Number）
console.log(b, typeof (b));//1 Number
console.log(c, typeof (c));//1.11 Number
console.log(d, typeof (d));//NaN(不是一种新的数据类型，只是Number数据类型的一个特殊值)
将数据转换成字符串：
- 将数据转换成字符串——toString()
- 将数据支持字符串（有些数据不能用toString()，比如undefined null）——String（）
- 隐式转换：任何数据只需要跟字符串相加结果一定是字符串
/*
将数据转换成string类型的两种方式
1.String(数据)
2.变量.toString()
*/
var x = 11;
var y = String(x);
var z = x.toString();
console.log(y, typeof (y));
console.log(z, typeof (z));
//变量.toString()，个别数据使用不了，例如null和undefined
//null.toString();报错
//undefined.toString();报错
// console.log(String(null));//'null'
// console.log(String(undefined));//'undefined'
将数据转换成布尔类型：
- boolean()
- 0，null，undefined，空字符串，false会被转换成false，不成立的表达式也会
/*
将数据转换成Boolean类型
1.Boolean(数据);
在布尔当中，数据转换结果为true的太多，所以我们只需记得结果为false的即可
0,'' (空字符串),null,undefined,不成立的表达式
*/
var a = 'heheheh';
var result = Boolean(a);
console.log(result, typeof (result));//true boolean
var a = 0;
var a = '';
var a = null;
var a = undefined;
var a = 1 > 2;
console.log(result, typeof (result));//false boolean
操作符（运算符）
- 一般用于运算，用来操作数据的符号
算术运算符（+,-,*,/,%）
- 加，减，乘，除，取模
- 加号：两个数字即相加，如果有字符就相连
//'+'的多种用法
//1.如果+号左右只有一个值，解析结果是正号
var a = '1';
console.log(+a);//1
//2.如果两边都是数值，加法运算
console.log(5 + 4);//9
//3.如果其中一边是字符串，那么'+'号是连接符（将符合两边的值连接起来，形成新的字符串）
console.log(1 + '2');//12
//连接符用法口诀：'+变量名+'
var price = 10000;
var salary = 10000;
console.log("苹果电脑的价格是" + price + "，我有" + salary + "可以买。");
赋值运算符（=）
- 将等号右边的值赋值给左边
- 左边是一个变量（存储）
- 累加 +=
自增自减运算符（一元运算符）
- a++/++a 先使用再自增/先自增再使用
- a--/--a 先自减再使用/先使用再自减
逻辑运算符（&&与，||或，！非）
&&（与）：
-
语法：表达式1 && 表达式2（表达式1和表达式2同时成立，整个表达式才成立；一个不成立，即为不成立）
image.png
||（或）：
-
语法：表达式1 || 表达式2（表达式1和表达式2只要有一个成立，即为成立）
image.png
!（非）：取反
image.png
比较运算符（>、 <、 >=、 <=、 ==、 ===、 !=、 !==）
// 比较运算符的结果都是布尔值
console.log(2 > 1);
console.log(1 > 2);
// >= <= 这个理解为大于或者等于 小于或者等于
console.log( 5 >= 5 );
console.log( 5 <= 5 );
// == 等于 只要内容相等即可
console.log(3 == 3);
console.log(3 == '3');
console.log(0 == false);
// === 全等 全等不仅仅是内容相等 同时需要比较类型
console.log(3 === '3');
// != 比较内容即可 !== 不仅比较内容还比较类型
console.log(3 !== '3');
// 特殊情况
如果是数字和字符串数字的比较 则字符串数字会自动转换成数字去比较
如果是字符串和字符串比较 则会每一个字符的ASCII码去进行比较
- 汉字的unicode编码值：http://bianma.supfree.net/
涉及到NAN都是false （NaN）
如果是布尔值参与比较 布尔值会转换成数字0和1