2025年前端面试热门题目——HTML|CSS|Javascript|TS知识

以下是对这些 HTML 面试问题的详细解答:


1. HTML 的 srchref 属性有什么区别?

  • src (Source) 属性:

    • 用于嵌入资源,例如图像、脚本或 iframe。
    • 加载资源时,当前页面的加载会暂停,直到资源加载完成。
    • 常用于 <img><script><iframe> 标签。
    • 例子:
      <img src="image.jpg" alt="图片">
      <script src="script.js"></script>
      
  • href (Hypertext Reference) 属性:

    • 用于建立超链接,指向外部资源或内部的网页。
    • 不会暂停页面加载,用户可以点击链接跳转。
    • 常用于 <a><link><area> 标签。
    • 例子:
      <a href="https://example.com">访问示例网站</a>
      <link href="styles.css" rel="stylesheet">
      

2. 什么是 HTML 语义化?

HTML 语义化是指通过使用具有明确含义的标签,使 HTML 结构具有更好的可读性和意义。

  • 优点:

    1. 提高可读性:开发者和浏览器可以更轻松理解文档结构。
    2. 增强 SEO:语义化标签帮助搜索引擎更好地索引页面内容。
    3. 增强可访问性:辅助工具(如屏幕阅读器)可以更好地解释页面内容。
  • 常见语义化标签:

    • headerfooterarticlesection:定义页面结构。
    • nav:定义导航。
    • aside:定义侧边内容。
    • figurefigcaption:定义图像及其说明。

3. DOCTYPE(文档类型)的作用是什么?

  • 定义: DOCTYPE 声明用于告诉浏览器当前 HTML 文档的标准。
  • 作用:
    1. 让浏览器以标准模式(Standard Mode)渲染页面。
    2. 避免浏览器进入怪异模式(Quirks Mode),导致布局和样式出现问题。
  • HTML5 DOCTYPE 示例:
    <!DOCTYPE html>
    

4. HTML 的 script 标签中 deferasync 有什么区别?

  • defer

    • 脚本异步加载,并在 HTML 解析完成后按顺序执行。
    • 适合依赖 HTML 结构的脚本。
    • 示例:
      <script src="script.js" defer></script>
      
  • async

    • 脚本异步加载,加载完成后立即执行(可能在 HTML 未解析完成时执行)。
    • 适合独立的脚本(如广告或分析工具)。
    • 示例:
      <script src="script.js" async></script>
      
  • 区别总结:

    • defer 保证脚本按顺序执行,适用于多个依赖的脚本。
    • async 脚本独立,加载和执行更快。

5. 常用的 HTML meta 标签有哪些?

<meta> 标签用于定义页面的元信息,常用的有:

  • 字符编码:
    <meta charset="UTF-8">
    
  • 视口设置(适配移动端):
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
  • 描述:
    <meta name="description" content="页面的描述内容">
    
  • 关键字:
    <meta name="keywords" content="HTML, CSS, JavaScript">
    
  • 作者信息:
    <meta name="author" content="作者名字">
    
  • 防止搜索引擎索引:
    <meta name="robots" content="noindex, nofollow">
    

6. HTML5 相比于 HTML有哪些更新?

  1. 新增语义化标签:

    • 如:<header><footer><article><section><nav>
  2. 新增表单功能:

    • 增加了新的输入类型:emailurldatenumber 等。
    • 表单属性:requiredplaceholderpattern
  3. 支持多媒体:

    • 新增 <audio><video> 标签。
  4. 新增 API:

    • 地理位置:Geolocation API
    • 本地存储:localStoragesessionStorage
    • 拖放:Drag and Drop API
    • 画布:<canvas> 标签。
  5. 废弃元素:

    • 移除了 <center><font> 等。

7. HTML 中,img 标签 srcset 属性的作用是什么?

  • 作用: 提供一组图像 URL 和其对应的显示条件,允许浏览器根据设备像素密度或屏幕宽度选择最合适的图像。
  • 示例:
    <img src="default.jpg" srcset="small.jpg 480w, medium.jpg 1024w" sizes="(max-width: 600px) 480px, 1024px" alt="图片">
    
    • 浏览器会根据视口大小和分辨率选择合适的图像。
    • 480w 表示图像宽度为 480 像素。

