前端面试题系列(1)

2021-08-12
阅读 7 分钟
1.9k
要求实现去访问目标对象example中不存在的属性时,抛出错误:Property "$(property)" does not exist (2018 今日头条)

JS防抖和节流

2021-06-19
阅读 4 分钟
4.9k
防抖函数的应用场景:防抖是指,触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间。常见场景有:键盘输入实时搜索时input事件防抖,浏览器窗口改变resize事件防抖等等。
封面图

Linux安装nginx及部署Vue项目

2020-12-26
阅读 6 分钟
18.6k
可以使用xshell工具连接服务器,或者某个命令行工具都行(gitbash,cmd ...)。使用命令行工具执行以下命令连接服务器,root是用户名,8.129.38.87 是你的服务器公网IP,然后输入密码即可。

[fed-task-03-05]Vue.js 3.0 Composition API 及 3.0 原理剖析

2020-11-29
阅读 2 分钟
1.5k
简答题1、Vue 3.0 性能提升主要是通过哪几方面体现的?Vue 3.0 性能提升:(1)响应式系统升级Vue.js 2.x 中响应式系统的核心是 Object.definePropertyVue.js 3.0 中使用 Proxy 对象重写了响应式系统可以监听动态新增的属性可以监听删除的属性可以监听数组的索引和 length 属性(2)编译优化Vue.js 2.x 中通过标记静态根...

[fed-task-03-02]Vue源码-响应式、虚拟 DOM、模板编译和组件化

2020-08-08
阅读 6 分钟
1.7k
(2)new Vue():初始化结束之后,调用 vue 构造函数。构造函数中调用了 this._init() ,这个方法相当于vue的入口,最终调用 vm.$mount() ;

[fed-task-03-01]手写 Vue Router、手写响应式、虚拟 DOM 和 Diff 算法

2020-08-02
阅读 6 分钟
2.5k
在 Vue 中可以通过 Vue.set( target, propertyName/index, value ) 或者 this.$set( target, propertyName/index, value ) 的方式为 target 对象动态添加响应式数据。Vue 2.x 中的原理是:类似于调用 defineReactive(obj, key, val) 方法,利用 Object.defineProperty 的 getter 和 setter 实现响应式数据。

[fed-task-02-02]模块化开发、Webpack与规范化标准

2020-07-07
阅读 9 分钟
2.1k
(2)开始编译根据上一步得到的最终配置初始化得到一个 compiler 对象,注册所有的插件 plugins,插件开始监听 webpack 构建过程的生命周期的环节(事件),不同的环节会有相应的处理,然后开始执行编译。

[fed-task-02-01]开发脚手架及封装自动化构建工作流

2020-06-21
阅读 8 分钟
2.8k
简答题 1、谈谈你对工程化的初步认识,结合你之前遇到过的问题说出三个以上工程化能够解决问题或者带来的价值。 工程化是一个可以提升开发体验、提高开发效率和质量的规划或者工作流架构,一切以提高效率、降低成本、质量保证为目的的手段都属于工程化。 工程化带来的价值: 开发时可以使用 ES6+ 新特性,通过工程化的手...

[fed-task-01-02]函数式编程与 JS 性能优化

2020-06-05
阅读 8 分钟
2k
引用计数的工作原理:设置对象的引用数,有一个引用计数器来维护这些引用数,引用关系改变时修改引用数。判断当前对象引用数是否为0,引用数为0时立即回收。

[fed-task-01-01]ES 新特性、异步、TypeScript

2020-05-26
阅读 5 分钟
2.4k
原因:for 循环时是使用 var 定义循环变量 i (存在变量提升),然后依次为 a 数组元素赋值为一个函数,函数内打印 i;循环结束后调用 a[6]() ,相当于在全局环境下打印 i,而此时 i 已经变为 10。

使用DllPlugin优化webpack打包性能(基于vue-cli)

