- 博客(87)
- 收藏
- 关注
RSS订阅
原创 前端面试集合-每日一题
HTML+CSS简单说下你理解的语义化，怎样来保证你写的符合语义化？HTML5语义化标签了解下？ DOCTYPE 的作用是什么 请描述下css盒模型基本概念 BFC是什么？触发BFC的条件是什么？有哪些应用场景？ 布局都有什么方式，float和position有什么区别？ CSS多列等高如何实现 说一下html布局元素的分类有哪些以描述下每种布局元素的应用场景么 displayposition和float的相互关系 margin和padding分别适合什么场景使用 说一
2023-05-02 03:40:06
211
原创 前端开发工程师-岗位职责-任职要求
5.熟悉页面架构和布局，对表现与数据分离、Web语义化等有深刻理解，对用户体验、交互操作流程、及用户需求有深入理解；7.技术视野广阔，有主导前端技术方案设计的能力和经验以及独立解决技术难题的能力，能够独立承担项目开发工作；1.参与前端框架和组件易用性改善，基础建设和推进新框架技术的落地，参与组件迭代，提高团队开发效率；6.具有良好的沟通能力及逻辑思维能力，能够承担一定的工作压力，具有较强的责任心和执行力；2.了解各种Web前端技术和标准、了解antd、React等主流开发技术框架，
2023-05-09 01:53:22
1020
原创 九、Vue3-Vue核心内容精讲
一、Vue3.0介绍1、Vue3.0介绍在学习Vue3.0之前，先来看一下与Vue2.x的区别会从如下几点来介绍源码组织方式的变化Composition API性能提升ViteVue3.0全部使用TypeScript进行重写，但是90%的API还是兼容2.x,这里增加了Composition API也就是组合API.在性能方面有了大幅度的提升，在Vue3.0中使用Proxy重写了响应式的代码，并且对编译器做了一定的优化，重写了虚拟DOM,让渲染有了很大的性能提升。同时官方也提供了一款
2023-05-09 01:49:10
513
原创 八、Vue源码解读-Vue核心内容精讲
一、Vue源码解析–响应式原理1、课程目标Vue.js的静态成员和实例成员初始化过程首次渲染的过程数据响应式原理2、准备工作Vue源码的获取项目地址：https://github.com/vuejs/vue为什么分析Vue2.6? 新的版本发布后，现有项目不会升级到3.0,2.x还有很长的一段过渡期。3.0项目地址https://github.com/vuejs/vue-next源码目录结构(在src目录下面定义的就是源码内容)：compiler: 编译相关（主要作用:就是把模板转
2023-05-09 01:47:07
496
原创 七、Vue常见面试题-Vue核心内容精讲
v-model是vue实现数据双向绑定最好的一个指令,v-model本质上不过是语法糖,它负责监听用户的输入事件以更新数据,当你修改页面的时候v-model自动去更新数据层 (model),当你修改数据的时候v-model自动去更新视图层 (view。
2023-05-09 01:46:19
193
原创 六、Vue服务端渲染-Vue核心内容精讲
渲染简单的理解就是将数据与模板拼接到一起。对我们前端开发人员来说，我们经常访问服务端的接口，获取数据。然后将获取到的数据通过模板绑定的语法绑定到页面中，最终呈现给用户，这个过程就是我们所说的渲染。</</一个基于Vue.js生态的第三方开源服务端渲染应用框架。它可以帮我们轻松的使用Vue.js技术栈构建同构应用。我们除了可以使用自动的配置以外，还可以配置其它的内容。首先看一下base的配置应用的根URL。举个例子，如果整个单页面应用的所有资源可以通过/app/来访问，那么base配置项的值需要设置为。
2023-05-09 01:43:42
292
原创 五、Vuex状态管理-Vue核心内容精讲
Vuex是专门为Vue.js设计的状态管理库。Vuex采用集中式的方式存储需要共享的状态。Vuex的作用是进行状态管理，解决复杂组件通信，数据共享的问题。什么情况下使用Vuex?非必要的情况下不要使用Vuex如果是小项目，并且不会涉及到大量组件的通信，不需要使用Vuex,使用反而增加了项目的复杂度。如果是开发大型的单页应用程序，这时会涉及到多个视图依赖于同一状态，并且来自不同视图的行为需要变更同一状态，这时就需要用到Vuex例如：我们后面所要实现的购物车案例。
2023-05-09 01:42:12
73
原创 在 Vue 中，如何实现 RBAC（权限系统）?
权限管理”一般在大家的印象中都属于后端的责任，但这两年随着 SPA 应用的兴起，很多应用都采用了前后端分离的方式进行开发，但是纯前端的开发方式就导致，以前很多由后端模板语言硬件解决的问题，现在势必要重新造一次轮子。而如果要重造轮子，前端er 就要根据对应的公司业务需求和后端er 一起配合，基于需求和安全性来考虑，来实现这个动态路由了。所以考虑到以上的痛点和具体的业务需求。今天我会模拟前端请求后端，获取用户权限，实现RBAC，带你从登录到验证、鉴权，最终实现动态 RBACRABC 的功能。
2023-05-09 01:38:16
1488
原创 后台系统的权限控制与管理-面试必问系列
此文章根据视频教程进行整理前端面试官必问系列-后台系统的权限控制与管理，建议搭配视频教程一起食用效果更佳在Web 系统中，权限很久以来一直都只是后端程序所控制的。为什么呢？因为Web 系统的不质围绕的是数据， 而和数据库最紧密接触的是后端程序。所以在很长的一段时间内， 权限一直都只是后端程序要考虑的话题。但是随看前后端分离架构的流行， 越来越多的项目也在前端进权限控制。
2023-05-09 01:35:37
555
原创 十、React-前端面试基础
当它们被删除后，将会只保留三个添加了UNSAVE_前缀的函数版本，作为向下兼容用途。因此我们在新项目中，要尽量避免使用这几个生命周期而使用最新的生命周期函数。⽬前 React 16.8+ 的⽣命周期分为三个阶段：挂载阶段、更新阶段、卸载阶段。：组件的构造函数，它会最先被执⾏，我们通常在构造函数⾥初始化state状态对象、或给⾃定义⽅法绑定：这是个静态⽅法，当我们接收到新的属性后想要去修改state时可以使用render。
2023-05-08 00:47:49
79
原创 求职步骤分解
自我介绍不是面试的一对一提问，没有必要强调自己经历中的每一个细节，反而会让面试官纠结琢磨这些细节，耗费思考时间。·对面试岗位的能力匹配程度，是要着重强调的，要让面试官最短的时间内get到你有哪些能力点需要被他考察。个人属性的作用是简单说明自己的背景，作为自我介绍的开端，内容较少，重点是简洁干练。——我是xxx，我之前在xxx公司任职xxx岗位，我的教育背景是xxx，进行过xxx专业的学习。这里的内容不多，也比较简单，唯一需要注意的是和自己面试岗位相关的专业学习需要提到，完全不相关的则没有必要提到。
2023-05-08 00:46:50
89
原创 321表达法
寺昆的321表达法01 逻辑力 感染力 共情力09 【OREO模型】电梯间对话老板，30秒说出亮眼信息10 【会议模型】会议中提出好点子，踊跃而不失优雅11 【JOBS模型】工作中正确求助领导，有效而不失尊重12 【秒懂公式】表达中要有对象感，专业术语接地气14 【RIDE模型】如何提议，甲方就能接受你的方案17
2023-05-08 00:45:20
204
原创 精准式表达法
先导课：怎样表达到位，让人一秒就能get你的意思第01课：说的多≠好事，一语中的才是关键第02课-理逻辑：3种思维模型，让你的话更易听懂第03课-删繁琐：巧用故事比喻，把复杂问题简单化第04课-效率为王：巧用短短一分钟，和陌生人一见如故第05课-有话直说：提出观点不兜圈，简短也能让人信服第06课-亲密关系： 4条正向沟通法，拨动对方心里的弦第07课-求职竞聘：答非所问太糟糕，5分钟学会漂亮回击第08课-方案展示：找准对
2023-05-08 00:44:07
56
原创 六、AJAX-JavaScript核心内容精讲
readyState是XMLHttpRequest对象的一个属性，用来标识当前XMLHttpRequest对象处于什么状态。readyState总共有5个状态值，分别为0~4，每个值代表了不同的含义：0：未初始化 — 尚未调用.open()方法；1：启动 — 已经调用.open()方法，但尚未调用.send()方法；2：发送 — 已经调用.send()方法，但尚未接收到响应；3：接收 — 已经接收到部分响应数据；4：完成 — 已经接收到全部响应数据，而且已经可以在客户端使用了；
2023-05-08 00:39:38
319
原创 五、DOM与事件-JavaScript核心内容精讲
1、选择器getElementById():通过id来查找对应的元素。getElementsByClassName():通过类名来查找对应的元素，返回的是一个HTMLCollection对象。getElementsByName():通过元素的name属性查找对应的元素，返回的是NodeList对象，它是一个类似于数组的结构。getElementsByTagName(): 通过标签的名称来查找对应的元素，返回的是HTMLCollection对象。querySelector：该选择器返回的是在基准元素
2023-05-08 00:39:11
127
原创 四、Virtual DOM的实现原理-核心内容精讲
Virtual Dom(虚拟DOM),是由普通的JS对象来描述DOM对象，因为不是真实的DOM对象，所以叫做我们为什么用虚拟DOM来模拟真实的DOM呢？因为我们知道一个DOM对象中的成员是非常多。所以创建Dom对象的成本非常高。如果使用虚拟Dom来描述真实Dom,就会发现创建的成员少，成本也就低了。
2023-05-08 00:36:37
119
原创 五、TCP协议-前端面试基础
DNS解析（域名解析服务器）将 域名 转换成 ip地址 (一个域名和ip的映射关系, 具体登记在哪里, 看我们如何申请关联的!假定请求的是 www.baidu.coma）首先会搜索浏览器自身的DNS缓存（缓存时间比较短，大概只有1分钟，且只能容纳1000条缓存）b）如果浏览器自身的缓存里面没有找到，那么浏览器会搜索系统自身的DNS缓存c）如果还没有找到，那么尝试从 hosts 文件里面去找 (一个系统电脑的文件, 可以编辑, 可以存 域名 和 ip 的对应关系)
2023-05-08 00:35:33
125
原创 四、HTTP协议-前端面试基础
对称加密的特点是文件加密和解密使用相同的密钥，即加密密钥也可以用作解密密钥，这种方法在密码学中叫做对称加密算法，对称加密算法使用起来简单快捷，密钥较短，且破译困难**通信的双⽅都使⽤同⼀个秘钥进⾏加密, 解密。**⽐如，两个人事先约定的暗号，就属于对称加密。
2023-05-08 00:35:12
126
原创 三、Vue响应式原理-核心内容精讲
Vue响应式原理1、课程目标模拟一个最小版本的Vue响应式原理在面试的常问问题实际项目中出现问题的原理层面的解决 给Vue实例新增一个成员是否是响应式的？ 给属性重新赋值成对象，是否是响应式的？为学习Vue源码做铺垫。2、数据驱动在实现整个Vue响应式代码之前，我们先来了解几个概念。第一个：数据驱动第二个：响应式的核心原理第三个：发布订阅模式和观察这模式我们先来看一下数据驱动的内容：数据响应式，双向绑定，数据驱动（我们经常看到这几个词）数据响应式：数据模型仅仅
2023-05-07 02:36:28
118
原创 二、Vue Router-核心内容精讲
Vue Router一、Vue Router 回顾1、路由简介路由是一个比较广义和抽象的概念，路由的本质就是对应关系。在开发中，路由分为： 后端路由 前端路由后端路由概念：根据不同的用户 URL 请求，返回不同的内容本质：URL 请求地址与服务器资源之间的对应关系[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0FUADVcu-1683296278715)(images/后端路由.png)]SPA（Single Page App
2023-05-07 02:32:44
250
原创 四、对象-JavaScript核心内容精讲
1、对象的属性给对象添加属性非常的简单如下所示：var person={ userName:'zhangsan'}如果想修改属性的特性，可以通过Object.defineProperty()来完成。 var person = { userName: "zhangsan", }; Object.defineProperty(person, "userName", { writable: false, });
2023-05-07 02:27:17
70
原创 三、函数-JavaScript核心内容精讲
但是，我们在实际的应用中很少使用构造函数来实现对函数的定义。原因是：构造函数每次执行时，都会解析函数体，并创建一个新的函数对象，所以当在一个循环或者是一个频繁执行的函数中去使用构造函数的时候，相对来说性能是比较低的。第二：通过构造函数创建的函数，并不遵循典型的作用域。arguments对象是所有函数都具有的一个内置的局部变量，表示的是函数实际接收到的参数，是一个类似数组的结构。下面我们说一下arguments对象都具有哪些性质。arguments。
2023-05-07 02:23:18
84
原创 七、ES6-JavaScript核心内容精讲
在这里告诉大家一个最简单的方法: **有一段代码是用大括号包裹起来的，那么大括号里面就是一个块级作用域**i <= 10;i ++) {i 这个变量的作用域只在这一对大括号内有效，超出这一对大括号就无效了。在ES6中允许使用 “箭头”（=>）来定义函数。先使用传统的方式定义一个函数。// 使用传统方式定义函数 let f = function(x , y) {通过上面的代码，可以发现传统方式来定义函数的时候，比较麻烦。箭头函数的使用。
2023-05-07 02:20:43
233
原创 六、DOM-前端面试基础
事件委托，就是利用了事件冒泡的机制，在较上层位置的元素上添加一个事件监听函数，来管理该元素及其所有子孙元素上的某一类的所有事件。示例。
2023-05-07 02:20:19
52
原创 二、CSS基础-前端面试题
考察: 性能优化的方案CSS Sprites，俗称雪碧图、精灵图。这是一种CSS图片合并技术，就是将CSS中原先引用的一些较小的图片，合并成一张稍大的图片后再引用的技术方案。它可以减少请求多张小图片带来的网络消耗（因为发起的HTTP请求数变少了），并实现提前加载资源的效果。
2023-05-07 02:16:09
97
原创 七、浏览器底层原理-前端面试基础
首先，同源是指资源地址的 “协议 + 域名 + 端⼝” 三者都相同，即使两个不同域名指向了同⼀ IP 地址，也被判断为⾮同源。下面是一些地址的同源判断示例：以下不同地址的页面, 去请求一个接口:同源策略是浏览器的一种⽤于隔离潜在恶意⽂件的重要安全保护机制!!!(服务器没有这个策略限制)<img><link>script。
2023-05-07 02:14:39
107
原创 八、前端工程化-前端面试题库
Babel 的主要工作是对代码进行转译。(解决兼容, 解析执行一部分代码)转译流程示意图：我们可以通过来查看 Babel 具体生成的 AST 节点。
2023-05-07 02:10:11
82
原创 二、引用数据类型-JavaScript核心内容精讲
引用类型有ObjectFunctionArrayDateMath等。引用类型与基本数据类型的区别:(1)引用数据类型的实例需要通过new关键字创建。(2)将引用数据类型赋值给变量，实际上赋值的是内存地址(3)引用数据类型的比较是对内存地址的比较，而基本数据类型的比较是对值的比较。
2023-05-06 06:52:17
60
原创 九、JavaScript性能优化-JavaScript核心内容精讲
如果程序在后续的执行中，发现某些对象不再被引用时就会被认为是垃圾JavaScript的执行引擎会回收这些垃圾对象所占用的内存空间，这个过程就是JavaScript的垃圾回收。(如果某个对象一直可以被访问使用，就不是垃圾，而这种可以被访问到的对象，我们称之为’可达对象’)所谓"可达对象"：指的就是可以被访问到的对象就是可达对象。第一个阶段，遍历所有对象，找到活动的对象，然后进行标记第二个阶段还是会遍历所有对象，并对没有标记的对象进行清除V8引擎的性能是非常高的。性能高的原因：第一：优秀的内存管理机制。
2023-05-06 06:50:38
46
原创 JavaScript异步编程-JavaScript核心内容精讲
一、Generator函数1、基本使用Generator函数也称之为生成器函数，可以用来生成迭代器，。也就是可以通过for…of来遍历Generator函数.并且Generator函数提供了一种异步编程的解决方案。生成器函数和普通函数不一样，普通函数是一旦调用就会执行完毕，但是生成器函数中间可以暂停，也就是执行一会歇一会。Generator函数的创建 function* go() { console.log(1);
2023-05-06 06:48:43
80
原创 九、Vue-前端面试题库
项目的介绍, 因人而异, 可以找不同的网站, 先从网站的功能业务角度出发, 去介绍然后思考: 如果是现在让你写这样的功能页面, 你会如何实现!然后手写记录下来, 推算合理性 (遇到什么问题, 怎么解决的!),逐步完善对于项目的介绍以饿了么为例:1 基本业务介绍: 给用户提供外卖服务的2 技术栈: vue2 + vuex + vue-router + webpack + ES6/7 + axios+ sass + flex + svg定位功能选择城市搜索地址。
2023-05-06 06:42:23
291
原创 一、Vue知识点串讲-Vue核心内容精讲
一、Vue知识点串讲复习一下Vue中的核心知识点。复习完基本的知识点以后，后面再来看一下其它的面试内容1、基本使用下面，先来看一段最简单的代码，如下所示：<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /&
2023-05-06 03:47:54
243
原创 使用webpack/脚手架搭建项目
创建一个 webpack.config.js 的配置文件用来配置webpack。补充：安装sass-loader失败时，大部分情况是因为网络原因。打开main.js,添加引入element-ui组件的代码，如下。安装自动打包功能的包:webpack-dev-server。打开App.vue，添加element-ui组件。打开App.vue，添加路由链接。
2023-05-06 03:46:15
387
原创 三、JavaScript基础-前端面试题库
变量提升（hoisting），是负责解析执行代码的 JavaScript 引擎的工作方式产生的一个特性。首先，对代码进行预解析，并获取声明的所有变量然后，将这些变量的声明语句统一放到代码的最前面最后，开始一行一行运行代码JS引擎将var a = 1分解为两个部分：变量声明语句和变量赋值语句a = 1JS引擎将放到代码的最前面，而a = 1保留在原地变量的这一转换过程，就被称为变量的声明提升。而这是不规范, 不合理的, 我们用的 let 就没有这个变量提升的问题。
2023-05-06 02:28:54
206
原创 一、Js基础-JavaScript核心内容精讲
在JavaScript中有3种方式来创建字符串，分别是字符串字面量，直接调用String( )函数，还有就是通过构造函数的方式。字面量字符串字面量就是直接通过单引号或者是双引号定义字符串的方式。注意：单引号和双引号是等价的。直接调用函数直接调用String( )函数，会将传入的任何类型的值转换成字符串类型。在转换的时候，需要遵循如下的规则：第一：如果是Number类型的值，则直接转换成对应的字符串。第二：如果是Boolean类型的值，则直接转换成字符串的"true"或者是"false"第三：如果值为。
2023-05-06 02:25:46
269
原创 文字环绕布局
基本图形函数circle()就是沿着圆形区域进行环绕、ellipse()就是沿着椭圆形区域进行环绕、polygon()就是沿着自定义的折线区域进行环绕，下面是结合clip-path属性（使用裁剪方式创建元素的可显示区域）完成的一个围绕三角形区域进行的文字环绕。利用CSS Exclusion模块可以实现类似于Word文档的方式，可以让文字四周环绕元素，不过CSS Exclusion模块目前浏览器的支持程度还不高，只能针对IE10+的浏览器起作用。CSS Shapes是一个CSS模块，用于定义几何形状。
2023-05-05 03:40:53
492
原创 响应式框架Bootstrap
Bootstrap是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的WEB项目。响应断点、栅格系统、交互实现等内容，在Bootstrap框架中都已经提供好了，只需要引入框架文件即可使用。进行下载。截止到目前最新的版本为 v5.0.x。
2023-05-05 03:28:38
328
原创 viewport视口
一般移动设备的浏览器都默认设置了一个viewport元标签，定义一个虚拟的布局视口（layout viewport），用于解决早期的页面在手机上显示的问题。iOS, Android 基本都将这个视口分辨率设置为 980px，所以PC上的网页基本能在手机上呈现，只不过元素看上去很小，一般默认可以通过手动缩放网页。上面截图中的方块为100px，但是在iphone6设备的默认视口下显示的非常小，因为默认视口为980px。
2023-05-05 03:23:33
57
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人