123456789101112131415161718192021222324252627282930313233 /** * 手写一个简单的ajax * * @param {string} method - 请求方法 * @param {string} url - 请求地址 * @param {string} data - 请求参数 * @param {function} onSuccessCallback - 请求成功的毁掉 * @param {function} onErrorCallback - 失败的毁掉 */function sendAjaxRequest(method, url, data, onSuccessCallback, onErrorCallback) { let xhr = new XMLHttpRequest(); xhr.open(method, url, true); xhr.onreadystatechange = function ( ...
节流的核心思想是：在一定时间间隔内，无论事件触发多少次，只执行一次函数，节流会稀释函数的执行频率。
应用场景
滚动事件（每隔一段时间检查滚动位置）。
按钮点击（防止用户快速多次点击）。
手写实现时间戳
1234567891011121314function throttle(func, delay) { let lastTime = 0; // 记录上次执行的时间 return function (...args) { const context = this; // 保存当前上下文 const now = Date.now(); // 获取当前时间 // 如果距离上次执行的时间大于设定的延迟，则执行函数 if (now - lastTime >= delay) { func.apply(context, args); lastTime = now; // 更新上次执行时间 } };}
定时器
12345678910111213141516171819funct ...
前端开发
未读普通写法1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950function typeOf(value) { if (value === null) { return 'null'; // null 是一个特殊的值，typeof null 会返回 'object' } if (value === undefined) { return 'undefined'; // undefined 是另一种特殊类型 } // 检测基础数据类型 const type = typeof value; if (type !== 'object') { return type; // 对于除了对象外的所有类型（string, number, boolean, symbol, bigint, function） ...
防抖的核心思想是：在事件触发后，先等待一段时间，如果在这段时间内没有再次触发事件，则执行回调；如果在这段时间内时间又被触发，则重新计时。
应用场景
输入框实时搜索（等待用户输入完成后再发送请求）。
窗口大小调整（等待用户停止调整后再计算布局）。
手写实现1234567891011121314151617function debounce(func, delay) { let timer = null; // 用于存储定时器 return function (...args) { const context = this; // 保存当前上下文 // 如果定时器存在，则清除之前的定时器 if (timer) { clearTimeout(timer); } // 重新设置定时器 timer = setTimeout(() => { func.apply(context, args); // 延迟结束后执行函数 }, delay); }; ...
1. 什么是 TypeScript？TypeScript 是 JavaScript 的一个超集，由微软开发并开源。扩展了 JavaScript 的语法，添加了静态类型检查和其他特性，使得代码更易于维护和调试。
1.1 TypeScript 的优势
静态类型检查：在编译时捕获类型错误，减少运行时错误。
更好的开发体验：提供代码补全、接口提示等功能，提升开发效率。
兼容 JavaScript：TypeScript 是 JavaScript 的超集，可以直接运行 JavaScript 代码。
渐进式学习：可以从 JavaScript 逐步迁移到 TypeScript，无需重写整个项目。
2. 安装 TypeScript2.1 全局安装通过 npm 全局安装 TypeScript：
1npm install -g typescript
安装完成后，检查是否安装成功：
1tsc -v # 查看 TypeScript 版本
2.2 在项目中使用在项目中安装 TypeScript：
1npm install typescript --save-dev
初始化 TypeScript 配置文 ...
一、什么是BFC？BFC 全称：Block Formatting Context， 名为 “块级格式化上下文”。官方解释：BFC它决定了元素如何对其内容进行定位，以及与其它元素的关系和相互作用，当涉及到可视化布局时，BFC提供了一个环境，HTML在这个环境中按照一定的规则进行布局。
很绕口是吧 通俗解释：BFC是页面中一块独立的渲染区域，它决定了块级元素如何布局以及与其他元素的关系。BFC内部的元素按照一定的规则排列，不会影响外部的元素。再简单来说，BFC就是一个隔离的容器，内部的布局行为与外部无关。
BFC的特性
独立的渲染区域：BFC内部的元素不会影响外部的布局。
包含浮动元素：BFC可以包含浮动元素，避免父元素高度塌陷。
阻止外边距折叠：BFC内部的垂直外边距不会与外部元素的外边距折叠。
隔离浮动元素：BFC可以阻止浮动元素覆盖其他内容。
二、如何创建BFC？BFC的创建条件包括以下几种：
根元素（<html>）：页面本身就是一个BFC。
浮动元素：float不为none的元素。
绝对定位元素：position为absolute或fixed的元素。
行内块元素： ...
目标实现一个简约版的 Vue.js，包含以下功能：
响应式系统：通过数据劫持和分发订阅实现响应式。
模板解析：实现 {{}} 模板语法，将数据绑定到视图。
双向数据绑定：通过 v-model 实现表单元素与数据的双向绑定。
方案规划1. 项目初始化
创建一个空项目，初始化 package.json。
创建入口文件 index.html 和主逻辑文件 mini-vue.js。
2. 响应式系统
实现数据劫持，监听数据的变化。
使用 Object.defineProperty 实现数据的 getter 和 setter。
实现依赖收集和派发更新机制。
3. 模板解析
实现 {{}} 语法的解析，将数据绑定到 DOM。
使用正则表达式匹配 {{}} 中的表达式，并替换为实际数据。
4. 双向数据绑定
实现 v-model 指令，将表单元素的值与数据进行绑定。
监听表单元素的 input 事件，更新数据；同时监听数据变化，更新表单元素的值。
动手1. 项目初始 ...
1. Vue的双向数据绑定机制Vue 的双向数据绑定主要依赖于两个核心的技术点：
数据劫持（Data Hijacking） ：Vue 通过 Object.defineProperty 劫持对象的属性，使得属性值的获取和设置可以被拦截，进而进行一些自定义的操作。
发布-订阅模式（Observer-Pattern） ：当数据发生变化时，通知视图更新。Vue 中的 Watcher 充当了这个角色，负责监听数据变化并进行视图更新。
2. 数据劫持：Object.definePropertyVue 的数据绑定的实现原理首先需要理解 Vue 如何“劫持”数据对象的属性。这通过 Object.defineProperty来实现，它使得我们可以在对象的每个属性上定义自定义的 getter 和 setter 方法。
1. 数据劫持的过程在 Vue 的响应式系统中，Vue 会使用 Object.defineProperty 来遍历每个数据对象的属性，并为每个属性定义 getter 和setter。这个过程让 Vue 能够“劫持”数据的访问和修改，从而在数据发生变化时，自动触发视图的更新。
例如，假设 ...
Python
未读成天看后端他们在那搞爬虫，最近不忙，我也来试试，就爬取豆瓣电影的Top250列表吧，页面简单适合初学者，Google啥的反作弊机制太成熟，不适合新人上手。查了一些资料需要安装几个必要的库，如requests和BeautifulSoup…
以下是实现步骤和代码：
步骤：
安装依赖库 ：首先确保安装了所需的库。可以使用pip进行安装。我的Mbp自带Python2.7，这就省略了一个安装Python的步骤。
12pip install requestspip install beautifulsoup4
编写爬虫代码 ：用Python编写爬虫，抓取豆瓣Top250的电影信息。豆瓣Top250网页使用了分页，所以还需要处理多个页面。
处理反爬虫机制 ：豆瓣网站有一定的反爬虫措施，可以通过设置User-Agent等方式来模拟浏览器请求。
代码实现：123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646 ...
引言HTTP 状态码是服务器对客户端请求的响应结果的三位数字代码。它位于 HTTP 响应的起始行中，用于快速传达请求的成功或失败状态。状态码通常伴随着一个简短的文本描述（如 200 OK），帮助开发者理解响应的具体含义。
HTTP 状态码的分类HTTP 状态码根据首位数字分为五类，每类状态码都有特定的含义：
1. 1xx：信息性状态码表示请求已被接收，需要继续处理。这类状态码通常用于临时响应。
100 Continue：客户端应继续发送请求的剩余部分。
101 Switching Protocols：服务器同意切换协议（如从 HTTP 切换到 WebSocket）。
2. 2xx：成功状态码表示请求已成功被服务器接收、理解并处理。
200 OK：请求成功，响应中包含请求的数据。
201 Created：请求成功，并创建了新资源（常用于 POST 请求）。
204 No Content：请求成功，但响应中没有内容（常用于 DELETE 请求）。
3. 3xx：重定向状态码表示需要客户端进一步操作以完成请求。
301 Moved Permanently：请求的资源已永久移动到新 ...
