43.[前端开发-JavaScript高级]Day08-ES6-模板字符串-展开运算符-ES7~ES11
ES6~ES13新特性(二)
1 模板字符串的详解
字符串模板基本使用
标签模板字符串使用
<!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>
</head>
<body><script>const name = "why"const age = 18// 1.基本用法// 1.1.ES6之前// const info = "my name is" + name + ", age is " + age// 1.2.ES6之后const info = `my name is ${name}, age is ${age}`console.log(info)// 2.标签模板字符串的用法function foo(...args) {console.log("参数:", args)}// foo("why", 18, 1.88)foo`my name is ${name}, age is ${age}, height is ${1.88}`</script></body>
</html>
React的styled-components库
2 ES6函数的增强用法
函数的默认参数
<!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>
</head>
<body><script>// 注意: 默认参数是不会对null进行处理的function foo(arg1 = "我是默认值", arg2 = "我也是默认值") {// 1.两种写法不严谨// 默认值写法一:// arg1 = arg1 ? arg1: "我是默认值"// 默认值写法二:// arg1 = arg1 || "我是默认值"// 2.严谨的写法// 三元运算符// arg1 = (arg1 === undefined || arg1 === null) ? "我是默认值": arg1// ES6之后新增语法: ??// arg1 = arg1 ?? "我是默认值"// 3.简便的写法: 默认参数console.log(arg1)}foo(123, 321)foo()foo(0)foo("")foo(false)foo(null)foo(undefined)</script></body>
</html>
<!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>
</head>
<body><script>// 1.注意一: 有默认参数的形参尽量写到后面// 2.有默认参数的形参, 是不会计算在length之内(并且后面所有的参数都不会计算在length之内)// 3.剩余参数也是放到后面(默认参数放到剩余参数的前面)function foo(age, name = "why", ...args) {console.log(name, age, args)}foo(18, "abc", "cba", "nba")console.log(foo.length)</script></body>
</html>
函数默认值的补充
<!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>
</head>
<body><script>// 1.解构的回顾// const obj = { name: "why" }// const { name = "kobe", age = 18 } = obj// 2.函数的默认值是一个对象// function foo(obj = { name: "why", age: 18 }) {// console.log(obj.name, obj.age)// }function foo({ name, age } = { name: "why", age: 18 }) {console.log(name, age)}function foo({ name = "why", age = 18 } = {}) {console.log(name, age)}foo()</script></body>
</html>
函数的剩余参数
函数箭头函数的补充
<!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>
</head>
<body><script>// 1.function定义的函数是有两个原型的:// function foo() {}// console.log(foo.prototype) // new foo() -> f.__proto__ = foo.prototype// console.log(foo.__proto__) // -> Function.prototype// 2.箭头函数是没有显式原型// 在ES6之后, 定义一个类要使用class定义var bar = () => {}// console.log(bar.__proto__ === Function.prototype)// 没有显式原型// console.log(bar.prototype)// var b = new bar()</script></body>
</html>
3 展开运算符的使用
展开语法
<!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>
</head>
<body><script>// 1.基本演练// ES6const names = ["abc", "cba", "nba", "mba"]const str = "Hello"// const newNames = [...names, "aaa", "bbb"]// console.log(newNames)function foo(name1, name2, ...args) {console.log(name1, name2, args)}foo(...names)foo(...str)// ES9(ES2018)const obj = {name: "why",age: 18}// 不可以这样来使用// foo(...obj) // 在函数的调用时, 用展开运算符, 将对应的展开数据, 进行迭代// 可迭代对象: 数组/string/argumentsconst info = {...obj,height: 1.88,address: "广州市"}console.log(info)</script></body>
</html>
浅拷贝
<!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>
</head>
<body><script>const obj = {name: "why",age: 18,height: 1.88,friend: {name: "curry"}}// 1.引用赋值// const info1 = obj// 2.浅拷贝// const info2 = {// ...obj// }// info2.name = "kobe"// console.log(obj.name)// console.log(info2.name)// info2.friend.name = "james"// console.log(obj.friend.name)// 3.深拷贝// 方式一: 第三方库// 方式二: 自己实现// function deepCopy(obj) {}// 方式三: 利用先有的js机制, 实现深拷贝JSONconst info3 = JSON.parse(JSON.stringify(obj))console.log(info3.friend.name)info3.friend.name = "james"console.log("info3.friend.name:", info3.friend.name)console.log(obj.friend.name)</script></body>
</html>
引用赋值
浅拷贝
深拷贝
数值的表示
4 Symbol类型用法
Symbol的基本使用
<!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>
</head>
<body><script>// ES6之前存在的问题// const obj = {// name: "why",// fn: "aaa"// }// // 添加一个新的属性 name// function foo(obj) {// obj.why = function() {}// }// foo(obj)// console.log(obj.fn)// ES6之后可以使用Symbol生成一个独一无二的值const s1 = Symbol()// const info = { name: "why" }const obj = {[s1]: "aaa" }console.log(obj)const s2 = Symbol()obj[s2] = "bbb"console.log(obj)function foo(obj) {const sKey = Symbol()obj[sKey] = function() {}delete obj[sKey]}foo(obj)</script></body>
</html>
Symbol作为属性名
相同值的Symbol
<!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>
</head>
<body><script>const s1 = Symbol() // aaaconst s2 = Symbol() // bbb// 1.加入对象中const obj = {name: "why",age: 18,[s1]: "aaa",[s2]: "bbb"}// const obj1 = {}// obj1[s1] = "aaa"// obj2[s2] = "bbb"// const obj2 = {}// Object.defineProperty(obj, s1, {// value: "aaa"// })// 2.获取symbol对应的keyconsole.log(Object.keys(obj))console.log(Object.getOwnPropertySymbols(obj))const symbolKeys = Object.getOwnPropertySymbols(obj)for (const key of symbolKeys) {console.log(obj[key])}// 3.description// 3.1.Symbol函数直接生成的值, 都是独一无二const s3 = Symbol("ccc")console.log(s3.description)const s4 = Symbol(s3.description)console.log(s3 === s4)// 3.2. 如果相同的key, 通过Symbol.for可以生成相同的Symbol值const s5 = Symbol.for("ddd")const s6 = Symbol.for("ddd")console.log(s5 === s6)// 获取传入的keyconsole.log(Symbol.keyFor(s5))</script></body>
</html>
5 数据结构-Set集合
Set的基本使用
Set的常见方法
<!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>
</head>
<body><script>// 1.创建Setconst set = new Set()console.log(set)// 2.添加元素set.add(10)set.add(22)set.add(35)set.add(22)console.log(set)const info = {}const obj = {name: "obj"}set.add(info)set.add(obj)set.add(obj)console.log(set)// 3.应用场景: 数组的去重const names = ["abc", "cba", "nba", "cba", "nba"]// const newNames = []// for (const item of names) {// if (!newNames.includes(item)) {// newNames.push(item)// }// }// console.log(newNames)const newNamesSet = new Set(names)const newNames = Array.from(newNamesSet)console.log(newNames)// 4.Set的其他属性和方法// 属性console.log(set.size)// 方法// 4.1. add方法set.add(100)console.log(set)// 4.2. delete方法set.delete(obj)console.log(set)// 4.3. has方法console.log(set.has(info))// 4.4. clear方法// set.clear()// console.log(set)// 4.5. forEachset.forEach(item => console.log(item))// 5.set支持for...offor (const item of set) {console.log(item)}</script></body>
</html>
WeakSet使用
WeakSet的应用
<!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>
</head>
<body><script>// 1.Weak Reference(弱引用)和Strong Reference(强引用)let obj1 = { name: "why" }let obj2 = { name: "kobe" }let obj3 = { name: "jame" }// let arr = [obj1, obj2, obj3]// obj1 = null// obj2 = null// obj3 = null// const set = new Set(arr)// arr = null// 2.WeakSet的用法// 2.1.和Set的区别一: 只能存放对象类型const weakSet = new WeakSet()weakSet.add(obj1)weakSet.add(obj2)weakSet.add(obj3)// 2.2.和Set的区别二: 对对象的引用都是弱引用// 3.WeakSet的应用const pWeakSet = new WeakSet()class Person {constructor() {pWeakSet.add(this)}running() {if (!pWeakSet.has(this)) {console.log("Type error: 调用的方式不对")return}console.log("running~")}}let p = new Person()// p = nullp.running()const runFn = p.runningrunFn()const obj = { run: runFn }obj.run()</script></body>
</html>
6 数据结构-Map映射
Map的基本使用
Map的常用方法
<!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>
</head>
<body><script>const info = { name: "why" }const info2 = { age: 18 }// 1.对象类型的局限性: 不可以使用复杂类型作为key// const obj = {// address: "北京市",// [info]: "哈哈哈",// [info2]: "呵呵呵"// }// console.log(obj)// 2.Map映射类型const map = new Map()map.set(info, "aaaa")map.set(info2, "bbbb")console.log(map)// 3.Map的常见属性和方法// console.log(map.size)// 3.1. set方法, 设置内容map.set(info, "cccc")console.log(map)// 3.2. get方法, 获取内容// console.log(map.get(info))// 3.3. delete方法, 删除内容// map.delete(info)// console.log(map)// 3.4. has方法, 判断内容// console.log(map.has(info2))// 3.5. clear方法, 清空内容// map.clear()// console.log(map)// 3.6. forEach方法// map.forEach(item => console.log(item))// 4.for...of遍历for (const item of map) {const [key, value] = itemconsole.log(key, value)}</script></body>
</html>
WeakMap的使用
<!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>
</head>
<body><script>let obj1 = { name: "why" }let obj2 = { name: "kobe" }// 1.WeakMap的基本使用const weakMap = new WeakMap()// weakMap.set(123, "aaa")weakMap.set(obj1, "aaa")weakMap.set(obj2, "bbb")obj1 = nullobj2 = null</script></body>
</html>
WeakMap的应用
ES6其他知识点说明
ES7~ES13新特性(三)
1 ES7新增特性解析
ES7 - Array Includes(已学)
ES7 –指数exponentiation运算符(已学)