8. HTML 行内元素有哪些?块级元素有哪些?空 (void) 元素有哪些?

  • 行内元素:

    • 不占据独立一行,内容按行排列。
    • 常见:<a><span><img><strong><em><label>
  • 块级元素:

    • 独占一行,通常是容器。
    • 常见:<div><p><h1>~<h6><section><article><ul><li>
  • 空元素:

    • 没有闭合标签,只有单个标签。
    • 常见:<img><input><br><hr><meta>

9. HTML 中,titleh1 标签的区别是什么?

  • title 标签:

    • 定义网页的标题,显示在浏览器标签栏。
    • 对 SEO 友好,用于搜索引擎结果的标题。
    • 示例:
      <title>我的网页标题</title>
      
  • h1 标签:

    • 表示页面的主要标题。
    • 用于内容层次结构,通常一个页面只有一个 h1
    • 示例:
      <h1>欢迎来到我的网站</h1>
      

10. Canvas 和 SVG 有什么区别?

  • Canvas:

    • 基于像素的绘图。
    • 提供动态绘制能力,但不易修改内容。
    • 使用 JavaScript 绘制,适合实时动画和复杂图像处理。
    • 示例:
      <canvas id="myCanvas" width="200" height="100"></canvas>
      <script>const canvas = document.getElementById('myCanvas');const ctx = canvas.getContext('2d');ctx.fillStyle = 'red';ctx.fillRect(0, 0, 150, 75);
      </script>
      
  • SVG:

    • 基于 XML 的矢量图形。
    • 内容可以通过 DOM 轻松修改和操作。
    • 适合静态图形或需要高分辨率的图形。
    • 示例:
      <svg width="100" height="100"><circle cx="50" cy="50" r="40" fill="blue" />
      </svg>
      
  • 区别总结:

    • Canvas 注重像素,适合动画;SVG 注重结构,适合静态矢量图形。

如果需要进一步展开或补充某些问题,可以继续探讨!
以下是对这些 CSS 和 JavaScript 面试问题的详细解答:


1. 有哪些 CSS 选择器? 请分别介绍

CSS 选择器用于选择 HTML 元素以应用样式。常见选择器有:

  • 通配符选择器 (*)

    • 选择所有元素。
    • 示例:
      * {margin: 0;padding: 0;
      }
      
  • 类型选择器

    • 选择特定标签的元素。
    • 示例:
      p {color: blue;
      }
      
  • 类选择器 (.)

    • 选择特定类的元素。
    • 示例:
      .classname {font-size: 14px;
      }
      
  • ID 选择器 (#)

    • 选择特定 ID 的元素。
    • 示例:
      #idname {background-color: yellow;
      }
      
  • 属性选择器

    • 根据属性值选择元素。
    • 示例:
      input[type="text"] {border: 1px solid gray;
      }
      
  • 后代选择器 (A B)

    • 选择 B 元素,前提是它是 A 元素的后代。
    • 示例:
      div p {color: green;
      }
      
  • 子选择器 (A > B)

    • 选择 A 元素的直接子元素 B。
    • 示例:
      ul > li {list-style: none;
      }
      
  • 相邻兄弟选择器 (A + B)

    • 选择紧接在 A 后面的 B 元素。
    • 示例:
      h1 + p {font-size: 12px;
      }
      
  • 通用兄弟选择器 (A ~ B)

    • 选择与 A 同级的所有 B 元素。
    • 示例:
      h1 ~ p {color: gray;
      }
      
  • 伪类选择器

    • 选择元素的特定状态。
    • 示例:
      a:hover {text-decoration: underline;
      }
      
  • 伪元素选择器

    • 选择元素的特定部分。
    • 示例:
      p::first-line {font-weight: bold;
      }
      

