当前位置: 首页 > news >正文

前端零基础入门到上班:【Day8】JavaScript 基础语法入门

前端零基础入门到上班:【Day8】JavaScript 基础语法入门(超全!!!)

    • 一、JavaScript 简介
    • 二、引入 JavaScript 的三种方式
    • 三、变量与常量(var、let、const)
      • 3.1 var (传统方式)
      • 3.2 let (ES6新标准)
      • 3.3 const (常量)
    • 四、数据类型
      • 4.1 基本类型(值类型)
      • 4.2 引用类型(对象类型)
    • 五、运算符
      • 5.1 算术运算符
      • 5.2 赋值运算符
      • 5.3 比较运算符
      • 5.4 逻辑运算符
    • 六、流程控制
      • 6.1 条件语句
        • if-else
        • switch
      • 6.2 循环语句
        • for
        • while
        • do-while
    • 七、函数基础
      • 7.1 函数的定义
      • 7.2 带参数和返回值
      • 7.3 箭头函数(ES6新语法)
    • 八、注释规则
    • 九、小案例练习:判断奇偶数
  • 第一小结
    • 十、变量提升详解
      • 10.1 什么是变量提升?
      • 10.2 let 和 const 不存在变量提升
    • 十一、let 和 const 的细节陷阱
      • 11.1 块级作用域
      • 11.2 const 声明引用类型的“对象”
    • 十二、数据类型更深层
      • 12.1 typeof 返回值总结
      • 12.2 引用类型的比较
    • 十三、运算符更深入
      • 13.1 短路运算
      • 13.2 三元运算符
    • 十四、流程控制更深入
      • 14.1 break 和 continue
      • 14.2 嵌套循环
    • 十五、函数更高级
      • 15.1 函数表达式
      • 15.2 匿名函数
      • 15.3 回调函数
    • 十六、作用域和作用域链
      • 16.1 什么是作用域?
      • 16.2 什么是作用域链?
    • 十七、闭包基础
      • 17.1 什么是闭包?
    • 十八、小实战
      • 18.1 简易登录验证
      • 18.2 简易闹钟程序
    • 十九、常见错误总结
  • 第二小结
    • 二十、switch 语句
    • 二十一、数组遍历方法大全
      • 21.1 forEach 遍历数组
      • 21.2 for...in 遍历对象/数组
      • 21.3 for...of 遍历数组(ES6)
    • 二十二、Math对象常用方法
    • 二十三、Date 时间对象基础
    • 二十四、字符串常用API
    • 二十五、数组常用API
    • 二十六、对象操作 (ES5)
      • 26.1 Object.keys()
      • 26.2 Object.values()
    • 二十七、JSON基础操作
    • 二十八、定时器 setTimeout / setInterval
      • 28.1 延迟执行
      • 28.2 循环执行
    • 二十九、错误处理 try...catch
    • 三十、小案例:猜数字游戏
    • 三十一、小面试题整理(基础)
  • 总结✅
  • 感谢阅读

一、JavaScript 简介

JavaScript 是一门脚本语言,最初为了让网页动起来而诞生。
随着发展,它不仅能操作网页(DOM),还能做服务器开发(Node.js)、小程序开发、桌面应用、移动端应用等等。

特点总结:

  • 解释型语言,无需编译,浏览器直接执行
  • 弱类型语言(变量类型可以变化)
  • 面向对象、函数式编程
  • 主要运行在客户端(也能在服务器端运行)

💬 简单记忆
JavaScript 让网页动起来 + 也能做服务器和 App!


二、引入 JavaScript 的三种方式

  1. 行内式(直接写在 HTML 标签的属性中)
<button onclick="alert('你好,世界!')">点我</button>
  1. 内部式(写在 <script> 标签内部)
<!DOCTYPE html>
<html>
<head><title>内部式示例</title>
</head>
<body><script>console.log('Hello World');</script>
</body>
</html>
  1. 外部式(写在单独的 .js 文件中,再用 <script src=""> 引入)

index.html:

<script src="main.js"></script>

main.js:

console.log('这是外部文件引入的 JS!');

🌟推荐使用外部式,方便管理代码,清晰整洁!


三、变量与常量(var、let、const)

3.1 var (传统方式)

var name = "Tom";
console.log(name);

特点:

  • 可以重复声明
  • 存在变量提升(会提前到作用域顶部)
console.log(a); // undefined
var a = 10;

3.2 let (ES6新标准)

let age = 18;
console.log(age);

特点:

  • 不允许重复声明
  • 块级作用域(花括号内有效)
  • 没有变量提升

3.3 const (常量)

const PI = 3.14;

特点:

  • 声明后不能改变
  • 必须赋初值
const name = "张三";
// name = "李四"; ❌ 错误,不能修改

四、数据类型

JavaScript 有两大类数据类型:

