- 博客(79)
- 收藏
- 关注
RSS订阅
翻译 用 TypeScript 写 React & Redux - 完全指南
“这个指南是一个最新的摘要，记录了关于如何用TypeScript 以函数式风格使用React（以及相关生态）最重要的模式和示例。它会使你的代码在从具体实现中进行类型推导时绝对是类型安全的，这样就能减少来自过度类型声明的信息噪音，并更容易写出易于长期维护的正确类型声明。”目标完全的类型安全（支持--strict模式），并且在向应用的下游代码传递时，不会丢失类型信息（比如：缺少类型断言或用 any 来强行使用）使用高级 TypeScript 语言特性（诸如类型推论和控制流分析）来消除类型冗余、使类型.
2020-09-06 13:54:58
4615
翻译 Airbnb JavaScript 风格指南
Airbnb JavaScript 风格指南() {JavaScript最合理的方法 A mostly reasonable approach to JavaScript注意: 这个指南假定你正在使用Babel， 并且需要你使用或等效的使用babel-preset-airbnb。 同时假定你在你的应用里安装了带有或等效的airbnb-browser-shims的shims/polyfills目录TypesReferencesObjectsArraysDestructuringStr
2020-08-04 19:54:33
5459
原创 2021 Web 前端热点笔试面试题总结【更新版】
提醒：我只是答案的搬运工，如果在浏览中发现有错误，欢迎评论中提出来，我好修改，谢谢！简述异步和同步的区别：同步：浏览器访问服务器请求，用户看得到页面刷新，重新发请求,等请求完，页面刷新，新内容出现，用户看到新内容,进行下一步操作异步：浏览器访问服务器请求，用户正常操作，浏览器后端进行请求。等请求完，页面不刷新，新内容也会出现，用户看到新内容简述JavaScript基本数据类型u...
2019-10-29 11:56:15
15155
29
原创 css开发技巧
theme: juejin目录既然写文章有这么多的写作技巧，那么我也需要对CSS开发技巧整理一下，起个易记的名字。Layout Skill：布局技巧Behavior Skill：行为技巧Color Skill：色彩技巧Figure Skill：图形技巧Component Skill：组件技巧备注代码只作演示用途，不会详细说明语法兼容项点击链接即可查看当前属性...
2023-08-20 12:18:13
136
1
原创 2023年前端面试知识点总结（JavaScript篇）
JS是一种具有函数优先特性的轻量级、解释型或者说即时编译型的编程语言。是一种基于原型、多范式、单线程的动态语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。比较全面的一篇JS面试题
2023-02-18 14:52:05
864
原创 2023年前端面试知识点总结（CSS篇）
两个块级元素的上外边距和下外边距可能会合并为一个外边距，其大小会取其中外边距值大的那个，这种行为就是外边距折叠。需要注意的是，浮动的元素和绝对定位这种脱离文档流的元素外边距不会折叠，重叠只会出现在垂直方向。兄弟之间重叠底部元素变为行内盒子：float底部元素的position的值为父子之间重叠子元素加入浮动属性或定位。
2023-02-11 23:15:27
3045
原创 前端常用插件、工具类汇总分享
theme: channing-cyan前言在开发中，我们经常会将一些常用的代码块、功能块进行封装，为的是更好的复用。那么，被抽离出来独立完成功能，通过API或配置项和其他部分交互，便形成了插件。下面这些是我在工作中积累的一些常用的前端开源插件，这里只是罗列出来，详细的用法各个插件官网或者Gayhub都有介绍。注意：往往一个解决方案会有多个插件，需要读者根据自己的实际业务需求进行甄...
2022-10-09 14:43:29
380
原创 TanStack Query异步状态管理--中文版（持续更新中）
theme: githubhighlight: androidstudioReact Query API翻译参考 该文原版，如有翻译不妥之处，还请指点，谢谢！useQuery```tsxconst { data, dataUpdatedAt, error, errorUpdatedAt, failureCount, failureReason...
2022-07-22 17:03:14
240
原创 HTML 标签元素分组介绍
theme: fancy 本文转载MDN HTML元素参考主根元素htmlHTML<html>元素 表示一个 HTML 文档的根(顶级元素)，所以它也被称为根元素。所有其他元素必须是此元素的后代。示例html<!DOCTYPE html><html lang="zh"><head>...</head&g...
2022-07-14 17:57:46
125
原创 JavaScript文件里添加JSDoc注解
theme: v-green支持的JSDoc 下面的列表列出了当前所支持的JSDoc注解，你可以用它们在JavaScript文件里添加类型信息。注意，没有在下面列出的标记(例如@async)都是还不支持的。@type@param (or @arg or @argument)@returns (or @return)@typedef@callback@template...
2021-08-13 17:56:07
64
原创 Git 常用命令
theme: healer-readable以下常用命令来自阮一峰老师的博客文章《常用 Git 命令清单》，感谢阮老师！仓库```在当前目录新建一个Git代码库$ git init新建一个目录，将其初始化为Git代码库$ git init [project-name]下载一个项目和它的整个代码历史$ git clone [url]```配置```...
2021-07-24 16:29:30
27
原创 JavaScript基础知识总结
1. JavaScript简介JavaScript 最开始是专门为浏览器设计的一门语言，但是现在也被用于很多其他的环境。如今，JavaScript 已经成为了与 HTML/CSS 完全集成的，使用最广泛的浏览器语言。有很多其他的语言可以被“编译”成 JavaScript，这些语言还提供了更多的功能。建议最好了解一下这些语言，至少在掌握了 JavaScript 之后大致的了解一下。2...
2021-07-16 17:53:01
25
原创 Javascript 高效开发工具函数
Javascript 高效开发工具函数数组multArray二维数组转换flatten扁平化数组flattenDeep指定层级扁平化数组isArrayEqual检查两个数组各项相等allEqual检查数组各项相等diffArray具有唯一array值的数组haveArr具有共同array值的数组uniqueArray数组去重uniqueArrayObject数组对象去重treeData生成树结构数据ascArr数组升序descArr数组降序shuffle随机排序takeArr
2021-04-01 18:05:40
758
原创 前端 Javascript 高效开发工具函数
theme: healer-readable一、数组multArray多维数组转换将数组(array)拆分成多个子数组，并将这些子数组组成一个新数组。jsmultArray(array, count)参数array需要处理的数组count = 8子数组需要的长度示例```jsmultArray([1, 2, 3, 4, 5, 6], 2)=>...
2021-04-01 18:02:20
43
转载 Git的使用
常见操作全局配置用户信息git config --global user.name "JayYuen"git config --global user.email "[email protected]"分支的合并场景：基于master分支的代码，开发一个新的特性如果你直接在master分支上开发这个新特性，是不好的，万一你在开发特性1的时候，领导突然又要叫你去开发特性2，就不好处理了。难道开发的两个特性都提交到master？一会儿提交特性1的commit，一会儿提交特性2的commit？这会
2021-03-27 18:28:29
1087
转载 VS Code的使用
前言文章标题：《第一次使用 VS Code 时你应该知道的一切配置》。本文的最新内容，更新于 2020-06-19。大家完全不用担心这篇文章会过时，因为随着 VS Code 的版本更新和插件更新，本文也会随之更新。VS Code 软件实在是太酷、太好用了，越来越多的新生代互联网青年正在使用它。前端男神尤雨溪大大这样评价 VS Code：有一点你可能会感到惊讶：VS Code 这款软件本身，是用 JavaScript 语言编写的（具体请自行查阅基于 JS 的 PC 客户端开发框架 Electro
2021-03-27 18:25:19
3299
原创 01-服务器分类及PHP入门
C/S架构和B/S架构C/S架构是Client/Server这两个单词的首字母，指的是客户端，服务器。优点:性能较高：可以将一部分的计算工作放在客户端上,这样服务器只需要处理数据即可。界面酷炫:客户端可以使用更多系统提供的效果,做出更为炫目的效果。缺点:更新软件：如果有新的功能，就要推出新的版本。不同设备访问：如果使用其他的电脑，没有安装客户端的话就无法登陆软件。B/S架构是Browser/Server的这两个单词的首字母。指的是浏览器、服务器，是WEB兴起之后的
2020-07-19 09:38:57
2281
原创 01-React介绍
虚拟DOM和diff算法在学习 React 之前，我们需要先了解两个概念：虚拟DOM、diff算法。虚拟DOM问题描述：假设我们的数据发生一点点的变化，也会被强制重建整颗DOM树，这么做，会涉及到很多元素的重绘和重排，导致性能浪费严重。解决上述问题的思路：实现按需更新页面上的元素即可。也就是说，把需要修改的元素，所对应的 DOM 元素重新构建；其他没有变化的数据，所对应的 DOM 节点不需要被强制更新。具体实现方案：（如何按需更新页面上的元素）只需要拿到页面更新前的内存中的DOM树，同时
2020-07-19 09:25:03
2007
原创 React项目笔记
day011. 项目开发准备1). 描述项目2). 技术选型 3). API接口/接口文档/测试接口2. 启动项目开发1). 使用react脚手架创建项目2). 开发环境运行: npm start3). 生产环境打包运行: npm run build serve build3. git管理项目1). 创建远程仓库2). 创建本地仓库 配置.gitignore git init git add . git commit -m "init"3).
2020-07-13 06:31:02
723
原创 04-jQuery的事件机制和其他知识
jQuery 设置宽度和高度宽度操作： $(selector).height(); //不带参数表示获取高度 $(selector).height(200); //带参数表示设置高度宽度操作： $(selector).width(); //不带参数表示获取宽度 $(selector).width(200); //带参数表示设置高宽度问题：jQuery的css(...
2019-12-07 17:13:36
3622
原创 03-jQuery操作DOM
文本主要内容样式和类操作节点操作样式操作和类操作作用：设置或获取元素的样式属性值。样式操作1、设置样式： //设置单个样式： css(属性，值); $("div").css("background-color","red"); //设置多个样式： css(json); $("div").css({"width":100,"height":...
2019-12-07 17:07:23
3730
原创 01-jQuery的介绍和选择器
jQuery 的介绍引入 jQuery 的原因在用 js 写代码时，会遇到一些问题：window.onload 事件有事件覆盖的问题，因此只能写一个事件。代码容错性差。浏览器兼容性问题。书写很繁琐，代码量多。代码很乱，各个页面到处都是。动画效果很难实现。如下图所示：jQuery的出现，可以解决以上问题。什么是 jQueryjQuery 是 js...
2019-11-29 18:19:06
2653
2
原创 28 - JavaScript 特效：scroll家族和缓动动画
缓动动画三个函数缓慢动画里，我们要用到三个函数，这里先列出来：Math.ceil() 向上取整Math.floor() 向下取整Math.round(); 四舍五入缓动动画的原理缓动动画的原理就是：在移动的过程中，步长越来越小。设置步长为**：目标位置和盒子当前位置的十分之一**。用公式表达，即： 盒子位置 = 盒子本身位置 + ...
2019-11-19 18:18:59
6371
原创 27 - JavaScript 特效：offset家族和匀速动画(含轮播图的实现)
前言JS动画的主要内容如下：1、三大家族和一个事件对象：三大家族：offset/scroll/client。也叫三大系列。事件对象/event（事件被触动时，鼠标和键盘的状态）（通过属性控制）。2、动画(闪现/匀速/缓动)3、冒泡/兼容/封装4、正则offset 家族的组成我们知道，三大家族包括：offset/scroll/client。今天来讲一下offset，以及...
2019-11-19 18:07:00
2959
原创 26 - JavaScript原型链
常见概念构造函数构造函数-扩展原型规则和示例原型链instanceof构造函数任何一个函数都可以被new，new了之后，就成了构造方法。如下： function Foo(name, age) { this.name = name; this.age = age; //retrun this; //默...
2019-11-19 18:03:09
3307
原创 25 - JavaScript BOM的常见内置方法和内置对象
BOM的介绍JavaScript的组成JavaScript基础分为三个部分：ECMAScript：JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。DOM：文档对象模型，操作网页上的元素的API。比如让盒子移动、变色、轮播图等。BOM：浏览器对象模型，操作浏览器部分功能的API。比如让浏览器自动滚动。什么是BOMBOM：Brows...
2019-11-19 17:58:04
2951
原创 24 - JavaScript 事件对象Event和冒泡
绑定事件的两种方式/DOM事件的级别DOM0的写法：onclick element.onclick = function () {}举例：<body> <button>点我</button> <script> var btn = document.getElementsByTagName("button")...
2019-11-13 16:56:27
4869
原创 23 - JavaScript 通过style对象设置行内样式
style属性的获取和修改在DOM当中，如果想设置样式，有两种形式：className（针对内嵌样式）style（针对行内样式）这篇文章，我们就来讲一下style。需要注意的是：style是一个对象，只能获取行内样式，不能获取内嵌的样式和外链的样式。例如：<!DOCTYPE html><html lang="en"> <head>...
2019-11-13 16:27:19
14788
1
原创 22- JavaScript DOM简介和DOM操作
常见概念JavaScript的组成JavaScript基础分为三个部分：ECMAScript：JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。DOM：文档对象模型（Document object Model），操作网页上的元素的API。比如让盒子移动、变色、轮播图等。BOM：浏览器对象模型，操作浏览器部分功能的API。比如让浏览器自动滚...
2019-11-05 23:32:04
2777
原创 21- JavaScript 事件简介
事件简介事件：就是文档或浏览器窗口中发生的一些特定的交互瞬间。对于 Web 应用来说，有下面这些代表性的事件：点击某个元素、将鼠标移动至某个元素上方、关闭弹窗等等。JavaScript 是以事件驱动为核心的一门语言。JavaScript 与 HTML 之间的交互是通过事件实现的。事件的三要素事件的三要素：事件源、事件、事件驱动程序。比如，我用手去按开关，灯亮了。这件事情里，事件源是：手。...
2019-11-04 09:42:51
3575
2
原创 20- JavaScript 正则表达式
正则表达式简介定义：正则表达式用于定义一些字符串的规则。作用：计算机可以根据正则表达式，来检查一个字符串是否符合指定的规则；或者将字符串中符合规则的内容提取出来。如果你想查看正则更多的内容，可以查阅官方文档关于 RegExp 这个内置对象的用法。创建正则表达式的对象方式一：使用构造函数创建正则表达式的对象语法： let 变量 = new RegExp("正则表达式"); // 注意，...
2019-11-01 14:49:21
3550
原创 前端面试题总结
JS 基础知识点及常考面试题（一）JS 对于每位前端开发都是必备技能，在小册中我们也会有多个章节去讲述这部分的知识。首先我们先来熟悉下 JS 的一些常考和容易混乱的基础知识点。原始（Primitive）类型涉及面试题：原始类型有哪几种？null 是对象嘛？在 JS 中，存在着 6 种原始值，分别是：booleannullundefinednumberstringsymbo...
2019-10-29 11:58:22
6079
1
原创 19 - JavaScript 内置对象：String
前言在日常开发中，String对象的使用频率是非常高的。所以有必要详细介绍。基本数据类型不能绑定属性和方法1、基本数据类型：注意，基本数据类型string是无法绑定属性和方法的。比如说： var str = "Yuan"; str.aaa = 12; console.log(typeof str); //打印结果为：string console.log...
2019-10-23 23:19:28
2219
原创 18 - JavaScript 包装类
包装类包装类的介绍我们都知道，js中的数据类型包括以下几种。基本数据类型：String、Number、Boolean、Null、Undefined引用数据类型：ObjectJS为我们提供了三个包装类：String()：将基本数据类型字符串，转换为String对象。Number()：将基本数据类型的数字，转换为Number对象。Boolean()：将基本数据类...
2019-10-23 23:04:57
2306
原创 17 - JavaScript 内置对象：Math
内置对象 Math内置对象 Math 的常见方法方法描述备注Math.abs()返回绝对值Math.floor()向下取整（向小取）Math.ceil()向上取整（向大取）Math.round()四舍五入取整（正数四舍五入，负数五舍六入）Math.random()生成0-1之间的随机数不包含0和1Math.max(x, y...
2019-10-23 23:01:35
1943
原创 16 - JavaScript内置对象：Date
内置对象简介内置对象就是指这个语言自带的一些对象，供开发者使用，这些对象提供了一些常用的或是最基本而必要的功能。JavaScript的内置对象：内置对象对象说明Arguments函数参数集合Array数组Boolean布尔对象Date日期时间Error异常对象Function函数构造器Math数学对象Number数...
2019-10-23 22:57:42
2029
转载 JavaScript 十大排序算法
排序算法说明:（1）对于评述算法优劣术语的说明稳定：如果a原本在b前面，而a=b，排序之后a仍然在b的前面；不稳定：如果a原本在b的前面，而a=b，排序之后a可能会出现在b的后面；内排序：所有排序操作都在内存中完成；外排序：由于数据太大，因此把数据放在磁盘中，而排序通过磁盘和内存的数据传输才能进行；时间复杂度: 一个算法执行所耗费的时间。空间复杂度: 运行完一个程序所需内存的大小...
2019-10-23 11:12:12
2801
原创 15 - JavaScript数组的其他方法
前言数组的其他方法如下：方法描述备注indexOf(value)从前往后索引，获取 value 在数组中的第一个下标lastIndexOf(value)从后往前索引，获取 value 在数组中的最后一个下标find(function())找出第一个满足「指定条件返回true」的元素。findIndex(function())找出第一个满足「...
2019-10-21 16:28:54
2542
原创 14 - JavaScript数组的常见方法
前言数组的常见方法如下：方法描述备注slice()从数组中提取指定的一个或多个元素，返回结果为新的数组不会改变原数组splice()从数组中删除指定的一个或多个元素，返回结果为新的数组会改变原数组concat()连接两个或多个数组，返回结果为新的数组不会改变原数组join()将数组转换为字符串，返回结果为转换后的字符串不会改变原数组...
2019-10-21 16:21:08
1879
原创 13 - JavaScript数组的四个基本方法&数组的遍历
前言数组的四个基本方法如下：方法描述备注push()向数组的最后面插入一个或多个元素，返回结果为该数组新的长度会改变原数组pop()删除数组中的最后一个元素，返回结果为被删除的元素会改变原数组unshift()在数组最前面插入一个或多个元素，返回结果为该数组新的长度会改变原数组shift()删除数组中的第一个元素，返回结果为被删除的元素会...
2019-10-21 16:19:07
7346
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人