一、谈谈JavaScript
JavaScript,通常会简称为"JS",是一种浏览器脚本语言
1.1 JavaScript编程语言特点
javaScript是一种脚本编程语言
javaScript是一种解释性语言
javaScript是弱类型语言
javaScript是事件驱动的语言
javaScript是一种基于对象的语言
javaScript具有跨平台性
1.2 JavaScrip应用领域
WEB前端(页面特效,页面渲染)
WEB后端(Node.js)
Hybrid APP(混合APP)
游戏(Cocos2d.js、Unity3D)
二、JavaScript基本语法
2.1 在HTML中使用
在<script>标签内 写代码
<script>
alert('hello word')
</script>
引入外部 脚本文件
<script src="./script.js"></script>
通过事件属性定义在元素内部
<button onclick="alert('好疼啊')">点我啊</button>
2.2 JavaScript注释
单行注释
// 我是注释
多行注释
/*
多行注释
*/
2.3 指令(语句)结束符
alert('大家好');
alert('大家好');
alert('大家好')
alert('大家好')
2.4 输出内容
document.write('你是不是喜欢我?'); //直接输出到页面
console.log('hello word'); //输出到控制台
2.5 定义变量
//javascript 使用var 关键字定义变量
var username = 'xiaofeifei'
//ES6中新增 let关键字
let userage = 68
变量名命名规范:
标识符必须由"数字","字母","_",或者"$"组成,并且不能以数字开头
标识符不能与关键字冲突
严格区分大小写
2.6 弹框
alert() 警告框 没有返回值
confirm() 确认框 返回布尔值
promot() 输入框 返回用户输入的内容,点确认。点取消,null
2.7 获取页面中的元素 作为js对象
document.getElementById() 返回对象,通常被称为元素对象
元素对象与HTML元素 存在映射关系
元素对象用来描述某个HTML元素
HTML元素的属性,会映射成元素对象的属性
2.8 双标签元素里面的内容
eleObj.innerHTML 获取/设置
三、JavaScript 数据类型
3.1数据类型
JavaScript的数据类型分为原始类型和对象类型,这里我们先来了解原始类型
原始类型:
数字 Number,字符串 String,布尔值 Boolean,空 null,未定义 undefind
对象类型:
数组 Array、函数 Funtion、日期 Date、正则 RegExp、错误 Error、对象 Object等
3.2 数字 Number
js不区分整型和浮点型
定义:十进制表示、十六进制表示、科学计数法表示
特殊的Number值 NaN
表示Not A Number,类型是Number但又不是常规的数字
和任何值不相等
与任何值运算,结果还是NaN
isNaN() //函数 判断是否是 NaN
3.3 字符串String
声明方式:单引号、双引号、反引号、模板字符串
单引号 双引号 没有区别
反引号:
多行
可以支持中${变量}添加变量
3.4 布尔值
true
false
3.5 Null和undefind
被动产生
3.6 数据类型转换
强制转换
Number()
字符串:纯数字转为正常的数字,其他NaN
布尔值: true->1 false->0
String()
Boolean()
字符串->布尔: 只有空字符串转为false,其他true
数字->布尔: 0和NaN是false,其他true
null和undefined都会转为false
3.7 自动转换
根据运算符 做出适当的类型转换
四、运算符
4.1 算术运算符
+ 加号 正号
- 减法 负号
*
/
%
++ 累加
-- 累减
4.2 比较运算符
>
>=
<
<=
== 相等 两个操作数,只要值相等(类型不同会自动转换)就相等
=== 全等 类型和值都要相同才全等
!= 不等
!== 不全等
in 判断 数组的索引和对象的属性是否存在
instanceof 一个对象是否属于某个构造函数(类)
4.3 逻辑运算符
&& 逻辑与and
|| 逻辑与or
! 逻辑非not
4.4 位运算符
&
|
~
^
<<
>>
4.5 赋值运算符
=
+=
-=
*=
/=
%=
4.6 其他运算符
+ 字符串连接符
?: 比较运算符 表达式?值1:值2
typeof 判断类型
delete 删除对象的属性和数组的成员
void 空运算符
, 逗号运算符
总结
在HTML中使用 js。 <script></script>
js的基本语法: 注释,指令结束符(;换行) 变量、 输出内容
js程序: 获取页面的元素,元素对的属性。 事件 函数
数据类型: 原始类型 (Number string boolean null undefined) 对象类型(array、object)
运算符: 算术运算符(++ 、--) 比较运算符(== 、===、!=、!==) 、 位运算符、逻辑运算符、赋值运算符、其他(字符串连接符、比较运算符、typeof )
五、流程控制
5.1条件语句(分支结构)
单向分支
if (条件表达式){
code...
}
双向分支
if (条件表达式){
code...
} else {
}
多向分支
if (条件表达式){
} else if(条件表达式) {
} else if(条件表达式) {
} else {
}
swith(条件表达式){
case 表达式可能的结果: code... break;
case 表达式可能的结果: code... break;
case 表达式可能的结果: code... break;
default code...
}
嵌套分支
if (条件表达式) {
if (条件表达式) {
} else {
}
} else {
if (条件表达式) {
}
}
5.2 循环语句
while 循环
while (循环条件) {
//循环体
}
do...while 循环
do {
//循环体
} while (循环条件)
for 循环
for (变量定义;循环条件; 变量变化) {
//循环体
}
5.3 其他语句
跳转语句
continue; 跳出当前循环 继续下一次
break; 结束循环
return; 结束函数
异常
try {
} catch(err) {
}
try {
} catch(err) {
} finally {
}
严格模式
//写在所有代码的最前面
//开启严格模式
'use strict'
严格模式下 声明不加var会报错
eval()在严格模式不能用
5.4 注意
当分支语句和循环语句 结构体({}内)只有一行代码的时候,可以省略{}
if (条件)
代码