前端最菜-CSDN博客

原创 21届前端实习生面试回顾

大致情况 9.5号到的深圳，7号周一开始面试，到今天面了9家公司了，总体来说，大点的公司面试体验非常好。现在准备在一家互联网金融公司实习。面试准备 1.带好简历，即使有的公司会打印。 2.带上笔记本（最好）讲项目的时候可以问下面试官愿不愿意看，有实际的东西讲起来会比较轻松。 3.可以带支笔（预备） 4.我反正每天都带了伞，深圳最近上午有雨，下午天晴的 5.自我介绍，不要说的太多，基本情况说清楚，会的技术栈，可以介绍下学习的方法，时间等面试高频题尽可能回忆 1.tcp udp 区别 2.跨域 3.事件代

2020-09-11 17:15:21 1431

原创前端查漏补缺全知识点合集（更新中9.3）

该篇文章用于本人查漏补缺，会有大量知识点，不定期更新，有人愿意看就随便看看。 HTML CSS JS ES6 VUE 小程序移动端混合APP uniapp webappp 网络知识面试

2020-07-31 23:34:22 794 2

原创前端异步方案（callback、promise、generator、async\await）解释

1. 回调函数（callback） setTimeout(() => { // callback 函数体 }, 1000) 缺点：回调地狱，不能用 try catch 捕获错误，不能 return 回调地狱的根本问题在于：缺乏顺序性：回调地狱导致的调试困难，和大脑的思维方式不符嵌套函数存在耦合性，一旦有所改动，就会牵一发而动全身，即（控制反转）嵌套函数过多的多话，很难处理错误 ajax('XXX1', () => { // callback 函数体 ajax

2020-07-26 21:45:41 512

原创接口如何防止被刷

接口如何防刷 1：网关控制流量洪峰，对在一个时间段内出现流量异常，可以拒绝请求 2：源ip请求个数限制。对请求来源的ip请求个数做限制 3：http请求头信息校验；（例如host，User-Agent，Referer） 4：对用户唯一身份uid进行限制和校验。例如基本的长度，组合方式，甚至有效性进行判断。或者uid具有一定的时效性 5：前后端协议采用二进制方式进行交互或者协议采用签名机制 6：人机验证，验证码，短信验证码，滑动图片形式 ...

2020-07-15 22:53:45 5350 3

原创重绘与回流详解及优化处理方案

1. 浏览器渲染机制浏览器采用流式布局模型（Flow Based Layout）浏览器会把HTML解析成DOM，把CSS解析成CSSOM，DOM和CSSOM合并就产生了渲染树（Render Tree）。有了RenderTree，我们就知道了所有节点的样式，然后计算他们在页面上的大小和位置，最后把节点绘制到页面上。由于浏览器使用流式布局，对Render Tree的计算通常只需要遍历一次就可以完成，但table及其内部元素除外，他们可能需要多次计算，通常要花3倍于同等元素的时间，这也是为什么要避免使用

2020-07-13 00:07:18 1162

原创 display、visibility、opacity区别

display: none; DOM 结构：浏览器不会渲染 display 属性为 none 的元素，不占据空间；事件监听：无法进行 DOM 事件监听；性能：动态改变此属性时会引起重排，性能较差；继承：不会被子元素继承，毕竟子类也不会被渲染； transition：transition 不支持 display。 visibility: hidden; DOM 结构：元素被隐藏，但是会被渲染不会消失，占据空间；事件监听：无法进行 DOM 事件监听；性能：动态改变此属性时会引起重绘，性能较高；

2020-07-11 20:02:55 502

原创一道有意思的Promise题，看看你会吗？

宏队列微队列来试试你写的对不对 setTimeout(()=>{ console.log(0) },0) new Promise((resolve,reject)=>{ console.log(1) resolve() }).then(()=>{ console.log(2) new Promise((resolve,reject)=>{ console.log(3) resolve() }).then(()=>{ consol

2020-07-10 22:42:33 633

原创 ES5语法的加强和总结

严格模式 'use srtict' JSON对象略 Object 扩展 Object.create(prototype,[descriptors]) 作用：以指定对象为原型创建新的对象为新的对象指定新的属性，并对属性进行描述 value:指定值 writable:标识当前属性值是否可以修改默认false configurable 标识当前属性是否可以被删除默认false enumerable 标识当前属性是否可以枚举（for in）默认false Object.defineProper

2020-07-06 14:50:46 238

原创记录一次在css 中使用calc遇到的坑

css3 calc()方法大坑运算符前后要加空格("*" 和 “/” 时，其前后可以没有空格，但建议保留) 在使用scroll 时想要把顶部的内容保留一部分，在这里用计算，但是怎么都没有效果，结果自己蠢哭了，一定要记录一下，花了好久好久才看出来~wuwuwu。 “-”号前面和后面一定要加空格，加空格加空格加了空格就有效果了顺便总结一下calc() 可以使用百分比、px、em、rem等单位运算，可以混合使用各种单位进行运算。 ...

2020-07-05 23:51:04 680 3

原创圣杯布局和双飞翼布局

圣杯布局 <!DOCTYPE html> <html> <head> <title>圣杯</title> <style type="text/css"> *{ margin: 0; padding: 0; } header{ width: 100%; height: 100px; background-color: #f4f4f4; } footer{ width: 100%;

2020-06-29 21:24:59 197

原创 flex布局总结

一、Flex 布局是什么？ Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。 display : flex display: inline-flex;//行内元素方式归纳采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。它的所有子元素自动成为容器成员，称为 Flex 项目（flex item），简称"项

2020-06-29 17:30:51 264

原创 normalize.css源码及解释

Normalize.css Normalize.css 使浏览器呈现所有 HTML 元素更加一致，并且符合现代 web 标准。Normalize.css 只作用于需要规范化的样式。作用保留有用的默认值，不同于许多 CSS 的重置纠正错误和常见的浏览器的不一致性标准化的样式，适用范围广的元素浏览器支持 Google Chrome (latest) Mozilla Firefox (latest) Mozilla Firefox ESR Opera (latest) Apple Safari 6+

2020-06-21 16:37:11 792

原创前端容易踩的坑，你中了吗？

前端踩的坑，你中了吗？样式问题 1、父元素设置了border-radius，子元素应用了transform，并且父元素设置了overflow:hidden，但是却失效？ // 给父元素设置 { position:relative; z-index:1; } 复制代码 2、设置input 文本框的 placeholder 的颜色 input::-webkit-input-placeholder{ color:rgba(144,147,153,1); } 复制代码 3、如何设置b

2020-06-10 13:07:20 482

原创前端安全问题

XSS XSS是什么 XSS是一种经常出现在web应用中的计算机安全漏洞，它允许恶意web用户将代码植入到提供给其它用户使用的页面中。比如这些代码包括HTML代码和客户端脚本。攻击者利用XSS漏洞旁路掉访问控制——例如同源策略(same origin policy)。这种类型的漏洞由于被黑客用来编写危害性更大的网络钓鱼(Phishing)攻击而变得广为人知。对于跨站脚本攻击，黑客界共识是：跨站脚本攻击是新型的“缓冲区溢出攻击“，而JavaScript是新型的“ShellCode”。示例： <s

2020-06-09 16:38:15 363