判断
<script>
let a =5
let b='5'
// if判断
// 语法 if (判断条件) {条件成功执行代码}
if (a==b) {
console.log('条件成立');
}else{
console.log('条件不成立');
// else-->否则
}
// 多条件判断 else if
if (a < b) {
console.log("a确实小于b");
} else if (a == b) {
console.log("a确实等于b");
} else {
console.log("a大于b");
}
// 逻辑运算符 and-->&& or-->||
// &&左右两边条件都为真 才为真 只要有一个条件为假 那么就为假
if (a >0 && b>0 ){
console.log("我是成立的");
}else{
console.log("条件不成立");
}
// ||左右两边只有有一个条件为真 那就为真
if ( a >0 || b>10 ){
console.log("我是成立的");
}else{
console.log("条件不成立");
}
// not--->! 表示对结果进行取反
if (! ( a >0 || b>10 )){
console.log("我是成立的");
}else{
console.log("条件不成立");
}
</script>
循环
<script>
// 普通for循环语法
for (语句1; 语句2; 语句3) {
被执行的代码块
}
for (let i = 0; i < 5; i++) {
console.log(i);
}
</script>
<script>
for (let 变量名 of 对象) {
被执行的代码块
}
// 除了写法的区别 逻辑都是一样的
let arr = [1, 2, 3, 4, 5, 6]//数组名字叫arr
//for来遍历 关键词后面总会接上一个括号 都是来写逻辑
for (let i of arr) {
// 只需要打印item就可以获取对象arr的值
console.log(i);
}
</script>
<script>
// 根据object对象循环语法
for (let 变量名 in 对象) {
}
let a = {
name: "景明",
age: 18,
}
// 使用for...in...遍历对象
for (let i in a) {
console.log(i);
// console.log(a.i);
// 它会默认从对象a里面找i键值对
// 注意 如果要拿对象里面的值必须使用 对象[] 记住就行
console.log(a[i]);
}
</script>
<script>
// while循环
while (条件) {
执行代码
}
let aa = 10
while (aa == 10) {
console.log('因为a等于10 满足条件 代码一直执行');
}
// 结束死循环
let aaa = 0
// 是在网页中写while会占用浏览器内存 无限循环 导致浏览器卡死
while (aaa < 10) {//判断a==10
console.log("无限循环")
// 我们也可通过条件来终止循环
a++ //a++ 每次循环 a都会加1 累加
}
/* break与continue break:结束整个循环
continue:结束当前循环,进入下一轮循环
for循环和while循环同等作用 */
// break
let ab = [1, 2, 3, 4]
for (let i of ab) {
// 当i为3时
if (i == 3) {
// break退出整个循环
break
}
console.log(i);
}
// continue
let ax = [1, 2, 3, 4]
for (let i of ax) {
// 当i为3时
if (i == 3) {
// continue 当 i==3 跳过
continue
}
console.log(i);
}
</script>
反引法
<script>
// 可以在 `` 通过 ${} 插入变量
let a = 10
console.log(`我今年${a}岁了`);
</script>
函数
<script>
// 函数
//1.普通函数
// 创建一个函数叫a 语法
function a() {
console.log("我是函数a");
}
// 调用函数
a()
// 2.箭头函数 需要写一个剪头
// 区别:1.箭头函数 看起来 更简单和简洁
// let b创建一个变量叫b它存着一个剪头函数
let b = () => { // 函数的名字叫b
console.log("我是函数b");
}
b()
</script>
<script>
// 形参和实参
// let name = (形参1, 形参2) => {
// }
// name(实参1, 实参2)
// 2.箭头函数 需要写一个箭头
// 区别:1.箭头函数 看起来 更简单和简洁
// let b创建一个变量叫b它存着一个剪头函数
// 在创建函数b 接受的形参叫实参
let ba = (x, y, z) => { // 函数的名字叫ba
console.log(x, y, z);
}
ba(1, "武大郎", 3)//调用函数b可以传入实参
</script>
<script>
// return 返回函数内部的值
let bb = (x, y) => { // 函数的名字叫b
return x + y
}
// 因为函数内部返回结果 你要是想拿到结果 就必须要通过打印函数调用
console.log(bb(1, 3));
</script>
<script>
// 函数形参默认值 y不传就默认y的默认值 传了就以传过来的实参为准
// 函数的默认值
let bc = (x, y = 20) => { // 函数的名字叫bc
return x + y
}
// 因为函数内部返回结果 你要是想拿到结果 就必须要通过打印函数调用
console.log(bc(1, 3));
</script>
<script>
// 函数嵌套
// 函数的嵌套
let ac = () => {
console.log("我是函数a");
// 在函数a的内部调用函数b
bd()
}
let bd = () => {
console.log("我是函数b");
}
// 从上到下执行
// 函数的执行顺序和调用顺序有关
// 一层套一层换这个叫嵌套函数
ac()//调用函数ac
//箭头函数更加简洁更加方便
// 函数的嵌套
let g = (x, y) => {
return x + y//这里只有一行代码
}
console.log(g(1, 2));
// 这是箭头函数独有的简写方式普通函数不具备
let bg = (x, y) => x + y
console.log(bg(1, 2));
</script>
<script>
/*作用域
在JavaScript中同样也有作用域之分,在函数内部叫做局部作用域,在函数外部叫做全局作用域。
变量在函数内声明,变量为局部变量,具有局部作用域。
局部变量:只能在函数内部访问*/
let function1 = () => {
let ar = 10
console.log(ar);
}
function1()
// console.log(ar); ar is not defined ar在局部变量 外部无法调用
// 变量在函数外定义,即为全局变量。
// 全局变量:网页中所有脚本和函数均可使用。
let as = 10
let function2 = () => {
console.log(as);
}
function2()
console.log(as);
</script>
定时器
<script>
/*闹钟 到了某个时间 做什么
JavaScript 定时器,有时也称为“计时器”,用来在经过指定的时间后执行某些任务,类似于我们生活中的闹钟。
JavaScript 中提供了两种方式来设置定时器,分别是 setTimeout() 和 setInterval(),它们之间的区别
如下:*/
// setTimeout() 在指定的时间后(单位为毫秒),执行某些代码,代码只会执行一次
// 按照指定的周期(单位为毫秒)来重复执行某些代码,定时器不会自动停止,除
// setInterval() 非调用 clearInterval() 函数来手动停止或着关闭浏览器窗口
// setTimeout() 函数用来在指定时间后执行某些代码,代码仅执行一次
// setTimeout(() => {
// console.log("2秒钟后执行此代码");
// }, 2000)
</script>
<script>
// setInterval() 函数可以定义一个能够重复执行的定时器,每次执行需要等待指定的时间间隔
setInterval(() => {
alert("每隔3秒,这个代码弹窗一次");
console.log("每隔3秒,这个代码执行一次");
}, 2000)
</script>