babel起手式

Babel7

以下是各个 ECMAScript 版本引入的一些主要新语法和功能的汇总

ES5 / ECMAScript 5（2009年）

  1. 严格模式 "use strict"。
  2. JSON 对象。
  3. Array.prototype.forEach()、Array.prototype.map()、Array.prototype.filter()、Array.prototype.reduce() 等数组方法。
  4. Object.keys()、Object.create() 等对象方法。

ES6 / ECMAScript 2015（也称为 ES2015 或 ECMAScript 6，2015年）

  1. let 和 const 变量声明。
  2. 箭头函数。
  3. 模板字符串。
  4. 解构赋值。
  5. 默认参数和剩余参数。
  6. 类和继承。
  7. 模块化 import 和 export。
  8. Promise。
  9. 增强的对象字面量。

ES7 / ECMAScript 2016（2016年）

  1. Array.prototype.includes() 方法。
  2. 指数操作符 **。

ES8 / ECMAScript 2017（2017年）

  1. 异步函数 async 和 await。
  2. Object.values() 和 Object.entries()。
  3. 字符串填充方法 String.prototype.padStart() 和 String.prototype.padEnd()。

ES9 / ECMAScript 2018（2018年）

  1. 对象扩展运算符。
  2. 异步迭代器。
  3. 正则表达式命名捕获组。

ES10 / ECMAScript 2019（2019年）

  1. Array.prototype.flat() 和 Array.prototype.flatMap()。
  2. String.prototype.trimStart() 和 String.prototype.trimEnd()。

ES11 / ECMAScript 2020（2020年）

  1. 可选链操作符 ?.。
  2. 空值合并操作符 ??。

ES12 / ECMAScript 2021（2021年）

  1. 数字分隔符。
  2. Promise.allSettled()。
  3. String.prototype.replaceAll()。

以上列举了每个版本中的一些主要语法和功能。每个版本都还包含了其他一些小的改进和新增功能。要详细了解每个版本中的所有变化，可以查阅官方的 ECMAScript 规范或其他权威资源。

解析 const和箭头函数是es6的语法


npx babel src/index.js -d dist/ --plugins=@babel/plugin-transform-block-scoping,@babel/plugin-transform-arrow-functions

本文根据babel@7 进行测试的

前言

Babel 是一个 JavaScript 编译器，主要用于将 ECMAScript 2015+版本的代码转换为向后兼容的 JavaScript 代码，以便能够在旧版本的浏览器或其他环境中运行。但是，Babel 本身是无法转换代码的，它的转换功能是通过不同的插件来实现的，Babel 插件是用于指定转换规则的工具，每个插件都可以处理不同的语法或功能转换。

作用

将某些低版本容器（主要是浏览器，主要是IE…）不支持的js语法或api，用该容器支持的语法或api重写，使开发者可以使用更前沿的方式愉快的编写代码。

但实际上更准确点说，是一堆插件在做代码的转换，babel本身是个容器，负责代码解析、转换抽象语法树，然后通过各种插件做代码转换，最后根据转换后的抽象语法树生成最终的代码。这个过程以后再细说，这里想说的就是插件对于babel的作用，而我们使用者可能比较关心的，也就是在做代码转换时，会用到哪些插件。

babel-cli官方最新版本为7.24.3

Babel 本身就是一个可以独立使用的工具，但是目前开发中很少直接使用 Babel，都是和 Webpack ,Rolllup,vite等构建工具来配合使用。

编译器的作用就是可以将一种代码转换为另一种代码。
Babel 不仅可以转换 ES6+ 的语法，也可以转换 React、TypeScript。

Babel 和 PostCSS 都是微内核架构，工具本身只编写自身核心的代码，具体的功能通过不同的插件来实现。

ES6+ 的语法通过 Babel 就可以转换，为什么还需要 Polyfill?

一些 ES6+ 的语法特性，例如箭头函数、模板字符串、常量声明等，只涉及到语法层面的改变，因此可以在不引入新的 JavaScript 对象或方法的情况下通过简单的语法转换为旧版本的 JavaScript。
但是，有些 ES6+ 特性涉及到新的 JavaScript 对象、方法或内置功能，例如 Map、Set、Symbol、Promise、async/await 等，这些特性不能通过简单的语法转换来实现，因此需要使用 Polyfill。

原理：