2. 如何计算 CSS 的优先级?

CSS 优先级是用数字计算的,规则如下:

  1. 行内样式:1000
  2. ID 选择器:100
  3. 类选择器、伪类、属性选择器:10
  4. 标签选择器、伪元素:1
  5. 通配符、继承、默认样式:0

计算优先级的示例:

/* 优先级为:10 (类选择器) */
.class {color: red;
}/* 优先级为:100 (ID 选择器) */
#id {color: blue;
}/* 优先级为:101 (ID + 标签选择器) */
#id p {color: green;
}

规则:

  • 优先级高的样式覆盖优先级低的。
  • 同优先级时,后出现的覆盖前面的。

3. CSS 中可继承与不可继承属性有哪些?

  • 可继承属性:

    • 文本相关属性:
      • color
      • font 系列:font-familyfont-sizefont-style 等。
      • visibility
      • letter-spacingword-spacing
    • 默认行为:通过继承从父级传递到子级。
  • 不可继承属性:

    • 盒模型相关属性:
      • margin
      • padding
      • border
      • widthheight
      • box-shadow
    • 布局相关属性:
      • display
      • position
      • z-index
      • overflow
  • 强制继承:

    • 对于不可继承属性,可以通过 inherit 强制继承:
      div {width: inherit;
      }
      

4. CSS 中 display 属性的值及其作用

display 属性决定元素的显示方式。常见值:

  1. block

    • 块级元素,独占一行。
    • 示例:
      div {display: block;
      }
      
  2. inline

    • 行内元素,与其他元素共享一行。
    • 示例:
      span {display: inline;
      }
      
  3. inline-block

    • 具有行内特性,但可以设置宽高。
    • 示例:
      img {display: inline-block;
      }
      
  4. none

    • 隐藏元素,不占据空间。
    • 示例:
      p {display: none;
      }
      
  5. flex

    • 设为弹性布局容器。
    • 示例:
      div {display: flex;
      }
      
  6. grid

    • 设为网格布局容器。
    • 示例:
      div {display: grid;
      }
      

5. 使用 link@import 引用 CSS 的区别

  1. <link> 标签:

    • 在 HTML 文件中引入 CSS 文件。
    • 优点:支持并行加载,适合现代浏览器。
    • 示例:
      <link rel="stylesheet" href="style.css">
      
  2. @import 规则:

    • 在 CSS 文件中导入另一个 CSS 文件。
    • 缺点:浏览器需要解析 CSS 文件后再加载导入的文件,加载速度较慢。
    • 示例:
      @import url("style.css");
      

6. JavaScript 有哪些数据类型? 它们的区别是什么?

  • 基本数据类型 (Primitive Types):

    • stringnumberbigintbooleanundefinedsymbolnull
    • 特点:不可变、存储在栈中。
  • 引用数据类型 (Reference Types):

    • object (包括数组、函数等)。
    • 特点:可变、存储在堆中。

7. 如何判断 JavaScript 变量是数组?

  1. Array.isArray() (推荐):

    Array.isArray([1, 2, 3]); // true
    
  2. instanceof

    [1, 2, 3] instanceof Array; // true
    
  3. Object.prototype.toString

    Object.prototype.toString.call([1, 2, 3]); // "[object Array]"
    

8. JavaScript 中 nullundefined 的区别是什么?

  • null

    • 表示一个空的或无效的对象引用。
    • 需要手动赋值:
      let value = null;
      
  • undefined

    • 表示变量未初始化或不存在。
    • 系统自动赋值:
      let value; // 默认是 undefined
      

9. typeof null 的结果是什么? 为什么?

  • 结果:
    typeof null; // "object"
    
  • 原因:
    这是 JavaScript 的一个历史遗留问题,null 最初被设计为对象的特殊值,因此 typeof null 返回 "object"

10. typeofinstanceof 有什么区别?

  • typeof

    • 检测变量的数据类型。
    • 适合检查基本数据类型。
    • 示例:
      typeof 42; // "number"
      
  • instanceof

    • 检测对象是否是某个构造函数的实例。
    • 示例:
      [] instanceof Array; // true
      