4.1 基本类型(值类型)

  • Number:数字
  • String:字符串
  • Boolean:布尔值
  • Null:空
  • Undefined:未定义
  • Symbol(ES6)
  • BigInt(ES2020)

示例:

let num = 100;
let str = "前端";
let flag = true;
let empty = null;
let notDefined;

4.2 引用类型(对象类型)

  • Object(对象)
  • Array(数组)
  • Function(函数)
  • Date(日期)

示例:

let person = { name: "小明", age: 20 };
let hobbies = ["打球", "看电影"];
let sayHi = function() { alert("Hi!"); }

五、运算符

5.1 算术运算符

运算符说明示例
+1 + 2
-5 - 3
*4 * 6
/8 / 2
%取余9 % 4

5.2 赋值运算符

运算符说明示例
=赋值x = 5
+=加后赋值x += 3 等价于 x = x + 3

其他:-=, *=, /=, %=

5.3 比较运算符

运算符说明
==等于(会进行类型转换)
===全等(值和类型都要相同)✅ 推荐使用
!=不等于
!==不全等
>, <, >=, <=大小比较

示例:

console.log(5 == "5");  // true
console.log(5 === "5"); // false

5.4 逻辑运算符

运算符说明示例
&&与(and)true && false -> false
||或(or)true || false -> true
!非(not)!true -> false

六、流程控制

6.1 条件语句

if-else
let score = 85;
if (score >= 90) {console.log("优秀");
} else if (score >= 60) {console.log("及格");
} else {console.log("不及格");
}
switch
let day = 3;
switch(day) {case 1:console.log("星期一");break;case 2:console.log("星期二");break;case 3:console.log("星期三");break;default:console.log("未知");
}

6.2 循环语句

for
for (let i = 1; i <= 5; i++) {console.log(i);
}
while
let i = 1;
while (i <= 5) {console.log(i);i++;
}
do-while
let j = 1;
do {console.log(j);j++;
} while (j <= 5);

七、函数基础

7.1 函数的定义

function greet() {console.log("你好!");
}
greet();

7.2 带参数和返回值

function add(x, y) {return x + y;
}
let result = add(3, 5);
console.log(result); // 8

7.3 箭头函数(ES6新语法)

const multiply = (a, b) => a * b;
console.log(multiply(2, 3)); // 6

八、注释规则

  • 单行注释://
  • 多行注释:/* */

示例:

// 这是单行注释/*
这是
多行
注释
*/

九、小案例练习:判断奇偶数

练习题目:输入一个数字,判断是奇数还是偶数。

示例代码:

let num = prompt("请输入一个数字");
if (num % 2 == 0) {alert("这是一个偶数");
} else {alert("这是一个奇数");
}

prompt() 是浏览器弹窗输入框)


第一小结

我们学习了 掌握了变量、数据类型、运算符、条件循环、函数等知识。


十、变量提升详解

10.1 什么是变量提升?

变量声明(var 声明的变量)和函数声明会被提升到作用域顶部。

示例:

console.log(name); // undefined
var name = "小王";

解析:
实际上浏览器会这样理解你的代码:

var name;
console.log(name); // undefined
name = "小王";

注意:只提升声明不会提升赋值


10.2 let 和 const 不存在变量提升

console.log(age); // 报错:ReferenceError
let age = 18;

原因
let 和 const 在声明之前是“暂时性死区”,不能访问。


十一、let 和 const 的细节陷阱

11.1 块级作用域

let/const 声明的变量只在它所在的代码块 {} 内有效。

{let a = 10;
}
console.log(a); // 报错:a is not defined

11.2 const 声明引用类型的“对象”

对象的属性可以改动,但对象的引用地址不能变。

const person = { name: "张三" };
person.name = "李四";  // ✅ 可以改属性
// person = {};  ❌ 错误,不能整体赋值新对象

十二、数据类型更深层

12.1 typeof 返回值总结