Babel 的工作原理整体上可以分为三个阶段：解析阶段 Parsing、转换阶段 Transformation、生成阶段 Code Generation。
1

具体来说，可以分为以下步骤：

  1. 词法分析：读取源代码文件，对文件中的每个单词做分析。其实就是读取源代码文件中的每个单词。

    2

  2. 生成 tokens 数组：将词法分析出来的单词生成 tokens 数组。其实就是对词法分析读取出来的单词进行分类。

    3

  3. 语法分析：语法分析 tokens 数组中的每一项代表什么含义。其实就是分析 tokens 数组的每一项其真正的语法表示的是什么。

  4. 生成 AST 抽象语法树：根据语法分析出来的每一项的真正含义生成 AST 抽象语法树。

    4

  5. 对 AST 抽象语法树进行遍历。

  6. 访问 AST 抽象语法树中的每个结点。

  7. 在访问结点的过程中对结点应用对应的插件，进行结点的修改。

  8. 遍历完之后就生成新的 AST 抽象语法树。

  9. 最后根据新的抽象语法树生成转化后的新的代码。

5

配置文件：

通常，需要指定 Babel 的编译规则来编译代码。Babel 的配置文件默认会在当前目录寻找文件，有：.babelrc、.babelrc.js、babel.config.json、babel.config.js、package.json，它们的配置项都是一样的，作用也一样，只需要选择一种即可。

// JSON
{"presets": [...],"plugins": [...]
}
// JavaScript
const presets = [ ... ];
const plugins = [ ... ];
module.exports = { presets, plugins };
// package.json
{"name": "my-package","version": "1.0.0","babel": {"presets": [ ... ],"plugins": [ ... ],}
}

7

babel7主要就是两个包，@babel/cli和@babel/core，cli用于执行命令行，core则是babel用于解析、转换、代码生成的核心包。在项目下执行以下命令即可完成安装。
有了这两个包以后，就可以对指定文件执行babel命令了

@babel/core

@babel/core：Babel 的核心代码。必须安装。

```bash 
npm install --save-dev @babel/core
```

基本用法：可以在 JS 程序中直接引入并使用。

const babel = require("@babel/core");
babel.transformSync(code, optionsObject);

@babel/cli

@babel/cli ：是 babel 提供的内建命令行工具。如果需要在命令行中直接使用 Babel，就需要安装 @babel/cli ，否则不需要安装。

安装命令:

 npm install --save-dev @babel/cli

基本用法：

src目录文件index.js代码如下：

const fn = () => {Array.isArray([1, 2, 3]);
};

现在在项目根目录下执行

npx babel src/index.js -d dist/
即可在dist目录下生成同名文件index.js，而里面代码与src/index.js中的代码完全一样，生成的dist/index.js内容如下：

const fn = () => {Array.isArray([1, 2, 3]);
};

之所以代码完全一样，其实就是上面所说的，babel在没有使用任何插件时，就是把代码变成抽象语法树，再把抽象语法树原封不动的变成代码，中间没有做任何处理，当然代码也就原样还原回来了。下面，让我们来给babel加点儿料~

Plugins

const和箭头函数是es6的语法，相应的，@babel/plugin-transform-block-scoping插件用于转换const和let，@babel/plugin-transform-arrow-functions插件用于转换箭头函数。安装完这两个插件之后，分别执行：

@babel/plugin

@babel/plugin*:代码转换功能以插件的形式出现，插件是小型的 JS 程序，用于指导 Babel 如何对代码进行转换。

安装命令:

npm install --save-dev @babel/plugin-transform-arrow-functions // 将箭头函数转换为 ES5 兼容的函数表达式的插件

基本用法：

npx babel src/index.js -o dist/index.js  --plugins=@babel/plugin-transform-arrow-functions // 多个插件之间用逗号隔开

扫完一眼plugins列表，估计和我一样一脸懵逼，这么多插件谁能记得住用得到哪些啊，babel能帮忙整理下打个包给我用么？当然可以，presets就是用来干这事儿的。

Presets

一个特定的preset可以简单理解为是一组特定的plugins的集合。不同的presets包含着不同的plugins，当然适用的场景也就各不相同了。比如@babel/preset-react包含了写react需要用到的@babel/plugin-syntax-jsx，@babel/plugin-transform-react-jsx，@babel/plugin-transform-react-display-name等插件；@babel/preset-es2017包含了@babel/plugin-transform-async-to-generator插件。

