2022-07-12 第二组 曹雨 JS
作者：互联网
Java Script
编程语言，脚本语言（依赖于某种容器来运行 Java Script 依托于浏览器来运行 由浏览器来解释执行）
JS是运行在浏览器上的，可以帮助我们去控制页面。程序员有一条不成文的规定，JS放在结束标签的上方,也可以外部引入JS
外部引入JS的方法:
<script src="#"></script>
JS的数据类型
1.数字 （number）：整数，正数，小数，负数.......
2.字符串（string）:a,中文，#，@，......
3.布尔型（boolean）:ture(1) false(0)
4.空（null）：相当于声明了值为空
5.undefined:未定义：相当于没有值
<body>
<script>
//变量
// number类型
var v1 = 11;
// 字符串类型
// 加引号会把变量变成字面量
var v2 = '你好';
// 布尔类型
var v3 = true;
// 空
var v4 = null;
// undefined
var v5;
// 字面量
alert(v5);
</script>
<!-- <script src="js/my.js"></script> -->
</body>
定义变量：
变量：
开发中尽量减少使用字面量，后期维护困难的问题。
在JS的新版本中，新推出了两个词代替var
1.let 无法重复定义
2.const 由let的特点， const声明的东西是常量，不能修改
重复写两个会报错
<body>
<script>
// var v1 = 10;
// let v1 = 10;
// let v1 = 100;
const v1 = 10;
// const v1 = 11;
// 修改变量的值
// v1 = 11;
// 10
// 11
// 报错
alert(v1);
</script>
</body>
JS复杂数据类型
1.数组：一个变量对应多个值
创建数组：
数组的赋值，取值
<body>
<script>
// 1.使用数组函数
let arr1 = Array();
// 警告弹窗
// alert(arr);
// console.log(11111);
// console.log(arr);
// 2.使用new关键字
let arr2 = new Array();
// 3.使用字面量的方式
let arr3 = [];
// 赋值
// 下标（索引）
// 给数组的第一个元素赋值
arr3[0] = 100;
arr3[1] = 90;
// 打印输出数组中的第一个值
console.log(arr3[100]);
</script>
</body>
函数：
定义一个函数用来执行一系列代码。以达到复用的目的！
*函数：一个单词后面带小括号一定是一个函数义：
定义函数：
// 全局变量
// let v1 = 10;
// 定义函数 体
// 作用域：起作用的区域
function hello() {
// 局部变量
let v1 = 10;
console.log(v1 + 5);
调用函数：
// 调用函数
// hello();
// console.log(v1);
function add() {
let num1 = 10;
let num2 = 20;
// console.log(num1 + num2);
// 带有返回值的函数
return num1 + num2;
}
全局变量，局部变量：
// 全局变量
// let v1 = 10;
// 定义函数 体
// 作用域：起作用的区域
function hello() {
// 局部变量
let v1 = 10;
console.log(v1 + 5);
}
给参数赋值
// 给参数赋值
function sub(num1,num2){
return num1 - num2;
}
let result = sub(2,2);
console.log(result);
函数分为：
1.无参无返回值 2.无参有返回值 3.有参有返回值 4.有参无返回值
函数内部不可以再声明函数，但是可以调用函数，调用方式和正常调用方式相同
return除了可以返回结果，还可以终止函数的继续执行。在开发中尽量不要在return后面继续写语句
弹窗：
1.alert警告弹窗
2.confirm带有确定和取消的弹窗有返回值 确定返回ture 取消返回false
3. prompt:带有文本框的弹窗，有返回值 返回值就是你在文本框内输入的内容。
4. \n换行
<script>
let result = confirm("是否退出本系统？");
console.log(result);
let result = prompt("请输入你的学号：","例如：1001");
console.log(result);
alert("\t床前明月光，\r\n疑是地上霜。");
</script>
运算符：
算术运算符：
+ - * / %(取余，取模)
console.log(5 % 2);
赋值运算符 = += -= *= /= %=
比较运算符：
比较运算符 > < >= <= != == ===
// 得到的结果是boolean类型
三元运算符：
语法是固定的，只能有一个条件，两个选项
语法格式：
条件表达式 ? 表达式1 : 表达式2
let max = a > b ? a : b;
“+”加号：
"+"符号，可以当作连接符 如：10 + a =10a，但如果先入为主认定“+”是连接符，那么他就一直是连接符，后面即使有数字也加不了，如果非要加可以加一个“( )”
“- * / % ”符号可以进行类型转换，如果类型无法转换，会出现“NAN（Not A Number）”
逻辑判断：
if..else..
if(a < 10) {
console.log("a < 10...");
} else if(a === 10){
console.log("a==10");
return;
console.log("我是return后面的一句话");
}
else {
}
if...else是可以嵌套的，可以无限嵌套。但是原则上不要超过三层。
switch
语法:
switch(表达式){
case 选项1：
要执行的代码
break
case 选项2：
要执行的代码
break
case 选项3：
要执行的代码
.......
default：
}
<script>
let a = 100;
switch(a) {
case 10:
console.log('你好');
break;
case 20:
console.log('我好');
break;
default:
console.log('大家好');
break;
}
</script>
判断润年小案例
let year = 2020;
if(year%400 == 0){
console.log(year + "是闰年。");
}else {
if(year%4 == 0 &&year % 100 != 0){
console.log(year + "是闰年。");
}else{
console.log(year + "不是闰年。");
}
}
function isRun(year){
if(year % 400 == 0){
console.log(year + "是闰年");
return ;
}
if(year % 4 == 0 && year % 100 != 0){
console.log(year + "是闰年");
return ;
}
console.log(year + "不是闰年");
}
isRun(2100);
公司招人小案例：
function isRun2(year){
switch(year % 400){
case 0:
console.log(year + "是闰年");
return;
default:
if(year % 4 == 0 && year % 100 != 0){
console.log(year + "是闰年");
return;
}
console.log(year + "不是闰年");
}
}
isRun2(2100)
判断天数小案例：
<body>
<script>
// 给你一个年月日,今天是今年的第几天？
let year = 2020;
let month = 3;
let day = 11;
/*
思路：
1、判断2月份有几天，判断是不是闰年
2、如果是闰年，2月份有29天
*/
function getCountDays(year,month,day){
let count = 0;
switch(month){
case 1:
count = day;
break;
case 2:
count = 31 + day;
break;
case 3:
// let a = 0;
// if(isRun2(year)){
// a = 29;
// }else {
// a = 28;
// }
count = 31 + (isRun2(year) ? 29 : 28) + day;
break;
}
return count;
}
console.log(year + "年" + month + "月" + day + "日是" + year + "年的第" + getCountDays(year,month,day) + "天！" );
function isRun2(year){
switch(year % 400){
case 0:
return true;
default:
if(year % 4 == 0 && year % 100 != 0){
return true;
}
return false;
}
}
</script>
</body>
总结：
今天开始了设计逻辑的js学习，在基础知识点学习后，老师带我们做了几个小案例，设计单一知识点的案例我完成的都可以，但是一旦设计知识点综合应用，我便无从下手。在老师进行示范后，才有了思路。感觉自己编程思维还需要培养。
标签：曹雨,12,console,log,10,v1,let,year,07 来源： https://www.cnblogs.com/figh466/p/16472340.html