js是什么？
js全称javascript,是一种弱类型，直译型的脚本语言，需要依赖其他程序
弱类型：语法要求不严格，比如可以在一行语句结束时不写分号。数据类型分类相对其他语言没有那么严格。
直译型：直接翻译。
js能干什么
加强页面的动画效果
js接受后端传来的数据
js给后端传数据
js最早是为了解决表单验证的问题
js的三种引入方式
- 内部样式
<script>内部js代码</script> - 外部样式
<script src="路径"></script> - 行内样式
script三种输出方式
js引入与css不同的是，css写在前面，表示的是HTML找css，但是js的script标签是写在最后面
弹窗：alert();数字；字符串，字符串必须加引号，加了引号的都是字符串；布尔值，true/flase 注意：引号不分单引和双引
可以识别空格，数字可以不打引号，但非数字必须打引号，单双都可以。布尔值不打引号。弹窗不在文档中所以不识别便签，可以识别空格
文档写入write: document.write();只有这种方式识别便签。documnet.write('<h1>hi</h1>');
console控制台输出：
语法：console.log(); 可以识别空格，用户看不到，主要用于代码测试；
console.log(666);//蓝色的数字
console.log('666');//黑色的字符串
js报错的简单BUG
js报错以后，后面的代码都不会执行
console.log(hehe); //hehe is not defined 没有被定义
consol.log(888); //consol is not defined
console.logo(999); //is not a function logo不是函数
console.log(888'); //invalid无效的 //mising） 右括号缺失
js的变量
变量：会改变的值
常量：不会改变的值
声明变量的方式： var
交换两个变量的值：需要声明一个中间变量；
var x ;
x = 1 ; // 赋值
console.log(x); //输出值为数字 2 变量不能加引号
x = 2 ;
console.log(x);
x = 3 ;
console.log(x);
x = 'haha' ;
console.log(x)// 输出值为 字符串 haha
x = true ;
console.log(x); //输出值为 布尔类型 true
变量的声明规则
变量的命名要求（底线）
- 只能是数字，字母，下划线以及$
- 数字不能开头
- 不能使用关键字和保留字
保留字：js将来可能定义为关键字的单词
关键字：js当中正在使用的，具有特殊意义的单词
变量的命名规范（建议）
- 不用拼音
- 建议使用驼峰命名法或者组合命名
- 命名尽量做到见名知意
例如：小驼峰 var userName 大驼峰 var UserName(目前不要使用)
变量输出时需要注意什么
- 变量输出时不能加引号
- 可以写多个参数，但是弹窗alert只能有一个参数
数据类型
- 基本数据类型：数字+字符串+布尔值+null+undefined
- 引用数据类型
基本数据类型的判断方法
typeof
var x = 1 ; // js // 其他语言
console.log(typeof x); // number 数字 // int
var y = 1.2 ;
console.log(typeof y); // number // float
var user_name = 'yy' ;
console.log(typeof user_name); // string // char
var bool = true ;
console.log(typeof bool); // boolean
var a ;
console.log(typeof a); // undefined 这种数据类型只有js有
var b = null ;
console.log(typeof b); // object 空对象
数据类型之间的转换
把其他类型转换成字符串
- 把数字变成字符串
- 把布尔值转字符串
- 把null转字符串 'null'
- 把undefined转字符串 'undefined'
// 字符串类型
var user_name = "cxl";
console.log(user_name); //输出 cxl
console.log(typeof user_name) //typeof 显示类型 string
// 数字类型
var num = 123;
console.log(num); //输出 数字 123
console.log(typeof num); //number
// 强制将数字类型转换为字符串类型 number----string
var str1 = String(num);
console.log(str1); // 输出 字符串123
console.log(typeof str1); //显示类型 string
// 布尔类型
var bool = true;
console.log(bool); //输出布尔值 true
console.log(typeof bool) // boolean
// 强制将布尔类型转换为字符串类型 boolean----string
var str2 = String(bool);
console.log(str2); //字符串true
console.log(typeof str2); //显示类型 string
//null
var a_1 = null;
console.log(a_1); //输出null值
console.log(typeof a_1); //显示类型 object
// 强制将null转换为字符串类型 object----string
var str3 = String(a_1);
console.log(str3); //输出字符串null
console.log(typeof str3); //显示类型 string
//undefined
var a_2 = undefined;
console.log(a_2); //undefined
console.log(typeof a_2); //undefined
// 强制将undefined转换为字符串类型 undefined----string
var str4 = String(a_2);
console.log(str4); // 输出字符串undefined
console.log(typeof str4); //string
把其他类型转换成数字类型
- 字符串转数字
- 字符串都是数字 直接转数字
- 字符串包含非数字 NaN
- 空字符串和空格字符串都转为0
// 数字类型
var x = 123;
console.log(x); //值为数字123
console.log(typeof x);
//将字符串string类型转换成数字number类型
console.log(Number("123")); //值为数字123
console.log(typeof Number("123"));
console.log(Number("sadadad")) //值为NaN 意思是not a number
// 字符串转数字
// 字符串都是数字 直接转数字
// 字符串包含非数字 NaN
// 空字符串和空格字符串都转为0
console.log(Number("123d"))
console.log(Number(" ")) // 空格
console.log(Number("")) //空字符串
//将布尔类型Boolean转换成数字number类型
console.log(Number(true)) //布尔值true转换数字类型值为1
console.log(Number(false)) //布尔值false转换数字类型值为0
//将null转换成数字number类型
console.log(Number(null)) // 值为0
console.log(Number(undefined)) //值为NaN
将其他类型转换成布尔类型
- 数字转布尔值 0和NaN为false,其他数字都是true
- 字符串转布尔值
- 字符串有东西就是true
- 空字符串 false
- null转布尔值 false
- undefined转布尔值 false
// 数字转布尔值 0和NaN为false,其他数字都是true
// 字符串转布尔值
// 字符串有东西就是true
// 空字符串 false
// null转布尔值 false
// undefined转布尔值 false
//布尔类型
var x = true;
console.log(x); //值为true
console.log(typeof x); //显示类型为Boolean
// 将字符串转换成布尔类型
console.log(Boolean("weuqwe")) //值为true
console.log(Boolean("")) //值为false
console.log(Boolean(123)) //值为true
console.log(Boolean(0)) //值为false
console.log(Boolean(NaN)) //值为false
console.log(Boolean(null)) //值为false
console.log(Boolean(undefined)) //值为false
js运算符
- 算数运算符
- 逻辑运算符
- 关系运算符
- 赋值运算符
- 比较运算符
算数运算符
console.log(1 + 2); //加法运算
console.log(2 - 1); //减法运算
console.log(2 * 2); //乘法运算
console.log(4 / 2); //除法运算
console.log(4 % 3); //取余运算 取模
//数学中不能把0作为除数，但是js可以
console.log(1 / 0); //值为 Infinity 无穷大
加号的两种用法
- 遇到字符串就是拼接的意思
- 没有字符串就是 求和的意思
console.log(1 / 0); //值为 Infinity 无穷大
console.log("hello" + "world") //字符串的拼接
console.log(1 + 2);
console.log(1 + "2") //字符串12 拼接
console.log(true + false) //值为1 隐式转换成数字类型
算数的其他运算
// 只有数字可以做减法，乘法，除法，求模运算
var x = 'hi';
var y = 2;
console.log(x * y); // NaN
console.log(null + 2); // 2
console.log(undefined + 2); // NaN
console.log(null + undefined); // NaN
console.log(null + true); // 1
隐式运算
其他转字符串
- 强制转换 String()
- 用加号拼接空字符串 其他类型转数字
- 强制转化 Number()
- -0 ，/1 ， *1 ， %更大的数
// 其他转字符串
// 强制转换 String()
// + ''
// 其他类型转数字
// 强制转化 Number()
// -0 /1 *1 %更大的数
var x = 1;
var str = x + '';
console.log(str); //将数字类型转换成字符串类型
console.log(true + ''); //将布尔类型转换成字符串类型
var x = '123';
// x = x - 0 ;
// x = x / 1 ;
// x = x * 1 ;
x = x % 1000000000000;
console.log(x);
// 变量在使用的过程中，是值在做计算，不是变量在做计算
// 变量只有通过赋值才会改变
var m = '23';
var n = m * 1; // 看到的是m*1 实际上程序是先找到m对应的值，再做计算 '23'*1
console.log(m); // '23'
console.log(n); // 23
比较运算
比较运算符 得到布尔值
-
> 大于 -
< 小于 -
>= 大于或等于 -
<= 小于或等于 -
== 值相等 -
=== 绝对等于，值和类型必须都相等 - != 值不相等 == 反义词
- !== 值或者数据类型不相等 === 反义词
- 等于 == === 注意： js没有连等式，通常用逻辑运算来表示 关于等号
- = 赋值
- == 判断值相等
- === 值和数据类型都要相等
console.log(3 >= 2);
console.log(3 <= 3); // true
console.log(3 >= 3); // true
console.log(3 == 3); // true
console.log(3 == '3'); // true
console.log(3 === '3'); // false
console.log(2 !== '3'); // true
console.log(3 !== '3'); // true
逻辑运算
- 与 并且 多个条件同时满足 &&
- 或 只要有一个条件满足 ||
- 非 取反 ! 短路
- 逻辑与运算中 见假即假 见假就短路了
- 逻辑或运算中 见真即真 见真就短路了
//0 < 10 < 20 改变成js
console.log(10 > 0 && 10 < 20); // true
console.log(10 > 0 || 10 > 20); // true
赋值运算
<script>
// =
// +=
// -=
// *=
// /=
// %=
var x = 1;
// x = x + 1 ;
x += 1;
var y = 2;
y *= 2; // y = y * 2 ;
console.log(y); // 4
</script>
自增运算（一个有坑的位置）
- ++在后面，先赋值，再自增
var y = x++ ;
// y = x = 1 ;
// x = x + 1 = 2 ;
console.log(y); // 1
console.log(x); // 2
- ++在前面，先自增再赋值，
var n = ++ m ;
// m = m + 1 ;
// n = m
console.log(n); // 2
console.log(m); // 2