数据typeof 返回
number“number”
string“string”
boolean“boolean”
undefined“undefined”
null“object” (注意!
array“object”
object“object”
function“function”

重点注意

  • typeof null 返回 "object" —— 这是历史遗留的设计错误!

如果要判断数组可以用:

Array.isArray(arr); // true

12.2 引用类型的比较

引用类型(如对象、数组、函数)比较的是地址而不是内容!

let obj1 = { a: 1 };
let obj2 = { a: 1 };
console.log(obj1 == obj2); // false
console.log(obj1 === obj2); // false

即使内容一模一样,它们也是两个不同的对象!


十三、运算符更深入

13.1 短路运算

  • &&(与运算):第一个为 false,返回第一个;否则返回第二个。
  • ||(或运算):第一个为 true,返回第一个;否则返回第二个。

示例:

console.log(0 && 5);   // 0
console.log(3 && 5);   // 5
console.log(0 || 5);   // 5
console.log(3 || 5);   // 3

常用于设置默认值:

let name = userInput || "默认值";

13.2 三元运算符

条件表达式 ? 表达式1 : 表达式2;

示例:

let age = 20;
let result = age >= 18 ? "成年人" : "未成年人";
console.log(result); // 成年人

十四、流程控制更深入

14.1 break 和 continue

  • break:立即跳出整个循环
  • continue:跳过本次循环,进入下一次

示例:

for (let i = 1; i <= 5; i++) {if (i === 3) {continue; // 跳过 i==3}console.log(i);
}

输出:

1
2
4
5

14.2 嵌套循环

for (let i = 1; i <= 3; i++) {for (let j = 1; j <= 3; j++) {console.log(`i=${i}, j=${j}`);}
}

十五、函数更高级

15.1 函数表达式

const add = function(x, y) {return x + y;
};
console.log(add(2, 3));

特点:函数可以赋值给变量


15.2 匿名函数

没有名字的函数:

setTimeout(function() {console.log('延迟2秒输出');
}, 2000);

15.3 回调函数

把一个函数作为参数传给另一个函数。

function greeting(name) {alert('Hello ' + name);
}function processUserInput(callback) {let name = prompt('请输入你的名字');callback(name);
}processUserInput(greeting);

十六、作用域和作用域链

16.1 什么是作用域?

作用域就是变量生效的范围

  • 全局作用域
  • 函数作用域
  • 块级作用域(let、const)

16.2 什么是作用域链?

如果当前作用域找不到变量,就会向外层作用域查找,直到全局。

示例:

let a = 10;
function outer() {let b = 20;function inner() {console.log(a); // 10 (向外找到了)console.log(b); // 20}inner();
}
outer();

十七、闭包基础

17.1 什么是闭包?

闭包是:函数内部返回一个函数,并且这个返回的函数仍然可以访问外部函数的变量。

示例:

function outer() {let count = 0;return function() {count++;console.log(count);}
}
let counter = outer();
counter(); // 1
counter(); // 2

闭包应用场景

  • 延长局部变量的生命周期
  • 封装私有变量

十八、小实战

18.1 简易登录验证

let username = prompt("请输入用户名");
let password = prompt("请输入密码");if (username === "admin" && password === "123456") {alert("登录成功!");
} else {alert("用户名或密码错误!");
}

18.2 简易闹钟程序

setTimeout(function() {alert("时间到啦!");
}, 5000); // 5秒后弹出

十九、常见错误总结

错误情况原因
使用未声明变量使用变量前必须声明
忘记加分号JS 会自动补全,但可能出错
if/for 后忘记加 {}建议始终加上花括号
区分 == 和 ===推荐永远用 ===
忘记 break 导致 switch 穿透每个 case 后加 break

第二小结

✅ 本篇巨细无遗地讲完了 JavaScript 基础语法(加强版)
✅ 帮你打下了扎实的地基
✅ 还穿插了小案例帮助理解


二十、switch 语句

switch 语句用来基于不同的值执行不同的代码块,适合多条件判断。

let color = "green";switch (color) {case "red":console.log("红色");break;case "green":console.log("绿色");break;case "blue":console.log("蓝色");break;default:console.log("未知颜色");
}

注意

  • 每个 case 后面通常需要 break
  • 没有 break 会继续往下执行(case 穿透)。

二十一、数组遍历方法大全

21.1 forEach 遍历数组

let arr = [1, 2, 3];
arr.forEach(function(item, index) {console.log(index, item);
});

特点:

  • 遍历数组每一项
  • 无法中途跳出循环(break 不起作用)

21.2 for…in 遍历对象/数组

let person = {name: "小明", age: 18};
for (let key in person) {console.log(key, person[key]);
}

注意

  • for...in 是遍历对象的属性名
  • 遍历数组时可能顺带遍历原型链上的属性(一般不用它遍历数组)

21.3 for…of 遍历数组(ES6)

let arr = ["a", "b", "c"];
for (let item of arr) {console.log(item);
}

特点:

  • 直接拿到数组的每一项
  • 不适合对象遍历

二十二、Math对象常用方法

JavaScript 提供了 Math 对象,封装了数学运算常用方法。

console.log(Math.PI); // 圆周率
console.log(Math.round(4.5)); // 四舍五入 5
console.log(Math.floor(4.9)); // 向下取整 4
console.log(Math.ceil(4.1));  // 向上取整 5
console.log(Math.random());   // 0~1随机小数
console.log(Math.max(1, 99, 88)); // 最大值
console.log(Math.min(1, 99, 88)); // 最小值

👉 常见应用:生成随机整数

let rand = Math.floor(Math.random() * 100); // 0-99随机整数
console.log(rand);

二十三、Date 时间对象基础

获取当前时间:

let now = new Date();
console.log(now);

常用方法:

console.log(now.getFullYear()); // 年
console.log(now.getMonth() + 1); // 月(注意:0~11)
console.log(now.getDate());     // 日
console.log(now.getHours());    // 小时
console.log(now.getMinutes());  // 分钟
console.log(now.getSeconds());  // 秒

格式化输出(自己拼接):

let dateStr = now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate();
console.log(dateStr);

二十四、字符串常用API

let str = "hello world";console.log(str.length);     // 长度
console.log(str.toUpperCase()); // 转大写
console.log(str.toLowerCase()); // 转小写
console.log(str.indexOf("world")); // 查找子串位置
console.log(str.slice(0, 5));     // 截取字符串
console.log(str.replace("world", "JavaScript")); // 替换内容
console.log(str.split(" "));  // 按空格分割成数组

二十五、数组常用API

let arr = [1, 2, 3];// 添加/删除
arr.push(4);  // 尾部添加
arr.pop();    // 尾部删除
arr.unshift(0); // 头部添加
arr.shift();   // 头部删除// 拼接新数组
let arr2 = arr.concat([5,6]);// 截取部分
let part = arr.slice(1,3);// 遍历映射
let newArr = arr.map(function(item){return item * 2;
});

二十六、对象操作 (ES5)

26.1 Object.keys()

返回对象所有可枚举属性名数组:

let obj = {a:1, b:2};
console.log(Object.keys(obj)); // ["a", "b"]

26.2 Object.values()

返回对象所有属性值数组:

console.log(Object.values(obj)); // [1, 2]

二十七、JSON基础操作

JavaScript 原生支持 JSON:

  • 对象转字符串:JSON.stringify
  • 字符串转对象:JSON.parse
let person = {name: "Tom", age: 20};let str = JSON.stringify(person);
console.log(str); // '{"name":"Tom","age":20}'let obj = JSON.parse(str);
console.log(obj.name); // Tom

二十八、定时器 setTimeout / setInterval

28.1 延迟执行

setTimeout(function(){console.log("3秒后执行");
}, 3000);

28.2 循环执行

let timer = setInterval(function(){console.log("每隔2秒执行一次");
}, 2000);// 停止循环
clearInterval(timer);

二十九、错误处理 try…catch

异常捕获机制,防止程序直接崩溃。

try {let x = y + 1; // y未定义,报错
} catch(error) {console.log("出错啦:" + error.message);
}

三十、小案例:猜数字游戏

let answer = Math.floor(Math.random() * 100) + 1;
let guess;while (true) {guess = parseInt(prompt("猜一个1到100的数字:"));if (guess > answer) {alert("太大了!");} else if (guess < answer) {alert("太小了!");} else {alert("恭喜你,猜对了!");break;}
}

三十一、小面试题整理(基础)

题目简答
typeof null 是什么?“object”(历史Bug)
var、let、const 区别?var 有提升,let/const 有块级作用域
== 和 === 区别?== 会类型转换,=== 不会
什么是闭包?函数内部返回函数并引用外部变量
怎么判断数组?Array.isArray(arr)

总结✅

经过今天【Day8】的系统学习,我们已经完成了 JavaScript 入门阶段最关键的一步:

✅ 理解了 JavaScript 的基本数据类型与变量声明。
✅ 掌握了流程控制(条件判断、循环)与函数定义调用。
✅ 理解了数组、对象的基础操作和遍历方式。
✅ 学习了内置对象(Math、Date、JSON)和常用API。
✅ 初步掌握了定时器、异常处理、基础案例练习。
✅ 同时,还补充了常见面试题,夯实基础。

这一套内容,既覆盖了理论知识,又贯穿了实战技巧,可以说打下了非常扎实的基础。
JavaScript入门,已经可以小试牛刀了!

真正优秀的开发者,从来都是在基础阶段用力扎根。
你认真学的每一行代码,未来都会开花结果。


感谢阅读

感谢你坚持认真学习到这里!
每一次翻阅到这里,都是对自己最好的投资。

  • 如果有不懂的地方,欢迎随时留言/私信交流!📩
  • 如果内容对你有帮助,记得点个赞收藏支持一下!🌟
  • 你的每一份认真和坚持,未来都会让你闪闪发光!✨

在接下来的【Day9】中,我们将继续前进——进入JavaScript进阶篇
探索更高级的数组方法、对象深度操作、函数闭包与作用域链的奥秘。

别急,一步步来,未来可期!
咱们下节继续冲刺!🚀🚀🚀

相关文章:

前端零基础入门到上班:【Day8】JavaScript 基础语法入门

前端零基础入门到上班:【Day8】JavaScript 基础语法入门&#xff08;超全&#xff01;&#xff01;&#xff01;&#xff09; 一、JavaScript 简介二、引入 JavaScript 的三种方式三、变量与常量&#xff08;var、let、const&#xff09;3.1 var &#xff08;传统方式&#xff…...

ppt流程图怎么?ppt流程图模板大全

ppt流程图怎么&#xff1f;ppt流程图剪头模板&#xff0c;ppt流程图模板大全: ppt流程图_模板素材_PPT模板_ppt素材_免抠图片_AiPPTer...

makefile总结

Makefile 学习视频&#xff1a;1、野火的基础入门篇-第32讲 Makefile三要素_哔哩哔哩_bilibili ​ 2、b站视频04 一个稍复杂的Makefile_哔哩哔哩_bilibili 学习资料&#xff1a;第2个视频对应的Make/make.md 无限十三年/CPP - 码云 - 开源中国 ch0_Makefile简介 Makefile是什…...

MIME 类型是个什么东西?

MIME 类型&#xff08;Multipurpose Internet Mail Extensions&#xff09;即多用途互联网邮件扩展类型&#xff0c;它是一种标准&#xff0c;用于表示文档、文件或字节流的性质和格式。 最初设计用于电子邮件系统&#xff0c;后来被广泛应用于网页、HTTP 协议等领域&#xff0…...

javaWeb开发---前后端开发全景图解(基础梳理 + 技术体系)

在现代互联网开发中&#xff0c;前端与后端的分工协作非常重要。本文结合实际架构图&#xff0c;全面梳理前端技术栈、后端技术栈以及服务器端整体流程&#xff0c;帮助初学者建立清晰的整体认知。 一、整体架构概览 系统整体划分为三个主要部分&#xff1a; B端&#xff08;…...

spring-rabbit的CachingConnectionFactory默认参数导致消费者Channel数量暴增问题解决

文章目录 1.前言2.解决2.1消费监听方法中关闭channel2.2 配置设置两个参数 3.总结 1.前言 由于之前写了一个好用的rabbitmq-spring-boot-start启动器&#xff0c;后面在生产实践之后反馈消费者连接的Channel数量过多&#xff0c;一个消费者的Channel数量可以达到好几百&#xf…...

线上JVM调优与全栈性能优化 - Java架构师面试实战

线上JVM调优与全栈性能优化 - Java架构师面试实战 本文通过一场互联网大厂的Java架构师面试&#xff0c;深入探讨了线上JVM调优、OOM定位、死锁定位、内存和CPU调优、线程池调优、数据库调优、缓存调优、网络调优、微服务调优及分布式调优等关键领域。 第一轮提问 面试官&am…...

【KWDB创作者计划】_企业级多模数据库实战:用KWDB实现时序+关系数据毫秒级融合(附代码、性能优化与架构图)

一、技术背景与行业痛点 1.1 多模数据融合挑战 场景痛点&#xff1a; 工业物联网设备每秒产生百万级传感器数据&#xff08;时序数据&#xff09;。需关联设备档案&#xff08;关系数据&#xff09;生成设备健康报告&#xff0c;传统方案需多数据库跳转&#xff0c;延迟>5…...

“八股训练营”学习总结

在参加为期 40 天的八股训练营的这段时间里&#xff0c;我收获满满&#xff0c;不仅在知识技能上得到了提升&#xff0c;更在学习习惯和自我认知方面有了很大的进步。 在知识层面&#xff0c;训练营涵盖了网络、数据库、缓存以及python测试开发等多方面的知识点。 网络方面&a…...

java工具类

LocalDateTime LocalDateTime可以获取当前时间&#xff1a; LocalDateTime now LocalDateTime.now(); 同时他也可以获取指定时间&#xff1a; LocalDateTime dateTime LocalDateTime.of(2023, 5, 15, 10, 30) 若我们时间值超出了我们的实际情况值&#xff0c;我们将会出现…...

「OC」源码学习——alloc与init的实现

「OC」源码学习——alloc与init的实现 前言 费劲千辛万苦终于项目给写完了&#xff0c;进入下一个阶段&#xff0c;源码的学习 alloc的调用顺序 我们在main函数之中打上断点&#xff0c;先运行 再在alloc之中的各个函数之中打上断点&#xff0c;在关键步骤上打上断点&#…...

AOSP Android14 Launcher3——动画核心类QuickstepTransitionManager详解

Launcher3中&#xff0c;有一个类在跟桌面相关的各种动画中扮演着非常关键的角色&#xff0c;这个类就是QuickstepTransitionManager。 QuickstepTransitionManager在aosp中的路径为&#xff1a;aosp/packages/apps/Launcher3/quickstep/src/com/android/launcher3/QuickstepT…...

STM32:看门狗

独立看门狗 简介 独立看门狗&#xff08;IWDG&#xff09;由独立的低速时钟&#xff08;LSI&#xff09;驱动&#xff0c;即便主时钟发生故障&#xff0c;它依然能够正常工作。其主要作用是在程序出现异常时&#xff0c;通过复位来保障系统的稳定性。独立看门狗的喂狗操作相对…...

第十三步:vue

Vue 1、上手 1、安装 使用命令&#xff1a;npm create vuelatestvue文件后缀为.vueconst app createApp(App)&#xff1a;初始化根组件app.mount("#app")&#xff1a;挂载根组件到页面 2、文件 script标签&#xff1a;编写jstemplate标签&#xff1a;编写htmls…...

《代码整洁之道》第8章 边界 - 笔记

甚至是你团队里其他组写的你无法随意修改的代码。 这些外部代码是你的**“边界”。它们可能会升级、可能会有 Bug、可能会有反人类的设计、甚至你将来可能想换一个类似的库或服务。如果你的应用代码直接且紧密地依赖**这些外部代码的具体类、方法、异常等细节&#xff0c;那么…...

【CF】Day45——Codeforces Round 1021 (Div. 2) BC

阅读理解。。。不过挺有意思&#xff08; B. Sasha and the Apartment Purchase 题目&#xff1a; 思路&#xff1a; 看了半天没看懂... 题目叽里咕噜一大堆&#xff0c;说白了就是让我们在一个 可删除k个数 的 数组 中选 一些点 且 这些点的f(x) 是此时 删完了k个数之后的数组…...

《代码整洁之道》第5章 格式 - 笔记

你应该选择一套管理代码格式的简单规则。如果是团队&#xff0c;应该选择一套团队一致同意采用的简单格式规则。 最重要的原则&#xff1a;一致性&#xff08;Consistency&#xff09;&#xff01; 没有完美的格式规范&#xff0c;但有统一的规范。 整个团队&#xff08;或者…...

通过示例学习:连续 XOR

通过示例学习&#xff1a;连续 XOR 如果我们想在 PyTorch 中构建神经网络&#xff0c;可以使用 &#xff08;with&#xff09; 指定所有参数&#xff08;权重矩阵、偏差向量&#xff09;&#xff0c;让 PyTorch 计算梯度&#xff0c;然后调整参数。但是&#xff0c;如果我们有很…...

加密算法 AES、RSA、MD5、SM2 的对比分析与案例(AI)

加密算法 AES、RSA、MD5、SM2 的对比分析 一、相同点 ‌密码学基础‌ 均为现代密码学核心算法&#xff0c;用于保障数据安全。‌数据处理‌ 均涉及数据转换&#xff08;加密、签名、哈希等&#xff09;。‌密钥依赖‌ AES、RSA、SM2 依赖密钥&#xff08;对称或非对称&#x…...

基于STM32、HAL库的MAX31865模数转换器ADC驱动程序设计

一、简介: MAX31865是一款高精度的铂电阻温度检测器(RTD)至数字转换器,具有以下特点: 支持2线、3线或4线RTD配置 15位ADC分辨率 可编程RTD和基准电阻 内置故障检测(开路、短路等) SPI接口通信 工作电压:3.0V至3.6V 二、硬件接口: STM32L4XX <--> MAX31865 PA5(SCK…...

Laravel5.7的一些用法

1、事件需要运行 php artisan queue:work 2、数据库对象关联 1对1 hasOne 1对多 hasMany 1依赖多 belongsTo 多依赖多 belongsToMany 3、 关联查询 with 关联统计 withCount 统计时指定字段名。 如: withCount([cardHolderOrders as order_count]); 4、 // 一次查询&…...

Vue3 + OpenLayers 开发教程 (六)WebGL渲染优化

1. WebGL 渲染优化 1.1 WebGL 渲染器配置 创建 src/utils/webgl.ts&#xff1a; import { Map } from ol; import { WebGLPointsLayer } from ol/layer; import { Vector as VectorSource } from ol/source; import { Style, Circle, Fill, Stroke } from ol/style;// 创建 …...

【C++】C++11新特性(一)

文章目录 列表初始化initializer_list左值引用和右值引用 列表初始化 在 C98 中可以使用{}对数组或者结构体元素进行统一的列表初始值设定 struct Point {int _x;int _y; }; int main() {int array1[] { 1, 2, 3, 4, 5 };int array2[5] { 0 };Point p { 1, 2 };return 0; …...

【网络原理】 网络编程套接字

文章目录 一、网络编程基础1. 为什么需要网络编程&#xff1f;2. 什么是网络编程3 .网络编程中的基本概念发送端和接收端请求和响应客户端和服务端 4. 常见的客户端服务端模型 二、Socket套接字1. 概念2.分类3. Java数据报套接字通信模型4.Java流套接字通信模型 三、UDP数据报套…...

每天五分钟深度学习框架pytorch:使用visdom绘制损失函数图像

visdom的安装 pip install visdom如果安装失败 pip install --upgrade visdom开启visdom python -m visdom.server nohup python -m visdom.server后台启动然后就会出现,下面的页面,我们可以使用下面的链接打开visdom页面 Visdom中有两个重要概念: env环境。不同环境的可…...

【MySQL专栏】MySQL数据库表的内外连接

文章目录 1、表的内连接&#xff08;1&#xff09;内连接的语法格式①显示SMITH的名字和部门名称 2、外连接&#xff08;1&#xff09;左外连接左外连接的语法格式通过实例演示&#xff1a; &#xff08;2&#xff09;右外连接右外连接的语法格式通过实例演示 1、表的内连接 什…...

-信息革命-

信息革命-马歇尔麦克卢汉&#xff08;MARSHALL McLUHAN&#xff09;&#xff0c;1964年 随着大系统的加速崩溃&#xff0c;作为塑造经济生活和收入分配的一个因素&#xff0c;系统性的强 制将会式微。很快&#xff0c;在社会机构的组织中&#xff0c;效率将会比权力的分配更加重…...

Charles 抓包入门教程

一、什么是 Charles&#xff1f; Charles 是一款功能强大的抓包工具&#xff0c;可以拦截、查看、分析电脑和手机上的 HTTP/HTTPS 网络请求。常用于&#xff1a; 查看网页或App发送的请求和返回的数据调试接口、分析问题模拟网络环境&#xff08;断网、慢速网络&#xff09;修…...

深度学习新趋势:利用MLP取代卷积层——S2-MLPv2模型解析

深度学习新趋势&#xff1a;利用MLP取代卷积层——S2-MLPv2模型解析 近年来&#xff0c;深度学习领域不断涌现出新的技术革新&#xff0c;而其中最引人注目的趋势之一就是用多层感知机&#xff08;MLP&#xff09;替代传统的卷积层。这种转变不仅带来了计算效率的提升&#xf…...

【玩转 JS 函数式编程_016】DIY 实战:巧用延续传递风格(CPS)重构倒计时特效逻辑

文章目录 巧用延续传递风格&#xff08;CPS&#xff09;重构倒计时特效逻辑1 起因2 换一种思路3 填坑之旅4 复盘与小结 写在前面 都说念念不忘&#xff0c;必有回响。写过的文章也好&#xff0c;看过的视频也罢&#xff0c;其实只要用心积累&#xff0c;不必刻意去死记硬背&…...

虚函数表的设计和多态的实现

虚表指针 类直接定义虚函数&#xff1a;编译器自动在对象头部插入 vptr。 继承含虚函数的父类&#xff1a;子类复用父类的 vptr&#xff0c;不会创建新的vptr 单继承&#xff08;子类继承一个含虚函数的父类&#xff09; 1.创建新的虚函数表 2.沿用父类的虚表指针&#xff…...

中国科学院大学计算机考研历年初试分数线分析以及计算机所考的科目有哪些?

以下是对中国科学院大学计算机考研历年初试分数线分析以及计算机所考科目的介绍&#xff1a; 历年初试分数线分析 • 2024 年 &#xff1a;计算机应用技术专业&#xff08;专业代码 081203&#xff09;和计算机技术专业&#xff08;专业代码 085404&#xff09;的复试分数线为…...

Simulink与C的联合仿真调试

背景 simulink的Matlab Function&#xff0c;默认采用double类型的数据&#xff0c;无法定制int或者single类型的数据&#xff1b;Simulink中的Matlab Function直接调用.m文件中的函数&#xff08;该函数中对数据类型有single或者int的定义&#xff09;&#xff0c;该函数中的…...

DeepSeek 多头潜在注意力(Multi-Head Latent Attention, MLA)技术

1. 核心原理 多头潜在注意力&#xff08;MLA&#xff09;是Transformer架构的扩展技术&#xff0c;通过潜在空间投影和多注意力头并行计算增强模型对长序列和复杂特征的建模能力。 1.1 关键技术点 潜在空间压缩 将原始高维注意力矩阵投影到低维潜在空间&#xff0c;降低计算复…...

C# 类(Class)教程

在现代面向对象编程中&#xff0c;**类&#xff08;Class&#xff09;**是最基础、最重要的概念之一。通过学习类&#xff0c;我们可以理解怎样定义自己的数据类型&#xff0c;封装数据与行为&#xff0c;构建复杂的软件体系结构。本文将详细介绍C#中的类&#xff0c;从基础定义…...

Kubernetes学习笔记-环境变量的使用

如果项目需要一些灵活配置&#xff0c;减少硬编码或者避免敏感信息的暴露&#xff0c;可以考虑使用Kubernetes Pod下的容器的环境变量。 Pod容器设置环境变量的方式&#xff1a; 可以通过Deployment配置文件的env字段来设置环境变量 value env:- name: ACTIVE_PROFILEvalue: …...

git提交规范记录,常见的提交类型及模板、示例

Git提交规范是一种约定俗成的提交信息编写标准&#xff0c;旨在使代码仓库的提交历史更加清晰、可读和有组织。以下是常见的Git提交类型及其对应的提交模板&#xff1a; 提交信息的基本结构 一个标准的Git提交信息通常包含以下三个主要部分&#xff1a; Header‌&#xff1a;描…...

关于指针和指针算术

第一次读C primer plus 第六版时&#xff0c;关于指针的语法一些名词没有用心去理解&#xff0c;再读的时候&#xff0c;讲到指针算术这个词时&#xff0c;感觉之前读像是漏了很关键的点&#xff0c;这次读&#xff0c;写下关于指针算术的思考。 有漏了的感觉是&#xff0c;在…...

el-input限制输入只能是数字 限制input只能输入数字

方法一&#xff1a; 通过设置type属性&#xff1a;type“number”&#xff0c;这种方式一般会影响样式&#xff0c;不建议使用&#xff0c;如下图&#xff1a; <el-input type"number" v-model"aaa"></el-input>方法二&#xff1a; 通过绑定值…...

Pydantic:校验器(@validator)、模型嵌套、模型继承

&#x1f4da; 1. 校验器&#xff08;validator&#xff09; Pydantic 允许你自定义字段验证逻辑。用 validator 装饰器可以在字段赋值时自动进行检查或修改。 例子&#xff1a; from pydantic import BaseModel, validatorclass User(BaseModel):name: strage: intvalidato…...

343. 整数拆分

给定一个正整数 n&#xff0c;将其拆分为至少两个正整数的和&#xff0c;并使这些整数的乘积最大化。 返回你可以获得的最大乘积。 示例 1: 输入: 2输出: 1解释: 2 1 1, 1 1 1。 示例 2: 输入: 10输出: 36解释: 10 3 3 4, 3 3 4 36。说明: 你可以假设 n 不小于 2…...

前端面试 js

作用域链 内存管理 垃圾回收器 引用计数 默认栈里面会有一次引用 问题&#xff1a;循环引用&#xff0c;会产生内存泄漏 标记清除 垃圾回收期会定期从根开始遍历&#xff0c;找到有引用的对象 闭包 内存泄漏 this的指向 默认绑定 独立调用的this都是window function foo()…...

Linux CentOS 安装Python 3.8.0

在 CentOS 上升级 Python 3.6.8 到 3.8.0&#xff0c;可以按照以下步骤操作&#xff1a; 1. 安装依赖 sudo yum groupinstall -y "Development Tools" sudo yum install -y openssl-devel bzip2-devel libffi-devel zlib-devel wget 如果遇到报错“File "/bin…...

EXCEL常用函数公式和VBA汇总第二篇

系列文章目录 文章目录 系列文章目录前言一、excel公式应用1.rand函数2.rand函数随机排序3.rand函数提取数据4.correl函数5.SUBSTITUTE函数6.MAX组合函数7.分析下班时间8.柏拉图自动排序 总结 前言 一、excel公式应用 1.rand函数 用excel生成1-5的随机数字&#xff0c;其中对…...

Python 基础核心知识

1. Python 特点 简洁易读&#xff1a;代码简洁&#xff0c;强制缩进&#xff08;取代花括号&#xff09;。动态类型&#xff1a;变量无需声明类型&#xff08;如 x 10&#xff09;。跨平台&#xff1a;支持 Windows、Linux、macOS。丰富的库&#xff1a;如 NumPy&#xff08;…...

软考:软件设计师考试数据结构知识点详解

文章目录 1. 引言1.1 数据结构的重要性1.2 软件设计师考试中数据结构的考察目标 2. 基本概念和术语2.1 数据结构的定义2.2 算法和数据结构的关系2.3 抽象数据类型&#xff08;ADT&#xff09; 3. 线性结构3.1 数组3.1.1 数组的定义和特点3.1.2 数组的存储结构3.1.3 数组的优缺点…...

11前端项目总结----详情页放大镜和轮播图

商品详情页 DOM元素尺寸和位置相关属性1. 尺寸相关属性2.位置相关属性3.鼠标事件相关位置属性 放大镜排他Swiper和组件通信 DOM元素尺寸和位置相关属性 1. 尺寸相关属性 ①offsetWidth/offsetHeight&#xff1a;内容宽度/高度paddingborder&#xff08;滚动条&#xff09; ②c…...

Linux课程五课---Linux进程认识1

作者前言 &#x1f382; ✨✨✨✨✨✨&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f382; ​&#x1f382; 作者介绍&#xff1a; &#x1f382;&#x1f382; &#x1f382; &#x1f389;&#x1f389;&#x1f389…...

Nacos简介—4.Nacos架构和原理一

大纲 1.Nacos的定位和优势 2.Nacos的整体架构 3.Nacos的配置模型 4.Nacos内核设计之一致性协议 5.Nacos内核设计之自研Distro协议 6.Nacos内核设计之通信通道 7.Nacos内核设计之寻址机制 8.服务注册发现模块的注册中心的设计原理 9.服务注册发现模块的注册中心的服务数…...

splitchunk(如何将指定文件从主包拆分为单独的js文件)

1. 说明 webpack打包会默认将入口文件引入依赖js打包为一个入口文件&#xff0c;导致这个文件会比较大&#xff0c;页面首次加载时造成加载时间较长 可通过splitchunk配置相应的规则&#xff0c;对匹配的规则打包为单独的js,减小入口js的体积 2. 示例 通过正则匹配&#xff…...