而最为常用，也是被官网推荐的，是@babel/preset-env。默认情况下，所有已被纳入规范的语法（ES2015, ES2016, ES2017, ES2018, Modules）所需要使用的plugins都包含在env这个preset中。

还是以上面例子来说
先安装@babel/preset-env

@babel/preset

@babel/preset-env：是 Babel 提前预设好的一系列 Babel 中的插件的组合。如果要使用的 Babel 插件很多，一个一个安装配置是很麻烦的，就可以使用 Babel 中的预设。

plugins 插件数组的执行顺序是从左到右执行的，presets 预设数组的执行顺序是从右到左执行的。
插件 plugins 在预设 presets 之前执行。
安装命令:

npm install --save-dev @babel/preset-env // 在代码中使用了多种 ES6+ 的语法，一个一个地使用插件很麻烦，就可以使用一个名称为 env 的 preset

基本用法：

npx babel src/index.js -o dist/index.js --presets=@babel/env

@babel/preset-env的参数项：

  1. target：用来设定目标浏览器。默认值为空对象。
presets: [
[
'@babel/preset-env',
{
targets: {
ie: "11"
}
}
]
]
  1. useBuiltIns：用来设置预设以什么样的方式来使用 Polyfill。默认值为 false。
    属性值有：
  • false：不使用 Polyfill。
  • usage：无需手动引入 Polyfill。代码中需要哪些 Polyfill，Babel 会自动按需加载需要的 Polyfill。
  • entry：需要在入口文件中手动引入 Polyfill。只要是目标浏览器需要的 polyfill，且包含在入口文件引入的 core-js 和 regeerator-runtime包中，不管代码中是否需要都全部引入。

使用 entry 属性值时，还需要在打包的入口文件处引入 core-js 和 regenerator-runtime。css // 不是直接引入 core-js。而是引入 core-js/stable，表示引入 core-js 中成为标准的那些部分；也可以引入 core-js 中某些具体的功能。 import 'core-js/stable' import 'regenerator-runtime/runtime'

  1. corejs：设置 corejs 的版本。默认值为 2。

corejs 的属性值需要与安装的 core-js 的版本能对应上，否则会报错。corejs 取值为 2 的时候，需要安装并引入 core-js@2 版本；如果 corejs 取值为3，必须安装并引入 core-js@3 版本。

  1. modules：用来设置是否把 ES6 的模块化语法改成其它模块化语法。默认值为 auto，可以取值amd、umd、systemjs、commonjs、cjs、auto、false。

  2. debug：如果需要在命令行打印加载项，可以设置 debug。

主体部分与同时使用两个plugins是完全一样的。实际上，presets可以理解为就是把其包含的plugins依次执行一遍。
当然env这个presets不是万能的，其只包含了规范中的语法转换，尚未被纳入规范的处于各个阶段的提案，比如目前处于stage-2（draft）阶段的装饰器语法，光是用presets是不会帮我们转好的，还得单独再使用@babel/plugin-proposal-decorators这个专门用于转换装饰器代码的插件。

值得一提的是，babel7明确指出用stage-x命名的presets已被弃用。具体原因见

关于stage-x各代表什么含义？

在 Babel 中，stage-x 表示 ECMAScript 提案的不同阶段，其中 x 代表阶段的编号，从 0 到 4。这些阶段表示了 ECMAScript 规范中新功能的开发进度，以及这些功能被社区接受和推动的程度。具体解释如下：

  1. Stage 0 - Strawman（稻草人阶段）：

    • 提案处于初始阶段，只是一个想法或者概念，尚未形成正式的提案。

  2. Stage 1 - Proposal（提案阶段）：

    • 提案已经提交到 TC39（ECMAScript 标准的技术委员会）进行讨论，并且已经得到了初步的认可，但尚未成为官方的 ECMAScript 提案。

  3. Stage 2 - Draft（草案阶段）：

    • 提案已经在 TC39 中被正式接受，成为了 ECMAScript 的草案，并且开始详细讨论和规划实现细节。

  4. Stage 3 - Candidate（候选人阶段）：

    • 提案已经成为了 ECMAScript 的候选人，表示它已经被确定为规范的一部分，并且可以进入到浏览器和 JavaScript 引擎中进行实现和测试。

  5. Stage 4 - Finished（完成阶段）：

    • 提案已经经过了所有必要的评审和测试，并且已经被确定为规范的一部分，可以作为下一个 ECMAScript 版本的一部分发布。