总结:

  • typeof 主要用于基础类型判断。
  • instanceof 用于引用类型判断,尤其是继承关系的判断。
  • 以下是对这些 JavaScript 面试问题的详细解答:

1. 为什么 JavaScript 中 0.1 + 0.2 !== 0.3,如何让其相等?

原因:
  • JavaScript 使用 IEEE 754 双精度浮点数来表示数字,这种表示方式无法精确存储某些小数,例如 0.10.2
  • 计算过程中的精度损失导致:
    0.1 + 0.2; // 0.30000000000000004
    
解决方法:
  1. 使用 toFixed()toPrecision()

    • 将结果四舍五入到指定的小数位数。
    (0.1 + 0.2).toFixed(1); // "0.3"
    
  2. 使用乘除法避免小数计算:

    • 先将数字放大为整数计算,再缩小。
    (0.1 * 10 + 0.2 * 10) / 10 === 0.3; // true
    
  3. 使用 EPSILON 判断:

    • JavaScript 提供 Number.EPSILON 表示最小可区分值。
    Math.abs(0.1 + 0.2 - 0.3) < Number.EPSILON; // true
    

2. 说说你对 fetch 的理解,它有哪些优点和不足?

fetch 是什么?
  • fetch 是现代浏览器提供的原生 API,用于发起 HTTP 请求,返回一个基于 Promise 的结果。
优点:
  1. 语法简单:

    • 使用 Promise,代码更清晰。
    fetch(url).then(response => response.json()).then(data => console.log(data)).catch(error => console.error(error));
    
  2. 原生支持:

    • 内置支持,不需要额外的库。
  3. 可扩展性:

    • 支持各种 HTTP 方法、头部设置、跨域请求等。
  4. 流式响应:

    • 支持 ReadableStream,适合处理大文件。
不足:
  1. 不支持超时控制:

    • 需要手动实现超时逻辑。
    const controller = new AbortController();
    setTimeout(() => controller.abort(), 5000); // 超时 5 秒
    fetch(url, { signal: controller.signal });
    
  2. 错误处理复杂:

    • fetch 仅在网络错误时抛出异常,HTTP 状态码错误(如 404、500)不会自动触发 catch
    fetch(url).then(response => {if (!response.ok) {throw new Error('HTTP error ' + response.status);}return response.json();});
    
  3. 浏览器兼容性:

    • IE 不支持,需要 polyfill。

3. JavaScript 中 Object.keys 的返回值是无序的吗?

是否有序:
  • 根据规范:
    1. 如果对象的属性是数字键(索引),Object.keys 返回的数组按 升序 排列。
    2. 其他非数字键的属性按 插入顺序 返回。
  • 示例:
    const obj = { 1: 'one', 3: 'three', 2: 'two', a: 'A', b: 'B' };
    console.log(Object.keys(obj)); // ["1", "2", "3", "a", "b"]
    

4. JavaScript 的 BigInt 和 Number 类型有什么区别?

区别:
  1. 表示范围:

    • Number:安全整数范围为 -2^53 ~ 2^53(由 Number.MAX_SAFE_INTEGER 定义)。
    • BigInt:支持任意大小的整数。
  2. 操作:

    • BigInt 无法与 Number 混合运算。
    1n + 2; // TypeError
    1n + BigInt(2); // 3n
    
  3. 精度:

    • Number 是浮点类型,可能有精度损失。
    • BigInt 精确表示整数。
  4. 性能:

    • BigInt 操作效率较低。
示例:
console.log(Number.MAX_SAFE_INTEGER); // 9007199254740991
console.log(9007199254740991 + 1); // 9007199254740992 (精度丢失)
console.log(9007199254740991n + 1n); // 9007199254740992n (精确)

5. 什么是 JavaScript 的尾调用? 使用尾调用有什么好处?

尾调用:
  • 尾调用是指一个函数的最后一步调用另一个函数。
  • 尾调用条件:
    1. 调用是函数的最后一步。
    2. 返回调用的结果。
