Week 01 JS基础1
2021-11-19 17:57:13 0 举报AI智能生成
第一周所学的JS内容，包含JS基础的一些概念和一些代表性习题。
作者其他创作
大纲/内容
流程控制
条件结构
常见的if条件句：
if(表达式(条件1)，实为布尔类型){
(如果条件1成立，则执行...);
}else if(条件2){
(如果条件1不成立，且条件2成立，则执行...);
}else{
(如果条件1和2都不成立，则执行...);
}
（Ps：值得注意的是，在一个if条件句中，else if(条件)如果有需要可以写很多次，但else{}只能写一次）
if(表达式(条件1)，实为布尔类型){
(如果条件1成立，则执行...);
}else if(条件2){
(如果条件1不成立，且条件2成立，则执行...);
}else{
(如果条件1和2都不成立，则执行...);
}
（Ps：值得注意的是，在一个if条件句中，else if(条件)如果有需要可以写很多次，但else{}只能写一次）
if相关练习
switch结构
swicth结构
switch语句相关规则
注意：如果声明了一个变量，但没有赋值，即undefined，判断该变量为false；如果声明的变量有值，但不是boolean值（即true或false），通常可能是一个字符串，判断该变量时视之为true（为真）；但如果这个值是布尔类型。就要按布尔类型去判断。
if...else和if...else if...else的区别（效率差别）
循环结构
循环结构解决的是重复相同或相似的操作问题（以for循环为例）。
循环相关练习
猴子吃桃问题
问题：猴子第一天摘下若干个桃子，当即吃了一半，还不过瘾，又多吃了一个。第二天早上又将第一天剩下的桃子吃掉一半，又多吃了一个。以后每天早上都吃了前一天剩下的一半多一个。到第 10 天早上想再吃时，发现只剩下一个桃子了。编写程序求猴子第一天摘了多少个桃子。
答：<script>
let sum = 1;//第九天吃完之后还剩1个.[第10天早上起来还没吃]
for(let i = 9;i>=1;i--){
//没吃之前有几个?
sum= (sum+1)*2
console.log("第"+i+"天没吃之前有"+sum+"个桃子")
//4 10
}
</script>
let sum = 1;//第九天吃完之后还剩1个.[第10天早上起来还没吃]
for(let i = 9;i>=1;i--){
//没吃之前有几个?
sum= (sum+1)*2
console.log("第"+i+"天没吃之前有"+sum+"个桃子")
//4 10
}
</script>
小球问题
问题：有一个弹力球，从100米的高度，落地后会弹起来.每次弹起的高度是原来高度的一半.
问，第10次落地后弹起来的高度是多少?
问，第10次落地后弹起来的高度是多少?
子主题
while循环
while循环基本语法
do...while循环
do...while循环相关规则
对于三个循环的总结
三个循环中，for循环语法比较简洁，比较适合循环次数确定，先判断，再执行循环体。
while循环，比较适合循环次数不确定，先判断，再执行循环体。
do-while循环，先执行一次循环体，再判断条件. do-while不管条件是否成立，都会执行一次循环体。
while循环，比较适合循环次数不确定，先判断，再执行循环体。
do-while循环，先执行一次循环体，再判断条件. do-while不管条件是否成立，都会执行一次循环体。
嵌套循环
<script>
//使用for循环来演示嵌套循环
let s =0;
//外部的循环称为外循环,当i的值1的时候，内循环会执行5次，同样的道理，当i=2 ,3 ,4 ,5的时候，内循环分别执行了5次
//嵌套循环，-》内循环的循环体 执行了25次.
// 25 = 内循环次数 * 外循环次数
for(let i=1; i<=5 ;i++){
let x = 0;
//内部的循环称为内循环
for(let j=1;j<=5;j++){
s++;
x++;
}
console.log("x: "+x);//会不会输出？会的. 输出结果是5个5
}
console.log("s:"+s);
</script>
//使用for循环来演示嵌套循环
let s =0;
//外部的循环称为外循环,当i的值1的时候，内循环会执行5次，同样的道理，当i=2 ,3 ,4 ,5的时候，内循环分别执行了5次
//嵌套循环，-》内循环的循环体 执行了25次.
// 25 = 内循环次数 * 外循环次数
for(let i=1; i<=5 ;i++){
let x = 0;
//内部的循环称为内循环
for(let j=1;j<=5;j++){
s++;
x++;
}
console.log("x: "+x);//会不会输出？会的. 输出结果是5个5
}
console.log("s:"+s);
</script>
相关练习：打印三角形
<script>
//向左直角三角形
for(let i=1;i<=10;i++){//控制外层
for(let j=1;j<=i;j++){
document.write("♥");
}
document.write("</br>");
}
//向右直角三角形
for(let i=1;i<=10;i++) {//控制外层
for(let j=1;j<=10-i;j++){
document.write(" ");
}
for(let k=1;k<=i;k++){
document.write("♥");
}
document.write("<br/>");
}
//向左倒直角三角形
for(let i=10;i>=1;i--) {//控制外层 10 10 9 9 8 8
for(let k=1;k<=i;k++){
document.write("♥");
}
document.write("<br/>");
}
//向右倒直角三角形
for(let i=10;i>=1;i--) {//控制外层
for(let j=1;j<=10-i;j++){
document.write(" ");
}
for(let k=1;k<=i;k++){
document.write("♥");
}
document.write("<br/>");
}
//向左等腰三角形
for (let i = 1; i <= 10; i++) {//控制外层
for (let j = 1; j <= 10 - i; j++) {
document.write(" ");
}
for (let k = 1; k <= i; k++) {
document.write("♥");
}
document.write("<br/>");
}
for (let i = 10; i >= 1; i--) {//控制外层
for (let j = 1; j <= 10 - i; j++) {
document.write(" ");
}
for (let k = 1; k <= i; k++) {
document.write("♥");
}
document.write("<br/>");
}
//菱形
for (let i = 1; i <= 10; i++) {
for (let j = 1; j <= 10 - i; j++) {
document.write(" ");
}
for (let j = 1; j <= i; j++) {
document.write("♥");
}
document.write("
");
}
for (let i = 1; i <= 10; i++) {
for (let j = 1; j <= i; j++) {
document.write(" ");
}
for (let j = 1; j <= 10 - i; j++) {
document.write("♥");
}
document.write("
");
}
</script>
//向左直角三角形
for(let i=1;i<=10;i++){//控制外层
for(let j=1;j<=i;j++){
document.write("♥");
}
document.write("</br>");
}
//向右直角三角形
for(let i=1;i<=10;i++) {//控制外层
for(let j=1;j<=10-i;j++){
document.write(" ");
}
for(let k=1;k<=i;k++){
document.write("♥");
}
document.write("<br/>");
}
//向左倒直角三角形
for(let i=10;i>=1;i--) {//控制外层 10 10 9 9 8 8
for(let k=1;k<=i;k++){
document.write("♥");
}
document.write("<br/>");
}
//向右倒直角三角形
for(let i=10;i>=1;i--) {//控制外层
for(let j=1;j<=10-i;j++){
document.write(" ");
}
for(let k=1;k<=i;k++){
document.write("♥");
}
document.write("<br/>");
}
//向左等腰三角形
for (let i = 1; i <= 10; i++) {//控制外层
for (let j = 1; j <= 10 - i; j++) {
document.write(" ");
}
for (let k = 1; k <= i; k++) {
document.write("♥");
}
document.write("<br/>");
}
for (let i = 10; i >= 1; i--) {//控制外层
for (let j = 1; j <= 10 - i; j++) {
document.write(" ");
}
for (let k = 1; k <= i; k++) {
document.write("♥");
}
document.write("<br/>");
}
//菱形
for (let i = 1; i <= 10; i++) {
for (let j = 1; j <= 10 - i; j++) {
document.write(" ");
}
for (let j = 1; j <= i; j++) {
document.write("♥");
}
document.write("
");
}
for (let i = 1; i <= 10; i++) {
for (let j = 1; j <= i; j++) {
document.write(" ");
}
for (let j = 1; j <= 10 - i; j++) {
document.write("♥");
}
document.write("
");
}
</script>
备注：放在思维导图中的题目有些难度，由于思维导图篇幅不大，详细内容可见博客：https://www.cnblogs.com/yigegunxueqiuderen/
基本语法
<script></script>标签可放在head标签里，也可放在body的底部
<script>标签内容也可从外部导入，导入方式为：在head标签里插入<script src="(外部script文件的地址)"></script>
对象.方法/函数 例如：window.alert() console.log()等等
变量和数据类型
变量的相关规则
声明变量的格式 例如：let/var age = 18;let 是声明变量的一个关键字，age为变量名 = 是一种运算符，表示赋值，将右侧的值赋给左侧的变量，18就是变量的值。；表示一行代码的结束。
可以定义变量并赋值；也可以先声明变量名，再赋值；
验证变量的数据类型
typeof可以帮我们来判定某个变量是什么类型，比如：console.log(typeof(age));
js中，变量的类型是由值来决定的.此种类型的识别方式决定了js中的数据类型为弱类型
在同一个作用域中，变量名不能重复
数据类型
注意：两个字符串相加（用加号连接），结果就是拼接[连接]在一起
运算符
算术运算符除包括平常的加减乘除还包括：%（取余/取模）++（自增）--（自减）。
比较（关系）运算符包括：>, <, >=, <=, !=（不等）, ==（等于）, ===（全等）（Ps：其中==与===的区别要明确，如下图），得到的结果一定是true或者false。总之，==比较不同数据类型，内容相同结果就为true；===比较相同数据类型，同时内容也要相同结果才为true。
比较（关系）运算符包括：>, <, >=, <=, !=（不等）, ==（等于）, ===（全等）（Ps：其中==与===的区别要明确，如下图），得到的结果一定是true或者false。总之，==比较不同数据类型，内容相同结果就为true；===比较相同数据类型，同时内容也要相同结果才为true。
运算符还包括赋值运算符：=, += -= *= /=；逻辑运算符：&&（逻辑与）, ||（逻辑或）, !（取反）（Ps：针对boolean值）。
当然，很多判断的时候，都不是单一条件，而是复合条件，比如说登录时用账号和密码，两者必须同时满足，才能成功登录（用到逻辑与）。
当然，很多判断的时候，都不是单一条件，而是复合条件，比如说登录时用账号和密码，两者必须同时满足，才能成功登录（用到逻辑与）。
收藏
收藏
0 条评论
下一页