因此，stage-x presets 表示一组转换规则，用于处理处于不同阶段的 ECMAScript 提案功能。这些 presets 包含了针对各个阶段提案的转换规则，可以帮助开发者在项目中使用尚未正式纳入规范的 JavaScript 新特性。然而，由于语义上的不清晰以及规范的变化，Babel 在版本 7 中废弃了以 stage-x 命名的 presets，并推荐开发者直接使用具体的插件来处理特定的 ECMAScript 提案功能。

https://babeljs.io/blog/2018/07/27/removing-babels-stage-presets

如果希望和之前一样使用处于各阶段的提案功能，建议直接通过引入相应的plugins：

{plugins: [// Stage 0"@babel/plugin-proposal-function-bind",// Stage 1"@babel/plugin-proposal-export-default-from","@babel/plugin-proposal-logical-assignment-operators",["@babel/plugin-proposal-optional-chaining", { loose: false }],["@babel/plugin-proposal-pipeline-operator", { proposal: "minimal" }],["@babel/plugin-proposal-nullish-coalescing-operator", { loose: false }],"@babel/plugin-proposal-do-expressions",// Stage 2["@babel/plugin-proposal-decorators", { legacy: true }],"@babel/plugin-proposal-function-sent","@babel/plugin-proposal-export-namespace-from","@babel/plugin-proposal-numeric-separator","@babel/plugin-proposal-throw-expressions",// Stage 3"@babel/plugin-syntax-dynamic-import","@babel/plugin-syntax-import-meta",["@babel/plugin-proposal-class-properties", { loose: false }],"@babel/plugin-proposal-json-strings",],
}

这些插件会将对应阶段的语法特性转换为向后兼容的代码，以确保它们可以在当前浏览器环境中正常运行。通过配置这些插件，你可以在项目中使用最新的 ECMAScript 语法特性，而不必担心浏览器的兼容性问题

@babel/ployfill

Polyfill可以理解为是补丁，其实就是实现某些功能或特性的 JavaScript 脚本。有一些语法特性浏览器是不认识的，使用的话必然报错（例如：Promise、Generator、Symbol 等，以及一些实例方法 Array.prototype.includes 等），此时就可以使用 Polyfill 来打一个补丁，将相关功能的代码包含进项目中。
Polyfill 并不是 Babel 特有的功能，只不过此处使用的是 Babel 中的 Polyfill。

@babel/polyfill：由 core-js 和 regenerator-runtime 组成。

  • 前者是 JS 标准库，包含不同版本 JavaScript 语法的实现；
  • 后者是 facebook 开源库，用来实现对 Promise、Generator、async/await 函数等的支持。

Babel 7.4.0 之前，是使用 @babel/polyfill 包，但是该包现在已经不建议使用了，因为 @babel/polyfill 把两个 npm 包全部都引入到了打包后的文件里了，导致打包后的体积过大；而且@babel-polyfill 可能会污染全局变量，给很多类的原型链上都作了修改，这就有不可控的因素存在。

Babel7.4.0 之后，建议单独使用core-js和 regenerator-runtime 。

安装命令:

npm install --save core-js regenerator-runtime

基本用法：

import "core-js/stable";
import "regenerator-runtime/runtime";

如果您正在将生成器或异步函数编译为 ES5，并且您使用的 @babel/core 或 @babel/plugin-transform-regenerator 版本早于 7.18.0 ，则还必须加载 regenerator runtime 包。

如果确切地知道所需要的功能，可以只引入使用的方法。

import 'core-js/features/array/from'; 
import 'core-js/features/set';      
import 'core-js/features/promise';

@babel/runtime

@babel/runtime：可以用于提取公共函数，但是提取出来之后，代码里不会自动引用这些公共函数。
@babel/plugin-transform-runtime可以自动引用公共函数。

例如：使用 class 类的时候，Babel 会在前面添加一个帮助函数。

// 源代码
class Test {}// 编译后的代码
"use strict";function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }var Test = function Test() {_classCallCheck(this, Test);
};

在编译后的代码里，帮助函数被直接迁入到代码中了。如果有多个脚本文件，每个都用到了 class，那么每个编译后的文件都包含一个一模一样的帮助函数，造成了冗余。可以使用@babel/runtime 和 @babel/plugin-transform-runtime来解决：

  1. 安装依赖：npm i --S @babel/runtime @babel/plugin-transform-runtime。

  2. 在 Babel 配置文件中进入如下配置：