好处:
  • 减少内存占用:
    • 避免多余的调用栈帧,提升性能。
    • 对递归函数尤为重要(即尾递归优化)。
示例:
  • 普通递归(会累积调用栈):

    function factorial(n) {if (n === 1) return 1;return n * factorial(n - 1); // 不是尾调用
    }
    
  • 尾递归(优化调用栈):

    function factorial(n, acc = 1) {if (n === 1) return acc;return factorial(n - 1, acc * n); // 尾调用
    }
    

6. 使用 let 全局声明变量,能通过 window 对象取到吗?

  • 答案:不能。

  • 原因:

    • 使用 letconst 声明的全局变量不会成为 window 对象的属性。
    • 示例:
      let x = 10;
      console.log(window.x); // undefined
      
  • 对比:

    • 使用 var 声明的全局变量会成为 window 对象的属性。
    var y = 20;
    console.log(window.y); // 20
    

7. letconstvar 的区别是什么?

1. var
  • 作用域: 函数作用域。
  • 变量提升: 会提升至作用域顶部,默认值为 undefined
  • 可重复声明: 可以在同一作用域内多次声明。
2. let
  • 作用域: 块作用域。
  • 变量提升: 也会提升,但在提升前无法访问(称为“暂时性死区”)。
  • 不可重复声明: 同一作用域内不允许重复声明。
3. const
  • 作用域: 块作用域。
  • 常量: 声明时必须初始化,值不能重新赋值(对象属性可以修改)。
  • 不可重复声明: 同一作用域内不允许重复声明。

8. 说说你对 JS 作用域的理解?

1. 什么是作用域?

作用域是指代码中变量、函数或对象的可访问范围。

2. 分类:
  1. 全局作用域:

    • 定义在任何函数或块外的变量,具有全局可访问性。
    • 示例:
      var globalVar = "I am global";
      
  2. 函数作用域:

    • 使用 var 声明的变量在函数内部是局部的。
    • 示例:
      function scopeTest() {var localVar = "I am local";console.log(localVar);
      }
      
  3. 块作用域:

    • 使用 letconst 声明的变量只能在声明的块中访问。
    • 示例:
      if (true) {let blockVar = "I am block scoped";console.log(blockVar);
      }
      