2 ES8新增特性解析
ES8 Object values
ES8 Object entries
<!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>
</head>
<body><script>const obj = {name: "why",age: 18,height: 1.88,address: "广州市"}// 1.获取所有的keyconst keys = Object.keys(obj)console.log(keys)// 2.ES8 Object.valuesconst values = Object.values(obj)console.log(values)// 3.ES8 Object.entries// 3.1. 对对象操作const entries = Object.entries(obj)console.log(entries)for (const entry of entries) {const [key, value] = entryconsole.log(key, value)}// 3.2. 对数组/字符串操作(了解)console.log(Object.entries(["abc", "cba"]))console.log(Object.entries("Hello"))</script></body>
</html>
ES8 - String Padding
<!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>
</head>
<body><h1 class="card"></h1><script>// padStart和padEnd// 1.应用场景一: 对时间进行格式化// const minute = "15".padStart(2, "0")// const second = "6".padStart(2, "0")// console.log(`${minute}:${second}`)// 2.应用场景二: 对一些敏感数据格式化let cardNumber = "132666200001018899"const sliceNumber = cardNumber.slice(-4)cardNumber = sliceNumber.padStart(cardNumber.length, "*")const cardEl = document.querySelector(".card")cardEl.textContent = cardNumber</script></body>
</html>
ES8 - Trailing Commas
ES8 - Object Descriptors
ES9新增知识点
3 ES10新增特性解析
ES10 - flat flatMap
<!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>
</head>
<body><script>// 1.flat的使用: // 将一个数组, 按照制定的深度遍历, 将遍历到的元素和子数组中的元素组成一个新的数组, 进行返回// const nums = [10, 20, [111, 222], [333, 444], [[123, 321], [231, 312]]]// const newNums1 = nums.flat(1)// console.log(newNums1)// const newNums2 = nums.flat(2)// console.log(newNums2)// 2.flatMap的使用:// 1> 对数组中每一个元素应用一次传入的map对应的函数const messages = ["Hello World aaaaa","Hello Coderwhy","你好啊 李银河"]// 1.for循环的方式:// const newInfos = []// for (const item of messages) {// const infos = item.split(" ")// for (const info of infos) {// newInfos.push(info)// }// }// console.log(newInfos)// 2.先进行map, 再进行flat操作// const newMessages = messages.map(item => item.split(" "))// const finalMessages = newMessages.flat(1)// console.log(finalMessages)// 3.flatMapconst finalMessages = messages.flatMap(item => item.split(" "))console.log(finalMessages)</script></body>
</html>
ES10 - Object fromEntries
<!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>
</head>
<body><script>// 1.对象// const obj = {// name: "why",// age: 18,// height: 1.88// }// const entries = Object.entries(obj)// const info = Object.fromEntries(entries)// console.log(info)// 2.应用const searchString = "?name=why&age=18&height=1.88"const params = new URLSearchParams(searchString)console.log(params.get("name"))console.log(params.get("age"))console.log(params.entries())// for (const item of params.entries()) {// console.log(item)// }const paramObj = Object.fromEntries(params)console.log(paramObj)</script></body>
</html>
ES10 - trimStart trimEnd
<!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>
</head>
<body><script>const message = " Hello World "console.log(message.trim())console.log(message.trimStart())console.log(message.trimEnd())</script></body>
</html>
ES10 其他知识点
4 ES11新增特性解析
ES11 - BigInt
<!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>
</head>
<body><script>console.log(Number.MAX_SAFE_INTEGER)const num1 = 9007199254740992nconst num2 = 9007199254740993nconsole.log(num1, num2)</script></body>
</html>
ES11 - Nullish Coalescing Operator
<!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>
</head>
<body><script>let info = undefined// info = info || "默认值"// console.log(info)// ??: 空值合并运算符info = info ?? "默认值"console.log(info)</script></body>
</html>
ES11 - Optional Chaining
<!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>
</head>
<body><script>const obj = {name: "why",friend: {name: "kobe",// running: function() {// console.log("running~")// }}}// 1.直接调用: 非常危险// obj.friend.running()// 2.if判断: 麻烦/不够简洁// if (obj.friend && obj.friend.running) {// obj.friend.running()// }// 3.可选链的用法: ?.obj?.friend?.running?.()</script></body>
</html>
ES11 - Global This(已学)
ES11 - for..in标准化
ES11 其他知识点
5 ES12新增特性解析
ES12 - FinalizationRegistry
<!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>
</head>
<body><script>let obj = { name: "why", age: 18 }let info = { name: "kobe", age: 30 }const finalRegistry = new FinalizationRegistry((value) => {console.log("某一个对象被回收了:", value)})finalRegistry.register(obj, "why")finalRegistry.register(info, "kobe")// obj = nullinfo = null</script></body>
</html>
ES12 - WeakRefs
<!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>
</head>
<body><script>let info = { name: "why", age: 18 }let obj = new WeakRef(info)let obj2 = new WeakRef(info)const finalRegistry = new FinalizationRegistry(() => {console.log("对象被回收~")})finalRegistry.register(info, "info")setTimeout(() => {info = null}, 2000)setTimeout(() => {console.log(obj.deref().name, obj.deref().age)}, 8000)</script></body>
</html>
ES12 - logical assignment operators
<!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>
</head>
<body><script>// 赋值运算符// const foo = "foo"let counter = 100counter = counter + 100counter += 50// 逻辑赋值运算符function foo(message) {// 1.||逻辑赋值运算符// message = message || "默认值"// message ||= "默认值"// 2.??逻辑赋值运算符// message = message ?? "默认值"message ??= "默认值"console.log(message)}foo("abc")foo()// 3.&&逻辑赋值运算符let obj = {name: "why",running: function() {console.log("running~")}}// 3.1.&&一般的应用场景// obj && obj.running && obj.running()// obj = obj && obj.nameobj &&= obj.nameconsole.log(obj)</script></body>
</html>
ES12其他知识点
<!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>
</head>
<body><script>const message = "my name is why, why age is 18"const newMessage = message.replace("why", "kobe")const newMessage2 = message.replaceAll("why", "kobe")console.log(newMessage)console.log(newMessage2)</script></body>
</html>
6 ES13新增特性解析
ES13 - method .at()
ES13 - Object.hasOwn(obj, propKey)
<!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>
</head>
<body><script>// const obj = {// name: "why",// age: 18,// // 1.和hasOwnProperty的区别一: 防止对象中也有一个自己的hasOwnProperty方法// hasOwnProperty: function() {// return "abc"// },// __proto__: {// address: "广州市"// }// }// console.log(obj.name, obj.age)// console.log(obj.address)// console.log(obj.hasOwnProperty("name"))// console.log(obj.hasOwnProperty("address"))// console.log(Object.hasOwn(obj, "name"))// console.log(Object.hasOwn(obj, "address"))// 2.和hasOwnProperty的区别二:const info = Object.create(null)info.name = "why"// console.log(info.hasOwnProperty("name"))console.log(Object.hasOwn(info, "name"))</script></body>
</html>
ES13 - New members of classes
<!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>
</head>
<body><script>class Person {// 1.实例属性// 对象属性: public 公共 -> public instance fieldsheight = 1.88// 对象属性: private 私有: 程序员之间的约定// _intro = "name is why"// ES13对象属性: private 私有: 程序员之间的约定#intro = "name is why"// 2.类属性(static)// 类属性: publicstatic totalCount = "70亿"// 类属性: privatestatic #maleTotalCount = "20亿"constructor(name, age) {// 对象中的属性: 在constructor通过this设置this.name = namethis.age = agethis.address = "广州市"}// 3.静态代码块static {console.log("Hello World")console.log("Hello Person")}}const p = new Person("why", 18)console.log(p)// console.log(p.name, p.age, p.height, p.address, p.#intro)// console.log(Person.#maleTotalCount)</script></body>
</html>
相关文章:
43.[前端开发-JavaScript高级]Day08-ES6-模板字符串-展开运算符-ES7~ES11
ES6~ES13新特性(二) 1 模板字符串的详解 字符串模板基本使用 标签模板字符串使用 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content…...
边生成边训练:构建合成数据驱动的在线训练系统设计实战
目录 边生成边训练:构建合成数据驱动的在线训练系统设计实战 一、系统目标与能力总览 ✅ 核心目标: 二、系统架构图(推荐用于PPT展示) 三、关键模块设计解析 ✅ 1. 合成数据生成器模块 ✅ 2. 质量评分器模块 ✅ 3. 在线训…...
AF3 create_alignment_db_sharded脚本main函数解读
AlphaFold3 create_alignment_db_sharded 脚本在源代码的scripts/alignment_db_scripts文件夹下。 该脚本中的 main 函数是整个对齐数据库生成脚本的核心入口,它 orchestrates(编排)了所有流程,从读取链目录到生成 .db 文件、构建索引、处理重复链、写入最终索引文件。 ma…...
52. Java 类和对象 - 什么是隐藏字段?
文章目录 52. Java 类和对象 - 什么是隐藏字段?🎯 参数名称的作用与规则✅ 参数名称的命名规则 🎯 什么是隐藏字段?🚨 问题定义✅ 解决办法:使用 this 关键字 🎯 如何避免隐藏字段带来的困扰&am…...
IntelliJ IDEA右键快捷方式设置方法
IntelliJ IDEA右键快捷方式设置方法 在 IntelliJ IDEA 中设置右键快捷方式快速打开项目或文件(Windows 系统),可以通过以下方法实现: 方法 1:通过注册表添加右键菜单(推荐) 打开注册表编辑器 按…...
深入剖析JavaScript内存泄漏:识别、定位与实战解决
在JavaScript的世界里,开发者通常不必像使用C那样手动管理内存的分配和释放,这得益于JavaScript引擎内置的垃圾回收(Garbage Collection, GC)机制。然而,这并不意味着我们可以完全忽视内存管理。“自动"不等于&qu…...
JVM原理与实战
一、Java虚拟机概述 java程序通过虚拟机实现了java代码的跨平台。 二、java虚拟机运行过程: 类编译器编译java代码为class文件, 类加载器将class文件加载到jvm, 程序计数器控制程序的执行, 虚拟机栈存放局部变量,方法名…...
MCP协议用到的Node.js 和 npm npx
一、Node.js 与 npm、npx 的介绍 Node.js:是一个基于 Chrome V8 引擎的 JavaScript 运行时环境,使您能够在服务器端运行 JavaScript 代码。它广泛用于构建服务器端应用程序和工具。 npm(Node Package Manager):是 Nod…...
如何写 commit message?
前言 每次写 commit message 时,都会纠结用什么动词,格式应该什么样,所以决定总结一下。 查了一下,还是挺复杂的。因为只面向我个人日常使用,所以只进行一些简单的、适合我的总结。 正文 message 分为两部分&#…...
【厦门大学】DeepSeek大模型赋能高校教学和科研
DeepSeek赋能高校教学和科研 引言人工智能发展简史:从图灵测试到大模型时代大模型核心技术解析:构筑智能金字塔DeepSeek赋能高校:打造智能校园生态本地部署方案:安全、高效与定制化兼得教学革新:重塑知识传授与学习体验…...
【专刷】滑动窗口(一)
📝前言说明: 本专栏主要记录本人的基础算法学习以及LeetCode刷题记录,按专题划分每题主要记录:(1)本人解法 本人屎山代码;(2)优质解法 优质代码;ÿ…...
cJSON_Print 和 cJSON_PrintUnformatted的区别
cJSON_Print 和 cJSON_PrintUnformatted 是 cJSON 库中用于将 cJSON 对象转换为 JSON 字符串的两个函数,它们的区别主要在于输出的格式: 1. cJSON_Print 功能:将 cJSON 对象转换为格式化的 JSON 字符串。 特点: 输出的 JSON 字符…...
C 语 言 --- 指 针 4(习 题)
C 语 言 --- 指 针 4(习 题) sizeofstrlen整 型 数 组 - - - int a[ ]字 符 数 组 - - - char arr[ ]字 符 数 组 - - - char arr1[ ]字 符 串 常 量 指 针 - - - char arr[ ]二 维 数 组 - - - char arr[3][4]总结 💻作 者 简 介:…...
可发1区的超级创新思路(python 、MATLAB实现):基于区域注意力双通道MABMA的时间序列预测模型
首先声明,该模型为原创!原创!原创!且该思路还未有成果发表,感兴趣的小伙伴可以借鉴! 应用领域:功率预测、故障诊断、流量预测等领域! 目录 首先声明,该模型为原创!原创!原创!且该思路还未有成果发表,感兴趣的小伙伴可以借鉴! 应用领域:功率预测、故障诊断、流…...
可发1区的超级创新思路(python 、MATLAB实现):基于多尺度注意力TCN-KAN与小波变换的时间序列预测模型
一、数学模型与原理 1.1 小波变换多尺度分解 输入功率序列 x(t) 经小波变换分解为近似系数 Aj 与细节系数 Dj: 1.2 多尺度TCN特征提取 对每个尺度子序列 {A3,D3,D2,D1} 采用独立TCN: 式中 ∗d 为扩张率 d=2l 的扩张卷积,Wd 为可学习参数。 1.3 多尺度注…...
PyTorch `flatten()` 和 `squeeze()` 区别
PyTorch flatten() 和 squeeze() 区别 在 PyTorch 里,flatten() 和 squeeze(0) 是两个不同的张量操作, 1. flatten() 方法 flatten() 方法用于把一个多维张量展开成一维张量。它会将张量里的所有元素按顺序排列成一个一维序列。 语法 torch.flatten(input, start_dim=...
使用Java基于Geotools的SLD文件编程式创建与磁盘生成实战
前言 在地理信息系统(GIS)领域,地图的可视化呈现至关重要,而样式定义语言(SLD)文件为地图元素的样式配置提供了强大的支持。SLD 能够精确地定义地图图层中各类要素(如点、线、面、文本等&#x…...
opencv练习
1.创建一个 PyQt 应用程序,该应用程序能够: (1)使用 OpenCV 加载一张图像。 (2)在 PyQt 的窗口中显示这张图像。 (3)提供四个按钮(QPushButton)࿱…...
opencv--基础
opencv OpenCV是一个实现数字图像处理和计算机视觉通用算法的开源跨平台库。 链接 opencv中的cv是什么意思 在OpenCV中,"cv" 是 "Computer Vision"(计算机视觉) 的缩写。 opencv的实现语言 opencv的底层实现代码是使…...
基于模板匹配的信用卡号码识别系统
本项目实现了一个基于模板匹配的信用卡号码识别系统。 1. 导入库和设置参数 # -*- coding: utf-8 -*- # 导入工具包 from imutils import contours import numpy as np import argparse import cv2 import myutils import os# 设置参数 ap argparse.ArgumentParser() # 替换…...
Spring Boot中Excel处理完全指南
文章目录 1. Excel处理基础知识1.1 为什么需要在应用中处理Excel文件?1.2 Java中的Excel处理库介绍1.2.1 Apache POI1.2.2 EasyExcel1.2.3 JExcel1.2.4 Apache POI SXSSF1.3 Spring Boot中集成Excel处理2. 在Spring Boot中集成Excel处理库2.1 集成Apache POI2.1.1 添加依赖2.1…...
洛谷P1312 [NOIP 2011 提高组] Mayan 游戏
题目 #算法/进阶搜索 思路: 根据题意,我们可以知道,这题只能枚举,剪枝,因此,我们考虑如何枚举,剪枝. 首先,我们要定义下降函数down(),使得小木块右移时,能够下降到最低处,其次,我们还需要写出判断函数,判断矩阵内是否有小木块没被消除.另外,我们还需要消除函数,将矩阵内三个相连…...
c++ (异常)
1.异常的概念及使用 1.1异常的概念 异常处理机制允许程序中独立开发的部分能够在运行时就出现的问题进行通信并做出相应的处理, 异常使得我们能够将问题的检测与解决问题的过程分开,程序的一部分负责检测问题的出现,然后 解决问题的任务传…...
MySQL如何实现行行比较
概述 在MySQL中实现行行比较通常涉及比较同一表或不同表中不同行的数据。以下是几种常见的方法及示例: 1. 自连接(Self-Join) 通过将表与自身连接,比较不同行的数据。 场景示例:比较同一用户相邻订单的金额差异。 …...
springboot2.X创建maven多模块工程
因为需要,所以付出。 好长时间没有搭建新的框架了,最近在搭建微服务的多模块maven工程,现在就将创建的过程记录下来,方便自学的小伙伴找寻资料,少走弯路。好了下面直接开干。 开发工具 :idea 、springboo…...
八股文---Redis(1)
目录 1.Redis-使用场景 1.我看你做的项目中,都用到了redis,你在最近的项目中哪些场景使用了redis呢? 2.缓存三兄弟可以我看我另一个文章(穿透,雪崩,击穿) 3.redis做为缓存,mysql…...
QT聊天项目DAY06
1.从git上同步项目 编译测试,编译通过 Post请求测试 测试成功 2. email is 打印有问题,检查 解析结果是存储在jsonResult中的,修改 3. 客户端实现Post验证码请求 3.1 同步Qt客户端项目 检查QT版本,由于我在公司用的还是QT5.12.9…...
python(八)-数据类型转换
#数据类型转换 #转换为整型int #字符串str--》整数int #纯数字的字符串可以转换,否则会报错 s 2025 n int(s) print(type(s),type(n)) print(n)#浮点数float--》整数int s1 2.23 print(int(s1))#bool-->整数int s2,s3 True,False print(int(s2),int(s3))#转…...
JavaScript 变量命名规范
在编写JavaScript代码时,遵循良好的变量命名规范对于提高代码的可读性、可维护性和协作效率至关重要。一个清晰且一致的命名习惯不仅有助于开发者自己理解代码,也能让其他团队成员更容易上手和维护项目。本文将详细介绍JavaScript中常见的变量命名规则和…...
2025年渗透测试面试题总结-拷打题库05(题目+回答)
网络安全领域各种资源,学习文档,以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具,欢迎关注。 目录 2025年渗透测试面试题总结-拷打题库05 1. 病毒和蠕虫的区别 2. DNS欺骗(DNS Spoofing&…...
【排队论】Probabilistic Forecasts of Bike-Sharing Systems for Journey Planning
Probabilistic Forecasts of Bike-Sharing Systems forJourney Planning abstract 我们研究了对共享单车系统(BSS)车站未来自行车可用性进行预测的问题。这是相关的,以便提出建议,保证用户能够进行旅行的概率足够高。为此&#x…...
Redis 的持久化机制(RDB, AOF)对微服务的数据一致性和恢复性有何影响?如何选择?
Redis 的持久化机制(RDB 和 AOF)对于保证 Redis 服务重启或崩溃后数据的恢复至关重要,这直接影响到依赖 Redis 的微服务的数据一致性和恢复能力。 1. RDB (Redis Database Backup) 机制: 在指定的时间间隔内,将 Redis 在内存中的…...
手撕LLM(四):从源码出发,探索大模型的预训练(pretrain)过程
前面我们基于Minimind项目介绍了大模型的推理、LoRa加载、Moe结构, 大家对大模型的整体结构应该有一个比较清晰的认识;从该篇博客开始,我们通过代码剖析大模型的训练过程,今天的主题是大模型的预训练。 那大模型的预训练是一个什么…...
Linux系统:进程终止的概念与相关接口函数(_exit,exit,atexit)
本节目标 理解进程终止的概念理解退出状态码的概念以及使用方法掌握_exit与exit函数的用法以及区别atexit函数注册终止时执行的函数相关宏 一、进程终止 进程终止(Process Termination)是指操作系统结束一个进程的执行,回收其占用的资源&a…...
keil5 µVision 升级为V5.40.0.0:增加了对STM32CubeMX作为全局生成器的支持,主要有哪些好处?
在Keil5 μVision V5.40.0.0版本中,增加了对STM32CubeMX作为全局生成器的支持,这一更新主要带来了以下三方面的提升: 开发流程整合STM32CubeMX原本就支持生成Keil项目代码,但新版本将这一集成升级为“全局生成器”级别,意味着STM32CubeMX生成的代码能直接成为Keil项目的核…...
C 语言联合与枚举:自定义类型的核心解析
上篇博客中,我们通过学习了解了C语言中一种自定义类型结构体的相关知识,那么该语言中是否还拥有相似的自定义类型呢?这将是我们今天学习的目标。 1.联合体 联合体其实跟结构体类似,也是由一个或多个成员构成,这些成员…...
P1113 杂务-拓扑排序
拓扑排序 P1113 杂务 题目来源-洛谷 题意 求出完成所有任务的最短时间 思路 要求完成所有任务的最短时间,即每个任务尽可能最短,所以再求完成所有任务中的最大值(需要最长时间的任务都完成了才叫全部完成) 问题化解…...
Flink介绍——实时计算核心论文之Kafka论文总结
引入 大数据系统中的数据来源 在开始深入探讨Kafka之前,我们得先搞清楚一个问题:大数据系统中的数据究竟是从哪里来的呢?其实,这些数据大部分都是由各种应用系统或者业务系统产生的“日志”。 比如,互联网公司的广告…...
模拟投资大师思维:AI对冲基金开源项目详解
这里写目录标题 引言项目概述核心功能详解多样化的AI投资智能体灵活的运行模式透明的决策过程 安装和使用教程环境要求安装步骤基本使用方法运行对冲基金模式运行回测模式 应用场景和实际价值教育和研究价值潜在的商业应用与现有解决方案的对比局限性与发展方向 结论 引言 随着…...
DAY4:数据库对象与高级查询深度解析:从视图到多表关联实战
一、数据库对象精要指南 1.1 视图(View)的进阶应用 视图是存储在数据库中的虚拟表,本质是预编译的SQL查询语句。通过视图可以简化复杂查询、实现数据安全隔离、保持业务逻辑一致性。 创建语法示例: CREATE VIEW sales_summary…...
【Matlab】中国东海阴影立体感地图
【Matlab】中国东海阴影立体感地图 【Matlab】中国东海阴影立体感地图 【Matlab】中国东海阴影图立体感画法 以前分享过一次,链接如下: 中国海域地形图 但是以前还是有些小问题,这次修改了。 另外,增加了新的画法: 另…...
python文件类操作:json/ini配置文件、logging日志统计、excel表格数据读写、os操作库
文章目录 一、with open文件操作二、csv表格数据读写三、Excel表格数据读写四、json配置文件读写五、ini配置文件读写六、logging日志统计七、os操作库(文件拼接、创建、判断等) 打开文件使用不同参数有着不同的含义,比如只读、只写、二进制读…...
VSCode安装与环境配置(Mac环境)
20250419 - 概述 大概是非常久之前了,装了VSCode,估计都得21的时候了,电脑上也没更新过。当时安装也直接装上就完事了。这次把版本更新一下,同时记录一下这个安装过程。 安装 mac下安装非常简单,直接从官网下载&am…...
【信息系统项目管理师】高分论文:论信息系统项目的采购管理(“营业工单系统”项目)
更多内容请见: 备考信息系统项目管理师-专栏介绍和目录 文章目录 论文1、规划采购管理2、实施采购3、控制采购论文 2018年1月,我参加了 XX运营商集团公司某省分公司的“营业工单系统”的信息化建设项目,我有幸担任项目经理。该项目投资1000万元人民币,建设工期为12个月。该…...
XCVU13P-2FHGA2104I Xilinx Virtex UltraScale+ FPGA
XCVU13P-2FHGA2104I 是 Xilinx(现为 AMD)Virtex UltraScale™ FPGA 系列中的高端 Premium 器件,基于 16nm FinFET 工艺并采用 3D IC 堆叠硅互连(SSI)技术,提供业内顶级的计算密度和带宽。该芯片集成约 3,…...
@Validated与@Valid的正确使用姿势
验证代码 Validated RestController public class A {PostMappingpublic void test(Min(value 1) Integer count) {} // 校验规则生效 }RestController public class A {PostMappingpublic void test(Validated Min(value 1) Integer count) {} // 校验规则不生效 }RestCont…...
Ubuntu20.04下Docker方案实现多平台SDK编译
0 前言 熟悉嵌入式平台Linux SDK编译流程的小伙伴都知道,假如平台a要求必须在Ubuntu18.04下编译,平台b要求要Ubuntu22.04的环境,那我只有Ubuntu20.04,或者说我的电脑硬件配置最高只能支持Ubuntu20.04怎么办?强行在Ubuntu20.04下编译,编又编不过,换到旧版本我又不愿意,…...
树莓派超全系列教程文档--(34)树莓派配置GPIO
配置GPIO GPIO控制gpio 文章来源: http://raspberry.dns8844.cn/documentation 原文网址 GPIO控制 gpio 通过 gpio 指令,可以在启动时将 GPIO 引脚设置为特定模式和值,而以前需要自定义 dt-blob.bin 文件。每一行都对一组引脚应用相同的设…...
C语言 数组(下)
目录 1.二维数组的创建 2.二位数组的初始化 3.二维数组的使用 4.二维数组在内存中的储存 1.二维数组的创建 1.1二维数组的概念 前面学习的数组被称为一维数组,数组的元素都是内置类型的,如果我们把一维数组做为数组的元 素,这时候就是…...
opencv图像旋转(单点旋转的原理)
首先我们以最简单的一个点的旋转为例子,且以最简单的情况举例,令旋转中心为坐标系中心O(0,0),假设有一点P_{0}(x_{0},y_{0}),P_{0}离旋转中心O的距离为r,OP_{0}与坐标轴x轴的夹角为\…...