plugins: ['@babel/plugin-transform-runtime'
]
  1. 再次编译，可以看到不再是直接把帮助函数迁入代码中，而是使用 require 加载公共帮助函数。
"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var Test = function Test() {(0, _classCallCheck2.default)(this, Test);
};

鄙人觉得 7.18.0以后就不用这些运行时包 regenerator-runtime @babel/runtime

@babel/register

@babel/register 提供了动态编译，换句话说，源代码能够真正运行在生产环境下，不需要 babel 编译这一环节了。但是动态编译会导致程序在速度、性能上有所损耗。

安装：

npm install --save-dev @babel/register

然后在入口文件引入：


require('@babel/register')
require('./app')

在入口文件头部引入 @babel/register 后，在 app 文件中即可使用任意 ES2015 的特性。

@babel/node

@babel-register 提供动态编译，能够让源代码真正运行在生产环境下，但仍需要做部分调整，比如新增一个入口文件，并在该文件中 require(‘@babel/register’)；而 @babel-node 能真正做到一行源代码都不需要调整：


npm install --save-dev @babel/core @babel/nodenpx babel-node app.js

使用 Babel

  1. 新建一个文件夹 test-babel。

  2. 在终端进入这个文件夹下，执行 npm install --save-dev @babel/core @babel/cli 安装 Babel。

  3. 在 test-babel 文件夹下新建 src/index.js，并编写一些 ES6+ 的新语法。

  4. 在终端执行 npx babel src/index.js -o dist/index.js，会自动生成 dist/index.js。但此时，dist/index.js 的代码和 src/index.js 的代码并没有太大区别，因为现在所安装的 Babel 只是一个有命令行的空壳而已，还需要为 Babel 添加一些插件来让 babel 工作。

  5. 在终端执行 npm install --save-dev @babel/preset-env 来安装 @babel/preset-env 插件。

  6. 在根目录下新建 babel.config.js 的配置文件进行配置，告知 Babel 来使用插件。


module.exports = {presets: [['@babel/preset-env']]
};
  1. 在终端再次执行 npx babel src/index.js -o dist/index.js，会发现 dist/index.js 已经转换为 ES5 的语法了。
  1. 文件 a.js .babelrc

a.js

import 'core-js/stable'
import 'regenerator-runtime/runtime'
class A{}

.babelrc