3. 闭包与作用域:
  • 闭包是函数能够“记住”并访问其定义时的作用域。
  • 示例:
    function outer() {let outerVar = "I am outer";return function inner() {console.log(outerVar); // 闭包访问};
    }
    const fn = outer();
    fn(); // "I am outer"
    

    1. ES6 箭头函数和普通函数有什么区别?

1.1 语法上的区别:
  • 箭头函数更简洁,不需要 function 关键字:
    // 普通函数
    function sum(a, b) {return a + b;
    }// 箭头函数
    const sum = (a, b) => a + b;
    
1.2 特性上的区别:
  1. this 绑定规则:

    • 箭头函数没有自己的 this,会捕获其定义时的上下文 this
    • 普通函数的 this 根据调用方式动态绑定。
    const obj = {value: 10,arrowFunc: () => this.value, // 捕获定义时的上下文normalFunc() {return this.value; // 根据调用时绑定},
    };console.log(obj.arrowFunc()); // undefined (指向全局或模块的 this)
    console.log(obj.normalFunc()); // 10
    
  2. arguments 对象:

    • 箭头函数没有 arguments 对象,可以通过剩余参数代替。
    • 普通函数有 arguments,可以访问函数的实际参数。
    const arrowFunc = () => console.log(arguments); // Error
    function normalFunc() {console.log(arguments); // 可用
    }
    
  3. 作为方法或事件处理函数:

    • 箭头函数的 this 不会改变,适合绑定事件。
    • 普通函数会动态绑定,可能需要手动处理 this
    const obj = {value: 42,handler: () => console.log(this.value), // 指向全局或模块
    };
    document.body.addEventListener('click', obj.handler);
    
  4. 是否可作为构造函数:

    • 箭头函数不能作为构造函数。
    • 普通函数可以通过 new 操作符生成实例。

2. ES6 箭头函数能当构造函数吗?

答案:不能。
  • 箭头函数没有 [[Construct]] 内部方法,无法用 new 操作符调用。
  • 示例:
    const Arrow = () => {};
    const obj = new Arrow(); // TypeError: Arrow is not a constructor
    

3. ES6 有哪些新特性?

  1. 变量声明:letconst

    • 块作用域,避免变量提升。
    • 示例:
      let a = 10;
      const b = 20;
      
  2. 箭头函数

    • 简洁语法,自动绑定 this
    • 示例:
      const add = (a, b) => a + b;
      
  3. 模板字符串

    • 支持多行和嵌入表达式。
    • 示例:
      const greeting = `Hello, ${name}`;
      
  4. 解构赋值

    • 解构对象和数组。
    • 示例:
      const [a, b] = [1, 2];
      const { x, y } = { x: 3, y: 4 };
      
  5. 展开运算符 ...

    • 用于复制、合并或解构。
    • 示例:
      const arr = [...arr1, ...arr2];
      
  6. 默认参数

    • 函数参数支持默认值。
    • 示例:
      const greet = (name = 'Guest') => `Hello, ${name}`;
      
  7. 类和继承

    • 新增 classextends
    • 示例:
      class Person {constructor(name) {this.name = name;}
      }
      class Student extends Person {constructor(name, grade) {super(name);this.grade = grade;}
      }
      
  8. 模块化

    • 使用 importexport
    • 示例:
      import { foo } from './module.js';
      export const bar = 42;
      
  9. Promise

    • 用于异步编程。
    • 示例:
      const promise = new Promise((resolve, reject) => {resolve('Success');
      });
      
  10. SymbolMap/Set

    • 新的数据类型和数据结构。
    • 示例:
      const sym = Symbol('id');
      const map = new Map();
      

4. TypeScript 有哪些常用类型?

  1. 基本类型:

    • string, number, boolean, null, undefined, any, void, never.
  2. 数组类型:

    • number[]Array<number>
    • 示例:
      const nums: number[] = [1, 2, 3];
      
  3. 元组类型:

    • 固定长度、已知类型的数组。
    • 示例:
      const tuple: [number, string] = [42, 'Hello'];
      
  4. 枚举类型:

    • 定义一组命名常量。
    • 示例:
      enum Direction {Up,Down,Left,Right,
      }
      
  5. 对象类型:

    • 定义对象结构。
    • 示例:
      interface Person {name: string;age: number;
      }
      
  6. 联合类型:

    • 变量可为多种类型之一。
    • 示例:
      let value: string | number;
      
  7. 类型别名:

    • 定义自定义类型。
    • 示例:
      type ID = string | number;
      

5. 什么是 TypeScript 的对象类型? 怎么定义对象类型?

对象类型定义:
  • 在 TypeScript 中,对象类型是描述对象结构的类型。
  • 可以使用 interfacetype 定义对象类型。
定义方式:
  1. 使用接口 (interface):

    interface Person {name: string;age: number;
    }const user: Person = {name: 'Alice',age: 25,
    };
    
  2. 使用类型别名 (type):

    type Person = {name: string;age: number;
    };const user: Person = {name: 'Bob',age: 30,
    };
    
  3. 嵌套对象类型:

    interface Address {city: string;zipCode: number;
    }interface Person {name: string;address: Address;
    }const user: Person = {name: 'Charlie',address: {city: 'New York',zipCode: 10001,},
    };
    
  4. 可选属性和只读属性:

    interface Person {name: string;age?: number; // 可选readonly id: string; // 只读
    }const user: Person = {name: 'Diana',id: '12345',
    };// user.id = '54321'; // Error: Cannot assign to 'id' because it is a read-only property
    

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

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

相关文章

Redis篇--常见问题篇7--缓存一致性2(分布式事务框架Seata)

1、概述 在传统的单体应用中&#xff0c;事务管理相对简单&#xff0c;通常使用数据库的本地事务&#xff08;如MySQL的BEGIN和COMMIT&#xff09;来保证数据的一致性。然而&#xff0c;在微服务架构中&#xff0c;由于每个服务都有自己的数据库&#xff0c;跨服务的事务管理变…

基于winform的五子棋机器人系统开发 (更新中ing)

一、实物硬件表拟定 笔记本电脑、正运动控制器、三个汇川伺服驱动器、三个滑动模组 二、软件开发 注意细节&#xff1a; ①主界面使用三个panel容器进行构建 pannel容器设置属性参数&#xff1a;(1) dock ② 添加自定义控件&#xff1a;首先创建类库&#xff0c;删除默认…

微服务分布式(二、注册中心Consul)

首先我们需要安装consul,到官网下载Consul Install | Consul | HashiCorp Developer 在解压的consul目录下 执行启动命令 consul agent -dev 启动服务 -dev表示开发模式 -server表示服务模式 启动后在浏览器访问8500端口http://localhost:8500/可以看到服务管理界面 项目…

示波器--UNI-T 优利德 UT4102C 使用介绍

示波器--UNI-T 优利德 UT4102C 使用介绍 1 介绍图示特点 2 UTP04示波器探头&#xff08;100M带宽&#xff09;3 功能介绍4 示例RS232 电平信号测试 参考 1 介绍 图示 特点 2GS/s的实时采样率&#xff1a;设备能够以每秒2吉萨&#xff08;Giga Samples per second&#xff09;…

基础库正则表达式

我们已经可以用requests 库来获取网页的源代码&#xff0c;得到 HTML 代码。但我们真正想要的数据是包含在 HTML代码之中的&#xff0c;要怎样才能从 HTML,代码中获取想要的信息呢?正则表达式就是其中一个有效的方法。 本篇博客我们将了解一下正则表达式的相关用法。正则表达…

PID 控制算法理论背景:飞控领域的核心调控机制(1)

在飞控工程领域&#xff0c;PID 控制算法占据着极为关键的地位&#xff0c;是实现飞行器精确稳定控制的基石。PID 作为比例&#xff08;P&#xff09;、积分&#xff08;I&#xff09;、微分&#xff08;D&#xff09;的集成代表&#xff0c;构建起了控制系统的核心架构&#x…

复合翼与倾转旋翼飞行器:设计与控制算法对比

一、引言 复合翼&#xff08;Compound Wing&#xff09;和倾转旋翼&#xff08;Tilt - Rotor&#xff09;飞行器在现代航空领域均占据独特地位&#xff0c;二者在设计和控制算法方面展现出显著差异。这些差异在飞行模式切换、推进系统设计、控制算法复杂度以及飞行器稳定性等多…

Vue2五、自定义指令,全局局部注册、指令的值 ,插槽--默认插槽,具名插槽 ( 作用域插槽)

一、自定义指令 使用步骤 1. 注册 (全局注册 或 局部注册) &#xff0c;在 inserted 钩子函数中&#xff0c;配置指令dom逻辑 2. 标签上 v-指令名 使用 1、自定义指令&#xff08;全局&#xff09; Vue.directive("指令名"&#xff0c;{ 指令的配置项 insert…

一次BC站点渗透实录

初探 打开首页 简单信息收集: IP地址&#xff1a;美国加利福尼亚洛杉矶 无CDN 中间件:Nginx 80端口直接突破&#xff0c;故未进行端口扫描 渗透思路 一般这种BC站点&#xff0c;有几种思路可以切入&#xff1a; 1&#xff09;通过SQL注入查到管理员账号密码&#xff0c;扫描…

java 集合对象

Java 基础之集合_java集合继承关系图-CSDN博客 集合可以有序或无序&#xff0c;重复或不能重复&#xff0c;空或不能空。 List<> 集合&#xff0c;是有序&#xff0c;允许重复元素&#xff0c;允许空元素 1、ArrayList<> 非线程安全 2、LInkedList<> 非线…

web实操8-cookie

会话技术 会话&#xff1a; 一次会话中包含多次请求和响应。 客户端浏览器访问服务器的资源&#xff0c;只要客户端或者服务器端不关闭&#xff0c;这始终在一次会话范围内&#xff0c;这一次会话范围内可以包含多次请求并且收到多次相应。 一次会话&#xff1a;浏览器第一…

VMWare 的克隆操作

零、碎碎念 VMWare 的这个克隆操作很简单&#xff0c;单拎出来成贴的目的是方便后续使用。 一、操作步骤 1.1、在“源”服务器上点右键&#xff0c;选择“管理--克隆” 1.2、选择“虚拟机的当前状态”为基础制作克隆&#xff0c;如下图所示&#xff0c;然后点击“下一页” 1.3、…

JVM性能优化一:初识内存泄露-内存溢出-垃圾回收

本文主要是让你充分的认识到什么叫做内存泄露&#xff0c;什么叫做内存溢出&#xff0c;别再傻傻分不清了&#xff0c;别再动不动的升级服务器的内存了。 文章目录 1.基本概念1.1.内存泄露1.2.内存溢出1.3.垃圾回收1.4.内存泄露-垃圾回收-内存溢出三者的关系关系 2.代码示例2.…

dockfile镜像加速

运行给的终端命令 全覆盖法 {"registry-mirrors": ["https://registry.docker-cn.com","http://hub-mirror.c.163.com","https://dockerhub.azk8s.cn","https://mirror.ccs.tencentyun.com","https://registry.cn-han…

数据结构经典算法总复习(下卷)

第五章:树和二叉树 先序遍历二叉树的非递归算法。 void PreOrderTraverse(BiTree T, void (*Visit)(TElemType)) {//表示用于查找的函数的指针Stack S; BiTree p T;InitStack(S);//S模拟工作栈while (p || !StackEmpty(S)) {//S为空且下一个结点为空&#xff0c;意味着结束遍…

Windows系统上创建Flask服务器

为什么需要掌握服务器搭建技能&#xff1f; 掌握服务器搭建技能对于任何需要在线提供服务或平台的个人创意者来说都至关重要。服务器的作用是确保全球任何地方的用户都能顺利访问你的平台。因此&#xff0c;了解如何搭建和维护服务器&#xff0c;不仅能提升平台的稳定性和访问…

ISP用到的一些名词简介

这里主要记录一下在学习ISP时遇到的一些名词。 图像质量(Picture Quality) 1.锐度&#xff08;Acutance&#xff09; 锐度常用于描述边界处图像信息过渡的快慢。高反差图像过渡速度非常快&#xff0c;可以形成非常明确的边缘&#xff0c;而低反差图像存在一定的过渡缓冲&#…

SqlSugar查询达梦数据库遇到的异常情况(续)

之前的文章提到在SqlSugar的Where函数中使用!string.IsNullOrEmpty函数查询达梦数据库时&#xff0c;明明数据库中有数据但就是查不出来&#xff0c;但相同的代码在另一台电脑上就可以正常返回数据。   以下图中的两张表数据为例&#xff0c;执行下面的SQL语句无法查询到数据…

Spark优化----Spark 性能调优

目录 常规性能调优 常规性能调优一&#xff1a;最优资源配置 常规性能调优二&#xff1a;RDD 优化 RDD 复用 RDD 持久化 RDD 尽可能早的 filter 操作 常规性能调优三&#xff1a;并行度调节 常规性能调优四&#xff1a;广播大变量 常规性能调优五&#xff1a;Kryo 序列化 常规性…

ECharts柱状图-柱图42,附视频讲解与代码下载

引言&#xff1a; 在数据可视化的世界里&#xff0c;ECharts凭借其丰富的图表类型和强大的配置能力&#xff0c;成为了众多开发者的首选。今天&#xff0c;我将带大家一起实现一个柱状图图表&#xff0c;通过该图表我们可以直观地展示和分析数据。此外&#xff0c;我还将提供…