2020-05-04
阅读 6 分钟
6.7k
打包会输出一个类 dll 包(dll 包源于 windows 的动态链接库),这些代码本身不会执行,主要是提供给我们的业务代码引用。(比如 dll 中有一个工具方法为获取本月日期数组,这个方法本身并不会执行,但是当我们的业务中需要获取本月日期时,就会引用这个方法在我们的业务中执行相关逻辑)。

vue权限管理实现流程

2020-04-20
阅读 9 分钟
11.4k
后端返回用户权限,前端根据用户权限处理得到左侧菜单;所有路由在前端定义好,根据后端返回的用户权限筛选出需要挂载的路由,然后使用 addRoutes 动态挂载路由。

JS原理:xx函数/功能内部实现是怎样的?

2020-04-12
阅读 4 分钟
1.3k
首先要从以下几点来考虑如何实现这几个函数:不传入第一个参数,那么上下文默认为 window改变了 this 指向,让新的对象可以执行该函数,并能接受参数

JS数组的reduce()方法还能这么用?

2020-04-06
阅读 4 分钟
2.6k
Array.prototype.reduce() reduce() 方法对数组中的每个元素执行一个reducer函数(升序执行),将其结果汇总为单个返回值。 {代码...} 一、语法 {代码...} 1.参数callback执行数组中每个值(如果没有提供 initialValue,则第一个值除外)的函数,包含四个参数: accumulator累计器累计回调的返回值; 它是上一次调用回调...

实现一个符合Promise/A+规范的Promise

2020-03-24
阅读 3 分钟
1.5k
简要介绍:Promise允许我们通过链式调用的方式来解决“回调地狱”的问题,特别是在异步过程中,通过Promise可以保证代码的整洁性和可读性。

这几个Promise的输出到底是?

2020-02-19
阅读 3 分钟
1.3k
A. print message once B. print message twice C. Unhandled Promise Rejection Warning D. process exits

JSON.stringify 居然还能这样用?

2019-11-16
阅读 2 分钟
2.2k
JSON.stringify 这个 API 想必大家都用过,可以帮助我们将数据解析成字符串类型,如下的例子: {代码...} 想必这样的写法大家都知道,但是其实 JSON.stringify 总共接受三个参数。 第二个参数可以传入一个数组或者函数。 先来看下传入数组结果会是什么? {代码...} 可以看到,当传入数组的时候,只有数组内的属性名才会...

前端知识整理2

2019-10-04
阅读 21 分钟
2.3k
1.ES6 模块化如何使用,开发环境如何打包?语法: import export (注意有无 default 的区别)环境: babel 编译 ES6 语法,模块化可用 webpack 和 rollup扩展: 说一下自己对模块化标准统一的期待rollup 功能单一(只做模块化的打包编译),webpack 功能强大

关于 JSON.parse(JSON.stringify(obj)) 实现深拷贝的一些坑