{"presets": [["@babel/preset-env",{"targets": {"ie": "11"},"useBuiltIns":"entry",// "corejs":3 }]
]}

“corejs”:3 如果配置这个 ，那么这些能让新的语法实现的 导入就会打包到文件中 说白啦就是 core-js/stable的内部文件会一起打包到文件里，增加代码量，不建议设置，全量引用
在这里插入图片描述

  1. a.js .babelrc

a.js

class A{}

.babelrc

{"presets": [["@babel/preset-env",{"targets": {"ie": "11"},"useBuiltIns":"usage",//"corejs":3}]
],"plugins": [// "@babel/plugin-transform-arrow-functions",["@babel/plugin-transform-runtime",{"corejs": "3"}]]}

自动导入 和 按需
在这里插入图片描述

在这里插入图片描述

项目开发

useBuiltIns使用usage，尽量使用社区广泛使用的优质库以优化打包体积，不使用暂未进入规范的特性。plugin-transform-runtime只使用其移除内联复用的辅助函数的特性，减小打包体积。

{"presets": [["@babel/preset-env",{// targets 官方推荐使用 .browserslistrc 配置"useBuiltIns": "usage","corejs": {"version": 3,"proposals": false}}]],"plugins": [["@babel/plugin-transform-runtime",{"corejs": false // 默认值，即使如此依然需要 yarn add @babel/runtime}]]
}

并在入口文件处 import 如下内容

import ‘core-js/stable’;
import ‘regenerator-runtime/runtime’;
// 入口文件代码

类库开发

类库开发尽量不使用污染全局环境的polyfill，因此@babel/preset-env只发挥语法转换的功能，polyfill由plugin-transform-runtime来处理，推荐使用core-js@3，并且不使用未进入规范的特性。

{"presets": [["@babel/preset-env",]],"plugins": [["@babel/plugin-transform-runtime",{"corejs": {"version": 3,"proposals": true},"useESModules": true}]]
}

参考文章

Babel7-1
babel7-2

babel7-3拿到项目就是copy一下

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/769788.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

这回轮到鸿蒙禁用安卓了！！！

这回轮到鸿蒙禁用安卓了！！！

1月18日，鸿蒙生态千帆仪式上，华为正式宣布了HarmonyOS NEXT（下简称鸿蒙星河版或纯血鸿蒙）开发者预览已向开发者开放申请，纯血鸿蒙开始走向普及阶段。伴随着不再兼容安卓的纯血鸿蒙铺开，鸿蒙走进了运营属于自…
阅读更多...
计算机408炸了！大多数人都栽在这门课上

计算机408炸了！大多数人都栽在这门课上

组成原理>>数据结构>操作系统>计算机网络 在本科时，我在学习组成原理之前已经学过数字电路和模拟电路，但在接下来学习组成原理时，我依然感到困难。也许是因为自己理解能力不足，总觉得难以掌握，甚至在考研…
阅读更多...
算法打卡day28|贪心算法篇02|Leetcode 122.买卖股票的最佳时机 II、55. 跳跃游戏、45.跳跃游戏 II

算法打卡day28|贪心算法篇02|Leetcode 122.买卖股票的最佳时机 II、55. 跳跃游戏、45.跳跃游戏 II

算法题 Leetcode 122.买卖股票的最佳时机 II 题目链接:122.买卖股票的最佳时机 II 大佬视频讲解：买卖股票的最佳时机 II视频讲解 个人思路 因为只有一只股票，且两天作一个交易单元，那每次只收集正利润就可以最终最多可以获取的利润&#xf…
阅读更多...
Unity 学习日记 8.2D物理引擎

Unity 学习日记 8.2D物理引擎

1.2D刚体的属性和方法 2.碰撞器
阅读更多...
产品推荐 | 基于 Zynq UltraScale+ XCZU27DR的 FACE-RFSoC-C高性能自适应射频开发平台

产品推荐 | 基于 Zynq UltraScale+ XCZU27DR的 FACE-RFSoC-C高性能自适应射频开发平台

一、产品概述 FACE-RFSOC-C自适应射频开发平台，是FACE系列新一代的产品。 平台搭载有16nm工艺的Zynq UltraScale™ RFSoC系列主器件。该器件集成数千兆采样RF数据转换器和ARM Cortex-A53处理子系统和UltraScale可编程逻辑，是一款单芯片自适应射频平台。…
阅读更多...
Docker在虚拟机中的基本配置

Docker在虚拟机中的基本配置

1、Docker解决依赖兼容问题，Docker是如何实现的呢？ Docker为了解决依赖的兼容问题的，采用了两个手段： - 将应用的Libs（函数库）、Deps（依赖）、配置与应用一起打包 - 将每个应用放到…
阅读更多...
玩具蛇（蓝桥杯）

玩具蛇（蓝桥杯）

文章目录 玩具蛇题目描述答案：552dfs 玩具蛇 题目描述 本题为填空题，只需要算出结果后，在代码中使用输出语句将所填结果输出即可。 小蓝有一条玩具蛇，一共有 16 节，上面标着数字 1 至 16。每一节都是一个正方形的形…
阅读更多...
seata测试demo(订单)

seata测试demo(订单)

seata工作流程: seata对分布式事务的协调和控制就是31 1>XID：XID是全局事务的唯一标识，它可以在服务的调用链路中传递，绑定到服务的事务上下文中。 3>TC->TM->RM TC:事务协调器>就是seata 负责维护全局事务和分支事务的状…
阅读更多...
STP生成树——解决二层组网环路

STP生成树——解决二层组网环路

目录 一.二层组网环路 1.广播风暴 2.MAC地址漂移 3.有没有三层环路 二.STP生成树 （1）工作原理 （2）STP概念 1.桥ID（BID) 2.根桥 3.COST 4.RPC 5. Rort ID ——本端 6.BPDU报文 7.PID（Port ID&…
阅读更多...
IDC：2027年中国网络安全市场规模将超200亿美元

IDC：2027年中国网络安全市场规模将超200亿美元

IDC于近日发布了2024年V1版IDC《全球网络安全支出指南》(IDC Worldwide Security Spending Guide)。IDC数据显示，2022年全球网络安全IT总投资规模为1890.1亿美元，并有望在2027年增至3288.8亿美元，五年复合增长率（CAGR）…
阅读更多...
若依ruoyi-vue实现excel导入导出

若依ruoyi-vue实现excel导入导出

文章目录 Excel注解excel数据导入前端实现后端实现 下载模板前端实现后端实现 excel数据导出前端实现后端实现 自定义标题信息导出用户管理表格新增标题（用户列表）导入表格包含标题处理方式 自定义数据处理器自定义隐藏属性列导入对象的子对象导出对象的…
阅读更多...
FakeLocation报虚拟位置服务连接失败，请重启设备再试

FakeLocation报虚拟位置服务连接失败，请重启设备再试

虚拟位置服务连接失败，请重启设备再试 最近遇到一个手机软件报的bug“虚拟位置服务连接失败，请重启设备再试” 因为我的实体“虚拟机”已经root，按道理是不可能报这个错的 折腾了2天，终于解决了 原来是这样，安装最新…
阅读更多...
龙智亮相2024国际集成电路展览会暨研讨会（IIC Shanghai），分享芯片研发及管理解决方案与技术实践

龙智亮相2024国际集成电路展览会暨研讨会（IIC Shanghai），分享芯片研发及管理解决方案与技术实践

2024年3月28-29日（周四-周五），上海张江科学会堂，2024国际集成电路展览会暨研讨会（IIC Shanghai 2024）即将盛大开幕。龙智携芯片研发及管理解决方案、最佳实践与案例，以及惊喜大奖在#1A14展位等着…
阅读更多...
【C语言】数组和指针

【C语言】数组和指针

目录 一、&数组名VS数组名 二、数组指针 三、指针数组 四、函数指针 五、const和指针 1、常量指针 六、sizeof和指针、数组 七、strlen和字符数组 八、指针和数组笔试题 1、一维数组 2、字符数组 3、二维数组 一、&数组名VS数组名 //试试这段代码 #includ…
阅读更多...
15：00面试，15：06就出来了，问的问题有点变态了

15：00面试，15：06就出来了，问的问题有点变态了

从小厂出来，没想到在另一家公司又寄了。 到这家公司开始上班，加班是每天必不可少的，看在钱给的比较多的份上，就不太计较了。没想到3月一纸通知，所有人不准加班，加班费不仅没有了，薪资还要降30%…
阅读更多...
PTA L2-032 彩虹瓶

PTA L2-032 彩虹瓶

彩虹瓶的制作过程（并不）是这样的：先把一大批空瓶铺放在装填场地上，然后按照一定的顺序将每种颜色的小球均匀撒到这批瓶子里。 假设彩虹瓶里要按顺序装 N 种颜色的小球（不妨将顺序就编号为 1 到 N）。现在工…
阅读更多...
基于cnn卷积神经网络的yolov8动物姿态估计识别（训练代码）

基于cnn卷积神经网络的yolov8动物姿态估计识别（训练代码）

往期热门项目大合集： 人体姿态识别（教程代码）-CSDN博客 3D人体姿态估计（教程代码）-CSDN博客 3D目标检测（教程代码）_3d目标检测原理-CSDN博客 交通路标识别(教程&代码)_路标识别项目概述…
阅读更多...
【c++】类和对象（二）this指针

【c++】类和对象（二）this指针

🔥个人主页：Quitecoder 🔥专栏：c笔记仓 朋友们大家好，本节内容来到类和对象第二篇，本篇文章会带领大家了解this指针 目录 1.this指针1.1this指针的引出1.2this指针的特性1.3思考题1.4C语言和C实现Stack的对…
阅读更多...
QB 系统配置模板

QB 系统配置模板

查询的时候，直接 在下面添加 一个字段就行！ public function getDeatil(){$post $this->request->post();if(!isset($post[id])){return out(请传递活动的id);}$builder new Builder($this->getModel());$builder->setFilter([id > …
阅读更多...
轨迹预测后处理之非极大值抑制(NMS)

轨迹预测后处理之非极大值抑制(NMS)

非极大值抑制是图像处理里面的一种算法（比如边缘检测会使用到） 轨迹预测这里借鉴了其思想，比如说对于某个场景中的某辆车，我们使用模型预测 64 条轨迹或者更多，以很好地捕获多模态性，同时每条轨迹对应一个…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023