javascript
一、 前言
- JS 是一个脚本语言
- JS是web的编辑语言
- 经常理解为 html-结构、css-样式、js-行为
- js可以写html、也可以写css、但是主要是用来渲染页面，负责页面和数据之间的传递和显示，以及编辑功能....
二、JS基础
1.使用
和css差不多，js有两种使用方式
1.内部js
在html的底部
<html>
<body><body/>
<script>js代码</script>
</html>
2.外部引入
<script src="demo.js"></script>
2.输出
1.弹框 alert
内部js
<script>
//写js代码
alert('js第一天');
</script>
2.外部js里面直接写代码
alert('哈哈哈');
3.写到html上 document.write
<script>
document.write('床前明月光');
document.write('<br>');
document.write('疑是地上霜');
</script>
4.innerHTML写到html内里面可以写html的标签，显示的时候显示的是标签内的东西。
innerText写到标签里面,如下所示会显示包含标签的一块
app我们称为节点,通过节点然后把内容写到该节点的地方
<!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>
<div id="app">
</div>
<p id="app2">
</p>
<script>
// innerHTML
app.innerHTML = '<span class="border: 1px solid">两行白鹭上青天</span>';
// innerText
app2.innerText = '<span class="border: 1px solid">两行白鹭上青天</span>';
</script>
</body>
</html>
5.写到控制台 浏览器F12调出控制台console
console.log('今天天气很好');
- 变量
1.变量
变量一个可变的量，用来储存数据
声明一个变量用var
var 变量名;
var num; 这个时候num是个变量
变量赋值 = 赋值符号 num = 1; 这个时候num等于1
2.关键字
一些语言以及规定意义的词比如function
3.标识符
js严格区分大小写
命名规范:
字母 $ _ 开头
第一个单词小写，后面的单词第一个字母必须大写
4.小总结
一、变量
* 变量是什么，有什么用
* 声明变量
* 赋值
二、js一些语法和概念
1. 区分大小写(html不区分大小写)
2. 标识符(比如变量名称等)
* 以字母、下划线、$开头
* 其他字符可以是字母、下划线、$或数字
* 驼峰式:小写字母开头,第二个打次首字母大写
3. 注释
* 单行注释
* 多行注释
4. 关键字和保留字
* 关键字:系统在使用
* 保留字:系统将来可能用到
* 不能作为标识符来使用
* 用来作标识符就会报错
三、变量有哪些类型
1. 数字 Number类型
* 整数
* 小数
* 最大值和最小值
* NAN
2. typeof 判断变量的类型
3. String类型 字符串
4. Boolean类型 true和false
5. Undifined类型 undefined
* 用来表示声明了变量但未初始化(赋值)
6. Object类型
* 普通对象（无序集合）
* 数组（特殊对象）
7. Null类型 null
* 声明一个变量准备用来存储对象
四、变量的类型判断
* 基本数据类型(简单数据类型) Undefined、Null、Boolean、Number和String
* 引用数据类型(复杂数据类型) object,array他们的属性或者成员可以包含简单数据类型
5.数据类型
5个基本数据类型
1.数组类型 Number
数字 NaN
2.字符串类型 String
' ' 或 'saf'
3.布尔类型 Boolean
true 或 false
4.undefinde 未定义
5.null 空
2个引用数据类型
1..数组类型Array
var 数组名 = [ ]
var 数组名 = [数组值]
var 数组名 = [ {object}]
2..对象类型Object
var 对象名 = { }
var 对象名 = new object
var 对象名 = { 属性(变量名)=值(各种类型) }
NULL和Array的数据类型都是Object
6.运算符
和数学的运算符一致
加 +
减 -
乘 *
除 /
取余 %
7.关系运算
1.if判断语句
if(条件语句 (变量或运算)){执行代码}else{执行语句}
如果满足就干嘛，否者就干嘛
if(!null){return:"哈"}else{return:"切"}
如果不是空就返回 哈，否者返回 切
2.赋值运算符和逗号运算符
赋值运算符 = 用于给变量赋值
复合运算符:
+= a += 10; => a=a+10
-= a -= 2 ; => a=a-2
*= a *= 5; => a=a*5
/= a /= 3 => a=a/3
逗号运算符 , 用于简洁声明变量
var a,b = 10 ; 声明a,b变量并赋值10
3.一元运算
自加运算符 ++
++i 先自加1再参与计算
i++ 先参与计算再自加1
负号运算符 -
直接给变量取负值
自减运算符 --
--i 先自减1再参与计算
i-- 先参与计算再自减1
4.逻辑运算
逻辑非 ！
取相反的值 先用布尔进行判断，会涉及类型转换，隐式和显式转换
逻辑与&&
布尔类型情况下 只要有一个false就不会检查后面的，结果就是false
非布尔情况下 判断第一个变量的值（先进行隐式布尔转换）若第一个为true取后面false的变量值，若第一个为false取第一个变量的值
实际应用里的小技巧
// 下面用这个特性来检测这个变量有没有值和属性
var cat = false;
console.log(cat && cat.name);
逻辑或 ||
布尔情况下，条件里满足一个就为true，都不满足为false
非布尔情况下，在条件里找true,值都取第一个为true的值，若没有true则取最后一个的值
// 小技巧，用于不确定有没有给值，先设置一个默认值
var date;
var dater = date || '2019-2-15';
console.log(dater);
扩展 多个运算在一起的情况下
/**
在下列的算式里，看似很复杂,实际上可以分成两大部分||左右进行判断，
如果前者为false再算后面的，
而后面的关系运算符==也可以分成左右两边进行计算
得出结论，计算优先级之前得看清全盘，最后关键是赋值运算那
*/
// 计算优先级：（）=> 自加减 => 算术运算 => 关系运算（比较运算）=> 逻辑运算=> 赋值运算;
var sum = 20 + i++ + 'abc' || 123 - ++i + ++j + ++j + '123' == 123 * 2 / 4 ;
5.类型转换
隐式转换
在条件语句为一个变量时出现
先把变量转换为布尔类型，true执行else之前的，false执行else之后的
空、0、undefinde、NaN，各类数据类型意义上为无的都为false，否者就为true
显式转换
判断变量的类型 typeof 变量名
Number(变量名); 除了数字和空以及布尔其他全为NaN
Boolean(变量名); !!Boolean(变量名) 空、0、undefinde、NaN，各类数据类型意义上为无的都为false，否者就为true
String(变量名); 全部加上引号变成字符串然后（+）连接起来
Object(变量名)；基本不进行转换因为对象可以把所有类型都包含