2019-09-05
阅读 3 分钟
22.9k
在js中,怎么用一行代码实现深拷贝?它可以实现: JSON.parse(JSON.stringify(obj))。这行代码的运行过程,就是利用 JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse来反序列化(还原)js对象;序列化的作用是存储和传输。(对象本身存储的是一个地址映射,如果断电,对象将不存在,所以要将对象的内容...

Vue 换肤方案验证

2019-08-27
阅读 4 分钟
3.5k
本文的换肤方案灵感来自于 element-ui 需求:网站换肤,主题切换。网站的主题色可以在几种常用颜色之间进行切换,还有相关图片、图标也要跟随主题进行切换。 不多说,先看下最终的实现效果: 文章由两部分组成:css切换,图片图标切换 css切换 1.在 static 目录下新建一个 styles 文件夹,在 styles 下新建一个 theme.sc...

ES6 模块化和 .vue组件的应用举例

2019-07-23
阅读 3 分钟
2.5k
以下部分内容引用阮一峰老师的《ECMAScript 6 入门》这一章节ES6 模块与 CommonJS 模块的差异开始之前,必须了解到,ES6 模块与 CommonJS 模块完全不同。主要有两个差异。

css overflow-scroll-with-padding (Webkit VS Firefox)

2019-06-13
阅读 2 分钟
4.8k
场景:有一个容器,宽高一定,有内边距,当容器的内容(子元素)超出容器时出现滚动条。这一场景在 Chrome 和 Firefox(IE)表现不一致,border-box 布局。代码如下:

前端知识整理1

2019-04-03
阅读 15 分钟
2k
1.浮动布局实现方法:左栏、右栏分别左右浮动,定宽300px,中间设置左右margin撑开左右两栏需要占据的位置,html结构顺序为:左栏、右栏、中间。缺点:浮动元素脱离文档流,需要清除浮动,如果处理不好,会导致很多问题(影响前后标签、父级标签的位置及 width height 属性)。优点:比较简单,兼容性比较好。只要清除浮...

关于JSON.parse()和JSON.stringify()的性能小测试

2019-03-13
阅读 5 分钟
12.2k
JSON.parse(JSON.stringify(obj))我们一般用来深拷贝,其过程说白了,就是利用 JSON.stringify 将js对象序列化(JSON字符串),再使用JSON.parse来反序列化(还原)js对象。至于这行代码为什么能实现深拷贝,以及它有什么局限性等等,不是本文要介绍的,想要了解它的局限性可以阅读这篇文章 关于 JSON.parse(JSON.string...

基于vue.js 2.0表单验证vuelidate插件介绍及使用

2019-01-23
阅读 5 分钟
8.7k
官网:[链接]Github:[链接] 具体的安装方法和项目引入使用就不说了,官网说的很清楚。下面直接上例子 一、简单介绍 先简单看下main.js 做了什么 测试用的页面:test-page.vue 1、$v values 属性和值 刷新页面,在浏览器上可以看到如下结果 {代码...} 2、$v methods 方法 {代码...} 3、validations 验证配置项 注意:所...

【JS基础】模块化,页面加载,性能优化,前端安全

2018-12-19
阅读 4 分钟
2.3k
(1)中文解释:异步模块定义(async module define) (2)require.js 就是根据AMD规范写的 [链接](3)全局 define 函数(4)全局 require 函数(5)依赖JS会自动、异步加载(使用到的文件才会加载)

【JS基础】DOM,BOM,事件绑定,ajax,跨域,存储

2018-12-19
阅读 4 分钟
1.9k
常说的JS(浏览器执行的JS)包含两部分 JS基础知识(ECMA 262 标准) JS-Web-API(W3C 标准) JS-Web-API的内容包括 DOMBOM事件绑定ajax请求(包括http协议)存储 W3C 标准没有规定任何JS基础相关的东西。W3C不管变量类型、原型、作用域和异步,只管定义于浏览器中JS操作页面的API和全局变量。 DOM DOM(Document Object ...

【JS基础】异步和单线程

2018-12-19
阅读 1 分钟
1.3k
同步和异步的区别是什么? js是单线程的,只能同时做一件事,所以就需要异步同步会阻塞代码执行,而异步不会alert是同步,setTimeout是异步 {代码...} {代码...} 何时需要异步?在可能发生等待的情况,等待过程中不能像alert一样阻塞程序进行。因此,所有“等待的情况”都需要异步。 前端使用异步的场景有哪些? 定时任务:...

【JS基础】作用域和闭包

2018-12-18
阅读 3 分钟
1.2k
变量提升的理解 js语言的执行规则:先定义,后执行变量定义、函数声明就属于定义代码的范畴(注意“函数声明”和“函数表达式”的区别) 说明this几种不同的使用场景 this 要在执行时才能确认值,定义时无法确认 {代码...} 全局环境下的this {代码...} 对象方法中的this {代码...} 构造函数中的this {代码...} 事件函数中的t...

【JS基础】原型和原型链,构造函数

2018-12-18
阅读 2 分钟
1.1k
5条原型规则 所有的引用类型(数组、对象、函数),都具有对象特性,即可自由扩展属性(除了"null")以外 所有的引用类型(数组、对象、函数),都有一个__proto__ (隐式原型)属性,属性值是一个普通的对象 所有的函数,都有一个 prototype (显式原型)属性,属性值也是一个普通的对象 所有的引用类型(数组、对象、...