2022-07-11 第一小组 张明旭 前端JS学习记录
今天是正式学习的第三天，每天一大部分前端的新知识，吐瘦两斤，听课晕乎乎的.不过小事，靠笔记和视频苟活
知识点：
JavaScript是什么？
编程语言、脚本语言。依赖于某种容器（浏览器）运行
有浏览器解释执行
编程语言的分类：
1、解释型：JS Python
2、编译型：C++，C#
3、半解释半编译：Java
JS是运行在浏览器上的，帮助控制页面
JS框架：vue.js react.js jquery.js angular.js
前端服务器语言：node js
JS解释器：
火狐：spidermonkey
chrom、node：V8
Safari：Javascriptcore
edge：chakra
JS在哪里执行？写在网页什么位置
不成文规定：JS放在body的最后
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 用script写JS，一般放在body的结尾 -->
</head>
<body>
...
...
<scrip>
</script>
</body>
</html>
*《JS所有的引用都用script》
JS的简单数据类型：
1、数字（number）：整数，正数，小数，负数
2、字符串(string) :a,中文，@
3、布尔型（boolean）：ture false/1 0
4、空（null）：相当于声明了值为空
5、undefind：未定义，没有值
定义变量：
变量
《开发中尽量减少使用字面量，后期维护更改困难》
在ES6（JS新版本）中，有两个新词定义变量
1、let ：用let声明，无法重新定义
2、const ：有let 的特点，const声明的变量是常量
JS的复杂数据类型
1、数组：一个变量对应多个值
（1）使用数组函数
函数：可以定义一个函数用来执行一系列代码
函数定义之后不会自己执行。需要手动调用函数
四大类：
1.无参无返回值
2.无参有返回值
3.有参有返回值
4.有参无返回值
《函数内不可以在声明函数，但是可以调用函数，调用方式正常调用即可》
return出来可以返回结果，还可以中指函数进行
开发中，尽量不要在return后面继续写语句
弹窗：实质上就是函数。 \n、\r换行符，弹窗里的回车
1、alert：警告弹窗，没有返回值
2、control：带有确认和取消的弹窗，有返回值，点击确定，返回ture，点击取消返回false
3、prompt：带有文本框的弹窗，有返回值，就是文本本框内容
<script>
// 使用数组函数,函数都有小括号
// let arr =Array();
// // 警告弹窗
alert(arr);
console.log(11111);
console.log(arr);
</script>
逻辑判断，流程控制
夹杂着讲运算符：
三元运算符（三目运算符）（必须得到一个布尔类型的结果）
语法是固定的，只能有一个条件。两个选项
+号的特殊性：
除了可以进行加法运算之外，还可以当做连接符。
如果先入为主的认定为+号为连接符，那他就一直是连接符
- / %:可以进行类型转换成数字，如果转不了，结果为NAN
JS的一个原理解析：
所有非空的变量都会被解析成1->false
逻辑判断：
if...else结构
语法：
if(条件表达式){
要执行的代码：
}else{
要执行的代码：
}
if...else结构与多重结构有什么区别？
if...else是可以嵌套的，可以无限嵌套（原则上不超过三层）
if....return:
if(条件表达式){
要执行的代码：
}return ;
return;
switch.case结构：
语法：
switch（能得值表达式）{
case 选项一：
要执行的代码
break；
case 选项二：
要执行的代码
break；
.......
default ：
要执行的代码
}
特点：当表达式的值在case中匹配成功，会执行相应代码，但是会继续运行后面代码，需要用break使其停止
switch...case和if...else怎么选？
1、当需求为区间范围时，switch...case根本无法使用。
2、if...else...基本上啥都能干
3.switch...case比if...else效率高（指效率不同代码执行时间）
4、当需求为固定值，且值不多时用switch...case
5、能用switch...case解决的不用if...else
switch...case和if...else相似之处：
1、几乎所有的switch...case都可以转化为if...else
2、default几乎相当于else
3、case几乎相当于if
4、都可以无限嵌套
switch...case和if...else不同之处：
1、switch需要break
总结：
1、JS的引入，应该写在什么位置
2、JS的数据类型（数组）
3、变量的定义和声明 var let const
4、三种弹窗（三个的意思，有无返回值）
5、函数*****
6、return作用
7、变量的作用域
8、运算符
9、typeof isNaN
10、三元运算符
11、流程控制语句：
两个流程控制语句的相互嵌套*****
if。。。else
switch。。。case
if。。。return
问题： 判断一个年份是否为闰年？（能被4和400整除，不能被100整除）
结果在网页的开发者工具的控制台
<script>
// 判断一个年份是否为闰年
// 能被4和400整除，不能被100整除
let year = 2000;
switch(year){
case year % 4 ===0 && year % 100 != 0 || year % 400 ===0:
console.log(year+"是闰年");
break;
default:
console.log(year+"不是闰年");
}
</script>
<script>
// if else 语句
let year1 = 2000;
if(year1 % 400 ===0){
console.log(year1+"是闰年");
}else{
if (year1 % 4 ===0 && year1 % 100 != 0){
console.log(year1+"是闰年");
}else{
console.log(year1+"不是闰年");
}
}
// 函数+if return
function isRun(year){
if(year1 % 400 ===0){
console.log(year+"是闰年");
return ;
if(year % 4 ===0 && year % 100 != 0){
console.log(year+"是闰年");
}
return ;
console.log(year+"不是闰年");
}
}
isRun(2100)
</script>
<script>
// 函数+switch。。。case + if
function isRun2(year){
switch(year % 4){
case 0:
console.log(year+"是闰年");
return ;
default:
if(year % 4 ===0 && year % 100 != 0){
console.log(year+"是闰年");
}
return ;
console.log(year+"不是闰年");
}
}
isRun2(2000)
2022-07-11 第一小组 张明旭 前端JS学习记录的更多相关文章
- 2022 07 13 第一小组 田龙跃 Java再学习笔记
1.类名命名规则: 只能由数字字母,下划线,美元符号组成(不能以数字开头,尽量不要用下划线开头) 2.注释(养成多写注释的好习惯) 单行注释 // ctrl+/ 多行注释 // ctrl+shirt+ ...
- 4.VUE前端框架学习记录四：Vue组件化编码2
VUE前端框架学习记录四:Vue组件化编码2文字信息没办法描述清楚,主要看编码Demo里面,有附带完整的代码下载地址,有需要的同学到脑图里面自取.脑图地址http://naotu.baidu.com/ ...
- 3.VUE前端框架学习记录三：Vue组件化编码1
VUE前端框架学习记录三:Vue组件化编码1文字信息没办法描述清楚,主要看编码Demo里面,有附带完整的代码下载地址,有需要的同学到脑图里面自取.脑图地址http://naotu.baidu.com/ ...
- 2.VUE前端框架学习记录二
VUE前端框架学习记录二:Vue核心基础2(完结)文字信息没办法描述清楚,主要看编码实战里面,有附带有一个完整可用的Html页面,有需要的同学到脑图里面自取.脑图地址http://naotu.baid ...
- 1.VUE前端框架学习记录一
VUE前端框架学习记录一文字信息没办法描述清楚,主要看编码实战里面,有附带有一个完整可用的Html页面,有需要的同学到脑图里面自取.脑图地址http://naotu.baidu.com/file/f0 ...
- 开博第一篇：DHT 爬虫的学习记录
经过一段时间的研究和学习,大致了解了DHT网络的一些信息,大部分还是参会别人的相关代码,一方面主要对DHT爬虫原理感兴趣,最主要的是为了学习python,大部分是别人的东西原理还是引用别人的吧 DHT ...
- [前端JS学习笔记]JavaScript function
一.函数的声明 1.1 function 命令 function methodName(params) { // code } 如下声明: function test_function(params) ...
- 生命不息学习不止，前端js学习笔记（一）
引言 从毕业到年已经整整7年,期间一直从事.net开发做c/s从 c# 转到 wpf 而后又开始做b/s 用silverlight,从最开始的arcgis engine 到后来的silverlight ...
- [前端JS学习笔记]JavaScript prototype 对象
一.概念介绍 prototype 对象 : 原型对象.在JavaScript中, 每一个对象都继承了另一个对象,后者称为"原型对象". 只有 null 除外,它没有自己的原型对象. ...
- [前端JS学习笔记]JavaScript CallBack
一.概念介绍 CallBack : "回调" . 在spring优秀框架回调无处不在, 回调的运用场景很多, 如 swt事件监听.netty等.它的主要作用是提高程序执行效率, 一 ...
随机推荐
- java常用、通用代码或配置
pom.xml 支持springBoot parent <parent> <groupId>org.springframework.boot</groupId> & ...
- uniapp自定义组件的使用--记录
在 pages.json同级目录下 创建目录和文件: components: videoComp: VideoPlaySelf.vue VideoPlaySelf.vue 内容 <templat ...
- Windows10下SecureCRT、SecureFX安装与破解(超级详细)
整理了Windows10下最新版本SecureCRT9.1.SecureFX9.1安装 1.资源地址: 链接:https://pan.baidu.com/s/1XoQqpRlpBm6Tvc0fHni6 ...
- Java包机制 与Javados 命令
package: 定义包 import : 导入包 com.wang.test.* :点* 是导入当前包下的所有类 @author :注释作者名 @version :注释版本号 @since ...
- 转载-分享一个Ubuntu20.04安装以及中文教程
https://blog.csdn.net/weixin_45912291/article/details/108901106 https://www.cnblogs.com/libotaoer/p/ ...
- OpenJ_Bailian - 1088
OpenJ_Bailian - 1088 题解:DFS记忆化搜索 记忆化搜索也可以说是动态规划,最后的答案也是从一个个子问题推导而来 #include <bits/stdc++.h> #d ...
- Mybatis缓存（3）
10.4.3二级缓存
- gcc 中weak弱函数
1.weak弱函数 weak 函数用于定义变量或者函数.弱函数一般用于多个模块间的交互接口 int __attribute__((weak)) test_lib_a(int a, int b) { p ...
- 控制台程序console输入参数 获取参数
class Program { static void Main(string[] args) { i ...
- 【TensorFlow】InternalError: Failed copying input tensor
TensorFlow-GPU 执行模型训练时报错: InternalError: Failed copying input tensor from /job:localhost/replica:0/t ...