（初级前端）面试如何写出一个满意的深拷贝；【代码鉴赏】简单优雅的JavaScript代码片段；手把手带你简单回答真实前端面试题；一道有趣的JS基础题；37个JS 面试题为你助力，让面试更有力(面试必读)；小菜鸡的成长之路（前端工程化）；TypeScript 学习笔记；通熟易懂的Vue响应式原理以及依赖收集
已经有很多关于 深拷贝与浅拷贝 的文章，为什么自己还要写一遍呢:100: ❝ 学习就好比是座大山，人们沿着不同的路登山，分享着自己看到的风景。你不一定能看到别人看到的风景，体会到别人的心情。只有自己去登山，才能看到不一样的风景，体会才更加深刻。 ❞ 分享一个不错的思维导图:point_down: 通过...
Promise.race不满足需求，因为如果有一个Promise reject，结果Promise也会立即reject；Promise.all也不满足需求，因为它会等待所有Promise，并且要求所有Promise都成功resolve。
绝对定位+margin 绝对定位+transform flex 什么是盒模型？ 盒模型由这四个部分组成： content（内容区） padding（填充区） border（边框区） margin（外边界区） 列举几种清除浮动 clear 伪元素 创建BFC JS 数组slice和splice的区别？ splice非常霸道，它会改变数组，返回一个新...
前言 在查阅资料的时候，看到一道考差 JavaScript 基础知识的题目，其中还是考查到一些自己掌握的不好的知识。 题目 function Foo() { getName = function () { console.log(1); }; return this; }; Foo.getName = function () { console.log(2); }; Foo.prototype.getN...
先赞再看，养成习惯~ 1.JS中let和const有什么用？ 在现代js中，let＆const是创建变量的不同方式。 在早期的js中，咱们使用var关键字来创建变量。 let＆const关键字是在ES6版本中引入的，其目的是在js中创建两种不同类型的变量，一种是不可变的，另一种是可变的。 const:它用于创建一个不可变变量。不可变变量是指...
写在前面 小菜鸡的我又来记录笔记了，这次是前端工程化，感觉现在的前端能做的事情很多，不仅仅是以前写写页面的切图仔了。大到编辑器、页面，小到服务端的增删改都可以去做，而且也不在拘于web端，app、桌面端、服务端都有所涉及。那这次我是学习了webpack方面的知识，总结了一下形成以下笔记~ 前端工程化 ...
typeScript 是一门基于javaScript 之上的一门编程语言，解决了javascript 自有的语言类型系统的不足。TypeScript 大大提升了系统的安全性。 语言类型 区分编程语言的两个维度： 1.类型安全：强类型与弱类型 2.类型检查：静态类型与动态类型 类型安全 强类型VS弱类型： 1.强类型，从语言层面限制函数的实参...
最近在看一些底层方面的知识。所以想做个系列尝试去聊聊这些比较复杂又很重要的知识点。学习就好比是座大山，只有自己去登山，才能看到不一样的风景，体会更加深刻。今天我们就来聊聊Vue中比较重要的响应式原理以及依赖收集。 响应式原理 Object.defineProperty() 和 Proxy 对象，都可以用来对数据的劫持操作。何为...
我只想面个CV工程师，面试官偏偏让我挑战造火箭工程师，加上今年这个情况更是前后 两男 ，但再难苟且的生活还要继续，饭碗还是要继续找的。在最近的面试中我一直在总结，每次面试回来也都会复盘，下面是我这几天遇到的面试知识点。但今天主题是标题所写的66条JavaScript知识点，由浅入深，整理了一周，每（zhěng）天（lǐ...
首先说下 www.githubstatus.com 可以实时的查看到 Github 服务的可用性状态 ，文中关于可用性的截图都来自这里。 下图就是今天 （2020年06月30）能看到的服务状态，可以看到昨天 github 的除了 Git Pages 服务，其他服务都出现了事故（incidence）；其中 Git operations（就是我们的 git 相关的...
render > template > data 的插值表达式 {{}} 放的是表达式的时候会 输出结果 ，内部转为函数 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>基本概念</title> <script src="vue.js">...
思否开源项目推介丨DataX Web：简洁易用的离线数据同步工具
开源项目名称：DataX Web 开源项目负责人：@WeiYe-Jing 开源项目简介：离线数据同步工具 开源项目类型：个人开源项目项目创建时间：2019 年 12 月 GitHub 数据：734 Star，365 Fork地址：[链接]
1.讲一下排序，给一个不懂快排序的人讲快排，复杂度，为什么它叫快排序？ 参考白话经典算法系列之六 快速排序 快速搞定 2.个按照某个位置旋转的数组（连续且有序）求中位数，例如 ，复杂度，如何降到比n更低？ 思路：先找到最小的数，也就是还没翻转时arr 这个数。然...
最近一直在复习JavaScript部分，如果停留在基础知识点的话，收获可能不是很大，所以打算空闲的时间给做一张常见的JS面试题，给自己充充电:battery::battery: 当然了，肯定有人已经做过类似有趣的事情了，我觉得自己去做的话，总结一下，对巩固自己的知识点有所帮助:heavy_check_mark: 你的鼓励点赞:+1:收藏是这篇文章...
命名冲突 文件依赖 通过模块化解决上述问题 模块化就是把单独的一个功能封装到一个模块（文件）中，模块之间相互隔离，但是可以通过特定的接口公开内部成 员，也可以依赖别的模块 模块化开发的好处：方便代码的重用，从而提升开发效率，并且方便后期的维护 ES6是浏览器端和服务器端通用的模块化开发规范 ...
首先，功利点来说：目前前端框架三分天下：React、Vue、Angular，而 React 自从 v16.8.0 版本正式推出 React Hooks 概念后，风势已经从原来的类组件猛地转向函数组件，这是一个在设计模式、心智模型层次，且非常...
点赞再看，养成习惯本文 GitHub [链接] 上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。
在后端篇中已对代码生成器的原理进行了详细介绍，同时也做了java和python版的实现。但是对于前端来说，仅靠后端提供的数据库元数据还是不足以满足代码生成的要求的，而且前后端分离后，个人还是想把代码生成的活独自交给前端维护，因此也为前端单独开发一个代码生成器。 前端代码生成原理 其实前端代码生成的原理和后...
背景：最近 fastjson 被爆出新的远程代码执行漏洞之后，赶紧督促项目组快马加鞭去修改（吐槽：真改不动，架不住项目既多又老），鉴于项目不同，依赖的 fastjson 版本也不同，本次着重谈 fastjson 1.2.16 版本遇到的那些问题？1 1 兼容性：低版本没问题，高版本抛异常 一、抛问题。 摘取部分代码...
1.格式化金钱值 const ThousandNum = num => num.toString().replace(/B(?=(d{3})+(?!d))/g, ","); const money = ThousandNum(20190214); // money => "20,190,214" 2.取整 代替正数的 Math.floor() ，代替负数的 Math.ceil() const num1 = ~~ 1.69; const n...
前端面试的那些事儿 ~ 深入浅出 webpack 之基础应用篇
前端工程化经历过很多优秀的工具，例如 Grunt、Gulp、webpack、rollup 等等，每种工具都有自己适用的场景，而现今应用最为广泛的当属 weback 打包了。因此 webpack 也自然而然成了面试官打探你是否懂前端工程化的重要指标。 由于 webpack 技术栈比较复杂，因此决定分以下几篇文章全面深入的讲解： 基础应用篇 ...
在使用 webpack 进行项目构建的过程中, 当我们的项目需求累积到一定层度的时候, 总是需要做一些构建优化,以及项目结构优化, 来保证页面加载的速度, 更好的用户体验. 以下我们将通过几个方面来了解 webpack 项目分析,以及更好的性能优化. 一、构建分析 1.1 打包速度分析 speed-measure-webpack-plugin ...
compression-webpack-plugin是一个非常好用的压缩插件，适用于vue-cli版本2以上， 安装的时候一定要带上版本号， 否则的话，版本太高 可能会报错。 npm install --save-dev compression-webpack-plugin@1.1.12 2.修改config下的index.js,将 productionGzip 改为true 3.修改build下的 webpack.prod.con...
完全和单输入框一样的操作，甚至可以插入覆盖：1，限制输入数字2，正常输入3，backspace删除4，paste任意位置粘贴输入5，光标选中一个数字，滚轮可以微调数字大小，限制0-96，123|456 自动覆盖光标后输入的字符，...
Spring Boot 集成 WebSocket 实现服务端推送消息到客户端
假设有这样一个场景：服务端的资源经常在更新，客户端需要尽量及时地了解到这些更新发生后展示给用户，如果是 HTTP 1.1，通常会开启 ajax 请求询问服务端是否有更新，通过定时器反复轮询服务端响应的资源是否有更新。 在长时间不更新的情况下，反复地去询问会对服务器造成很大的压力，对网络也有很大的消耗，如果...
在根目录下创建 vue.config.js ，做一些相应的配置 //为什么是module.exports，因为此文件的执行环境是node环境 module.exports={ publicPath:'/best-practice',//部署应用包时的基本URL devServer:{ port:port }, configureWebpack:{ // 想index.html注入标题 name:'vue最佳实践' ...
前言 大家在阅读这篇文章之前，不妨先阅读一下我的前面几篇文章作为前置知识： JavaScript中的作用域（系列三） JavaScript重的执行上下文（系列四） JavaScript之深入变量对象（系列五） 一、什么是闭包 顾名思义，遇见问题先问为什么是我们一贯的思维方式，我们尝试回答一下： 等于没说 ...
元编程是一种强大的技术，使你能够编写可以创建其他程序的程序。ES6借助代理和许多类似功能，使在JavaScript中利用元编程变得更加容易。ES6 Proxy（代理） 有助于重新定义对象的基本操作，从而为各种可能性打开了...
在vue组件的style标签内部有如下一段使用背景图片的css代码 background-image: url("../assets/img/icon_add.png"); 复制代码 在webpack中css-loader的解析配置如下 { test: /.(css|less)$/, exclude: path.resolve(__dirname, 'node_modules'), use: ['style-loader', 'css-l...
记一次GraphQL真正的详细入门（原生，koa2，vue中的实战, 建议收藏）分享会
从上面可以看出， name2 与 name3 其实我不想要， 那你传给我那么多数据干什么，单纯为了浪费带宽吗？但是吧。。也可理解为某些场景下确实很鸡肋，但是请求多了效果就厉害了。
1、.gitignore部分或全部不起作用清除本地库的缓存： git rm -r --cached .将本地代码重新加入： git add .并让.gitignore文件夹生效，读取我配置的过滤规则： git commit -m ‘update .gitignore’
“Any application that can be written in JavaScript, will eventually be written in JavaScript.” “任何可以用JavaScript编写的应用，最终都会用JavaScript来编写。” — Jeff Atwood, Author, Entrepreneur, Cofounder of StackOverflow JavaScript 的诞生 从浏览器的诞生说起 蒂姆&mid...
理解webpack中SplitChunksPlugin的作用
SplitChunksPlugin 在讲这个插件前，跟大家区分下chunk和bundle的概念， -- chunk理解为“代码块”，例如node_module下的module，或者你自己import入页面的自定义js。 -- bundle理解则可理解为已打包好的代码包，而代码包就是由很多chunk组成的了，就像vue-cli中build后会输出一个vender.js，这个js就是代码包了 ...
AJAX 作为前端中的核心部分，我们可能在工作中，只是搬瓦工的角色，所以只会在写业务的时候给后端发送一个 axios 、 fetch 等请求，拿到数据渲染到页面后就不管不顾了，但是作为一个不想只是搬砖的工程师，深入的了解它还是非常有必要的，这篇文章将带你深入了解 AJAX 关于ajax的基础知识 ajax: 即async javascript...
跟风微前端，看了一圈源码，觉得微前端并不适合公司目前的项目，例如css会有多次加载的问题等，而且我们也不会有juqery的库，所以将html解析成字符串动态插入并执行的路子在我这并非最优解，现在花点时间做一个共用的项目 #github https://github.com/757566833/react-vue 复制代码 库的结构 以react为主，vue辅...
electron-vue默认的配置是单页面应用，但是在这种情况下想实现多个窗口，即 同时打开aWin，bWin两个窗口， 且aWin窗口展示a.html，bWin窗口展示b.html。 复制代码 解决方案 1. 创建多页面 首先在renderer里创建两个Vue实例，为了方便管理，统一放到pages路径下。提出store统一管理这两个Vue实例，文件结构如图，...
提供想从事区块链开发的同学一篇入门实操案例，欢迎吐槽。 操作步骤 所有的操作都是在goland里面使用nodejs调web3库 编写合约 编译合约（web3）-用solc编译（拿到bytecode、abi） 部署合约（web3） 找到合约实例 调用合约（set，get操作） 开发环境 //安装淘宝的镜像 npm in...
掌握Git命令是每位程序员必备的基础，之前一直是用smartGit工具，直到看到大佬们都是在用Git命令操作的，回想一下，发现有些Git命令我都忘记了，于是写了这篇博文，复习一下~
本篇文章能带给你如下内容： - 了解key属性在diff算法中的的作用，以及我们在代码中改如何正确的给key赋值 - 深入diff算法的核心，理解“同层对比”到底是个什么鬼 复制代码 patch 函数 代码位于：vue项目的 src/core/vdom/patch.js return function patch (oldVnode, vnode, hydrating, removeOnly) { if (is...
这个面试题属于比较常见的面试题，但是我们在回答过程中但是还是有很多细节我们没有回答出来，那么接我们一起来探讨一下这个问题 为什么会出现深拷贝浅拷贝？ 由于 javascript 存储的方式是堆栈存储，在 javascript 中分为两类数据类型，一类是简单数据类型，一类是复杂数据类型 简单数据类型...
jvm-sandbox-repeater http 回放的 “陷阱” 与源码研读
使用任何一个新技术，必定要经过采坑的过程。一千个团队面临一万个场景，在不同的场景下审视同一个开源技术，一定会有不同的看法。我们基于开源，回馈开源，这才是开源的魅力。 repeater地址：https://github.com/alibaba/jvm-sandbox-repeater 本文所有源码分析基于commit id：0a1b47b2aae295a5c4627e533e7...
前言 JavaScript 中目前有 7 种基本（原始 primitives ）数据类型 Undefined ， Null ， Boolean ， Number ， String ， BigInt ， Symbol ，以及一种引用类型 Object ， Object 中又包括 Function ， Date ， JSON ， RegExp 等，除了 7 种原始类型，其他的所有能够用 new 实例化的内置类型...
ES6常用但被忽略的方法（第五弹Promise和Iterator）
ES6常用但被忽略的方法（第一弹解构赋值和数值） ES6常用但被忽略的方法（第二弹函数、数组和对象） ES6常用但被忽略的方法（第三弹Symbol、Set 和 Map ） ES6常用但被忽略的方法（第四弹Proxy和Reflect） 文章只整理作者本人认为一些日常开发可能会用到的一些方法或者使用技巧，细节深...
云开发JavaScript实战 | 如何使用 tcb-js-sdk 实现图片上传功能
tcb-js-sdk 让开发者可以在网页端使用 JavaScript 代码服务访问云开发的服务，以轻松构建自己的公众号页面或者独立的网站等 Web 服务。本文将以 实现图片上传功能 为例，介绍 tcb-js-sdk 的基本配置流程。你也可以在这里查到技术文档了解更多： cloudbase.net?from=10004 在使用云开发 Cloudbase 开发应用的过程中，...
简介 这一篇确实拖的比较久，上节讲了服务负载均衡实现，但是如果需要调用远程服务， 如何保证不是调用不会集中在一台服务上，如何确保远程服务调用的负载均衡？ 这就要实现 Consumer 端调用rpc的负载均衡。所以本文章主要讲解 RPC负载均衡算法实现 。 算法 下面介绍几个主要的负载均衡算法如何实现，可...
在后端篇中已对权限资源进行了分类：API接口、路由菜单、页面按钮。本文重点讲一下如何对这些权限资源进行分配并对不同的登录用户，根据权限的不同，呈现不一样的功能菜单、按钮进行统一处理。 关系梳理 用户与角色 多对多关系：一个用户可以拥有多个角色，一个角色包含多个用户 角色与菜单 多对多关系：一个角色有...
替代 webpack？带你了解 snowpack 原理，你还学得动么
近期，随着 vue3 的各种曝光，vite 的热度上升，与 vite 类似的 snowpack 的关注度也逐渐增加了。目前（2020.06.18）snowpack 在 Github 上已经有了将近 1w stars。 snowpack 的代码很轻量，本文会从实现原理的角度介绍 snowpack 的特点。同时，带大家一起看看，作为一个以原生 JavaScript 模块化为核心的年轻的...
【介绍】 又是一个来说说自检清单的无名选手，说多了都是学习。参考来自大佬出的 《一名【合格】前端工程师的自检清单》 ，每个题目不是只是简单回答了就没了，多的是想通过这几道问题，能够真的了解到它是怎么来的，因为自己也是在慢慢学习，当做笔记了。 希望当你看到最后，再回头看看自检清单的问题，脑子里知...
let 语句声明一个 「 块级作用域 」 的本地变量，且可选地将其初始化为一个值。 const 语句声明的 「 常量 」 是 「 块级作用域 」 ，与使用 let 语句定义的变量相似。常量的值 「 不能通过重新赋值来改变 」 ，且 「 不能重新声明 」 。 1.语法 ❝ ...
JavaScript异常报错处理：Uncaught TypeError: xxx is not a function
摘要 页面报错bug是常有的事，我们可以根据错误bug提示关键性的去修复问题。依稀的记得之前有个小伙伴询问了一个js异常的错误bug： Uncaught TypeError: xxx is not a function。 这个错误问题定位处理起来很快，但是我却不知其所以然。为了弄清楚报错的深层面原因，去调研了关于错误的解决方案。学习吸取别人的经验，...
最近很烦，干啥啥不行，吃喝玩乐第一名。可是自己又不是富家子弟！！！所以还得学习！！！在公司日常划水中，这时，我的领导走了过来，难道是有新需求了。我的心里还是很期待的，毕竟已经很久没活了。这时领导丢过来一个网址。 宝哥 你看看这个网站，能不能把上面的信息给我扒下来？一听到扒这个字我就觉得...
本文主要针对具有一定 JavaScript 经验的程序员。如果你对 Web 抓取有深刻的了解，但对 JavaScript 并不熟悉，那么本文仍然能够对你有所帮助。
因为所出标签太多，所以我们很难都用得上或者意识到需要用。 但其实也有许多有趣但是我们未曾发掘的标签，本文所要介绍的 便是一个。 <dataList> 是什么？ 标签一个类似于 标签一样可以通过包裹 来表示控件可选值的，唯一不同的就是 需要配合 来使用，而且 不表示任何内容，仅作展示。 我们...
提到 webpack，可以说是与我们的开发工程非常密切的工具，不管是日常开发、进行面试还是对于自我的提高，都离不开它，因为它给我们的开发带了极大的便利以及学习的价值。但是由于webpack是一个非常庞大的工程体系...
Dom(文档对象模型)是 针对 HTML 文档的一个 API. DOM 描述了一个层次化的节点树。 节点类型 Node 类型 javaScript中的所有节点类型都继承自 Node类型 , 因此所有节点类型都共享者相同的基本属性和方法 每个节点都有一个 nodeType 属性, 用于表明节点的类型。 节点类型由 Node 类型中定义的下列 12 个数值常量...
为什么要学函子 通过之前的学习我们已经学习了函数式编程的一些基础，但是我们还没有演示在函数式编程中如何把副作用控制在可控的范围内，以及如何进行异常处理、异步操作等。 什么是Functor 首先：是一个对象 容器：包含值和值的变形关系(这个变形关系就是函数) 函子：是一个...
使用懒加载原因 网站中使用图片是必不可少的，尤其是电商网站，举个栗子，一个商品列表最少60个商品，每个200K，实际上用户可能看了前面10来张，后面的就不看了，现在来计算一下，50*0.2M=10M，页面图片多，加载的图片就多。服务器压力就会很大。不仅影响页面渲染速度还会浪费带宽。按照刚刚列表计算，并发情况下，达...
js事件流：先捕获，其次处于目标阶段，最后冒泡。 事件代理：设置一个事件来处理一堆事件。 阻止事件冒泡：1.event.stopPropagation(仅阻止冒泡)2.在事件中返回false（阻止整个事件） 阻止默认事件：event.preventDefault. 3、js操作dom 创建：create 添加：append 删除：remove 替换：replace 插...
更多内容请关注公众号【前端开发博客】每日更新