- 博客(33)
- 收藏
- 关注
原创 高级工程师和低级工程师的区别
衡量高级工程师的真正标准不是产出速度或数量,而是完成其他工程师无法完成的任务的能力。工程人才不是额外的速度或产出,而是能够完成其他工程师无法完成的任务的能力。这就是为什么最弱的工程师产出如此之少,以及为什么科技公司的首席执行官热衷于聘请最强的工程师。大多数工程师可以完成一系列常规工作任务,但有些工程师可以完成非常困难的任务,而有些工程师几乎什么都做不了。你应该尝试扩大你擅长的任务范围。如果你与一名能力较弱的工程师共事,那么要友善一点,但要保护好自己的时间。转载并翻译。
2025-04-03 11:19:06
667
原创 2025年了,还在问什么是闭包吗
闭包是指一个函数能够记住并访问它被定义时的作用域(即使这个函数在定义时的作用域之外执行)。换句话说,闭包让函数拥有“记忆”,可以持续访问外部函数的变量。闭包的本质是函数 + 被保留的作用域链。它让函数可以“记住”定义时的环境,是 JavaScript 灵活性的重要体现。理解闭包后,可以更好地设计模块化、安全的代码。
2025-03-06 18:00:53
360
原创 Array.prototype.flatMap()的使用
Array.prototype.flatMap() 是 JavaScript 中的一个数组方法,它首先对数组中的每个元素应用一个映射函数(即转换函数),然后将结果展平成一个新的数组。:当你有一个多维数组,或者一个数组中每个元素都是一个小数组,而你需要将这些小数组合并成一个单一的一维数组时,从 API 响应中提取数据:假设你从 API 获取的数据是一个对象数组,每个对象包含多个项目,你可以使用。:在映射的同时过滤掉不需要的元素。两个操作,但更高效,因为它是作为一个单独的步骤执行的,而不是先调用。
2025-02-26 16:09:40
267
原创 Vue 中,使用模板(Template) 和 Render 函数编写组件的区别
当需要将组件渲染到非 DOM 环境(如 Canvas、Native 应用)时,Render 函数更灵活。适合熟悉 React 或偏好 JSX 的开发者,可以利用 JS 的全部能力。当组件的结构需要根据复杂逻辑动态生成时(如动态标签名、动态子组件)。适合大多数静态或简单动态的 UI 布局,如表单、列表、卡片等。需要更细粒度控制渲染逻辑时(如实现高阶组件或抽象功能)。需要手动优化渲染性能时(如避免不必要的子组件重渲染)。示例:根据权限动态渲染按钮,或根据配置生成表单字段。示例:固定结构的页面布局、表单控件。
2025-02-26 16:07:30
814
原创 请使用 reduce() 来替代 .filter().map()
使用 filter() 和 map() 会遍历数组两次,并且代码不易维护。这里建议使用 reduce() 来替代 .filter().map(),使用 reduce() 只遍历一次并实现相同的效果,从而更高效。
2024-08-27 20:48:05
208
原创 webpack 中 require.context() 的用法
webpack中的 require.context() 函数可以获取一个上下文,从而实现工程自动化(遍历文件夹的文件,从中获取指定文件,自动导入模块)。
2024-06-19 10:19:33
491
原创 Array.prototype.every() 容易被忽视的一个细节
every 和数学中的全称量词"任意(∀)"类似。特别的,对于空数组,它只返回 true。(这种情况属于无条件正确,因为空集的所有元素都符合给定的条件。注意最后三行,every() 方法作用于空数组,总是返回 true。every() 方法作用与一个空数组,返回结果是什么?
2024-03-30 15:40:59
264
原创 微前端的使用和注意事项 - qiankun
微前端架构旨在解决单体应用在一个相对长的时间跨度下,由于参与的人员、团队的增多、变迁,从一个普通应用演变成一个巨石应用(Frontend Monolith)后,随之而来的应用不可维护的问题。
2024-03-30 15:30:23
452
原创 Bun - NodeJS的替代
什么是BunBun 是采用 Zig 语言编写的高性能 “全家桶” JavaScript 运行时。Bun 提供了打包、转译、安装和运行 JavaScript & TypeScript 项目的功能,内置原生打包器 (native bundler)、转译器、task runner、npm 客户端,以及 fetch、WebSocket等 Web API。Bun 嵌入了 JavaScriptCore,它往往比 V8 等更流行的引擎更快且内存效率更高(尽管更难嵌入)。Bun 的目标是在浏览器之外运行世
2024-03-30 14:59:59
673
原创 Webpack原理及常见问题总结
webpack是什么定义 webpack是一个JavaScript应用程序的静态模块打包器。它会分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(less,ES6等),将其转换和打包为合适的格式供浏览器使用。工作原理 把项目当作一个整体,通过一个给定的主文件(如:main.js),Webpack将从这个文件开始找到你的项目所...
2018-08-08 17:29:20
1025
原创 一篇文章弄懂浏览器内核
浏览器内核是什么?浏览器内核主要分成两部分:渲染引擎和JS引擎,因为JS引擎的逐渐独立,故通常浏览器内核是指渲染引擎。渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。浏览器内核(渲染引擎)有什么用?负责取得网页的内容,整理讯息,以及计算网页的显示方式,然后会输出至显示器或打印机。 浏览器内核不同,对于网页的语法解释会有不同,所以渲染的效果也不相同。 所有网页浏...
2018-07-13 11:25:06
897
原创 一篇文章看懂AMD、CMD和CommonJS的区别
前端模块化之JS中的三种模块规范AMD规范思想 异步加载所需模块,然后在回调函数中执行主逻辑。设计目的 1.实现JS文件的异步加载,避免网页因加载时间过长而失去响应; 2.管理模块之间的依赖性,便于代码的编写和维护;代表 RequireJS示例//a.jsdefine(function(){ console.log('a.js'执行); return...
2018-07-02 22:48:01
1022
原创 Linux安装mongodb及mongodb的远程连接
Linux安装mongodb及mongodb的远程连接本文主要介绍Linux系统 - centOS通过yum安装mongodb和mongodb的远程连接配置仓库文件针对MongoDB版本为3.6的:# vim /etc/yum.repos.d/mongodb-org-3.6.repo复制以下代码到文件中[mongodb-org-3.6]name=Mon...
2018-04-08 14:23:00
11028
转载 通过user-agent判断用户是用QQ、微信还是支付宝打开链接或二维码
通过user-agent判断用户是用QQ、微信还是支付宝打开链接或二维码function is_weixn_qq(){var ua = navigator.userAgent.toLowerCase();if(ua.match(/MicroMessenger/i)=="micromessenger") { return "weixin";} else if (ua.match(/...
2018-04-08 11:06:05
4747
原创 NodeJS搭建项目的简单配置与数据库连接
NodeJS搭建项目的简单配置与数据库连接主要内容如下:加载exprss模块创建app应用加载模板处理设置静态文件托管加载数据库模块离线写博客处理post请求Cookie设置加载exprss模块var express = require('express');创建app应用 (相当于NodeJS Http.createServer();)代码块...
2018-04-08 10:34:07
2837
原创 在CentOS上安装Node.js
在Linux/CentOS 7上安装Node.js下载解压重命名配置测试附录一、Linux下载node.js选择要安装的目录(本地安装的软件和其他文件一般放在/usr/local目录下)# cd /usr/local 下载# wget http://cdn.npm.taobao.org/dist/node/v8.9.3/node-v
2018-01-09 09:52:45
358
原创 滚动插件的使用之jQuery Marquee
滚动插件的使用之jQuery Marquee简介:jQuery Marquee是一款基于 jQuery 的滚动插件,类似于 HTML 的 marquee 标签,但在marquee的基础上新增了许多可控功能。它可以应用于多种 Web 元素,包括文字、图片、表单等元素,同时它可以设置不同的滚动方向(上下左右)、滚动速度、无缝滚动等等,并且支持CSS3。安装使用参数及配置演示一、安装npm安装
2018-01-02 15:35:21
4624
原创 CSS3之box-sizing属性分析
CSS中有个box-sizing的属性,特别有意思:定义:box-sizing: content-box|border-box|inherit; 解释:box-sizing主要用来规定元素宽高。①content-box - 默认属性 CSS2.1规定的宽度高度行为,宽度和高度分别到元素的内容为止,而内边距和边框不计算在内; 也就是说,你使用content-box
2017-03-14 10:48:27
642
原创 Slider滑块插件之Chrome下双击后的拖拽问题
起因:本人在做slider滑块插件的过程中,遇到双击滑块后,默认为鼠标选中行为,导致拖拽功能无法正常使用。经过:以下为插件的截图:说明:因截图不能截取鼠标,故使用手绘图片代替。即拖拽滑块时,双击鼠标,出现如图所示情况。猜测:Chrome浏览器对双击事件默认为选中行为。解决方案:禁止用户选中网页上的内容,使用onselectstart,例如 为元素加上onsele
2017-03-14 09:58:26
1432
原创 JavaScript“预解析”简单原理
一、原理1. 定义:JavaScript”预解析”,可以理解为把变量或函数预先解析到它们被使用的环境中。2. 通俗点讲,即认为浏览器在正式运行JavaScript代码前,第一步,会预先根据关键字var、function等,来查找一些需要被解析的东西,例如:var a = 1; function test(){ alert(2); }; 第二步,给这些需要被解析的东西提前赋值,其中包括:⑴ 所有的变...
2016-11-07 17:43:53
4020
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人