前端的焦虑，你想过30岁以后的前端路怎么走吗？
转载一位技术前辈在 30 岁时所写的文章，原链接：
前端的焦虑，你想过30岁以后的前端路怎么走吗？https://juejin.cn/post/6844903615681806344
作者是我非常敬佩的一位技术前辈，这篇文章是他在 30 岁时候写下的，那时候是 2018 年。把原文转载于此，帮助更多的同志能提前 5 年，提前 10 年，看到自己的职业可能性，更提前的预判到自己可能遇到的问题，并为此提前做准备，笨鸟早飞，用时间差打出自己的职业竞争力。
前端的焦虑，你想过30岁以后的前端路怎么走吗？原因何在1.从客观原因来看，前端相对于后端的入门门槛确实低了不少。公司对前端的需求量虽然很旺盛，但是对前端的技术能力要求却不是很高，特别是一些小公司或者不是技术驱动的公司。这给人一种错觉，好像只需要懂一些js，会一般的html+css就能完成前端的工作。也由于这种原因，前端总是处于技术鄙视链的最底层。 2.从主观原因来说，前端平时基本都是和页面和看得到的UI打交道居多，对于后端的服务，数据存储，运维，部署等等懂得的不多，也导致了领导我们的往往都是后端。在大多数的情况下，你基本很难看到前端 ...
移动Web笔记
移动Webremrem单位rem:是一个相对单位，类似于em,不同的是rem的基准是相对于html元素的字体大小。
rem优点：可以通过修改html里面的文字大小来改变页面中元素的大小，可以整体控制
em：是一个相对单位，父元素的字体大小
实例：1234567891011121314151617<style> div { font-size: 12px; } p { width: 10em; height: 10em; }</style><body> <div> <p></p> </div></body>
1em=12px10em=120px
媒体查询语法:
顺序：
screen和and必须带上不能省略
px单位不能省略的
媒体查询+rem实现元素动态化大小变化引入资源：
媒体查询最好的方法：从小到大
针对不同的屏幕尺寸，调用用不同的css样式文件
当样式比较繁多的时候 ,我们可以针对不同的媒体使用不同 sty ...
call 和apply的作用与区别
首先先说明它们共同的作用：call和apply 都是用来修改函数中this的指向问题；
其次就是它们不同的传参方式：注意上一句话中说他们的作用时有两个关键词 ‘函数’和‘this’，想要修改this 的指向，那么必然有一个this修改后的指向，而函数必然后关系到传参问题：call方法可以传给该函数的参数分别作为自己的多个参数，而apply方法必须将传给该函数的参数合并成一个数组作为自己的一个参数：
eg:
1var name = 'Evan';var age = 20;var person = { name: 'Hillary', age: 19, sayIntroduce: function () { return "Hello, My name is " + this.name + " and I'm " + this.age + ' years old.' }, sayHobby: fun ...
10分钟理解ES6箭头函数
前言
面试中，ES6 是一大考点，当被问到箭头函数时，我们都会说：箭头函数很好用，而且再也不用操心 this 的指向了。面试官：箭头函数是挺好用的，那有哪些不适合使用箭头函数的场景呢？
箭头函数在大多数情况下，是很好用的，但是为什么在有些场景，使用箭头函数后会产生问题？是不是箭头函数还不够完善？又有哪些场景会发生问题？该如何解决呢？为了防止血案的产生，重新吧这一块拎出来整理巩固一下。
概念
ES6允许使用箭头（=>）定义函数，箭头函数提供了一种更加简洁的函数书写方式，箭头函数多用于匿名函数的定义；
箭头函数的注意点：
如果形参只有一个，则小括号可以省略；
函数体如果只有一条语句，则花括号可以省略，并省略return，函数的返回值为该条语句的执行结果；
箭头函数 this 指向声明时所在作用域下 this 的值；
箭头函数不能作为构造函数实例化；
不能使用 arguments；
特性
箭头函数的this是静态的，始终指向函数声明时所在作用域下的this的值；
不能作为构造实例化对象；
不能使用 arguments 变量；
箭头函数的写法为什么叫箭头函数( Ar ...
resetFields()方法重置表单无效的坑
问题重现在做后台在使用 element-ui 框架，开发过程中出现 resetFields表单无法重置的问题。因 “添加” 和 “编辑” 字段是一样的，所以我把它们放在了一个弹框表单里面，也节省了代码资源开销，如果你是分开写的弹框也就不会出现这个问题了。重现步骤：进入列表页后，先打开编辑框，然后打开新增框，新增框会填充第一次打开的编辑框内容
this.$refs[‘form’].resetFields()方法重置表单无效的坑
1、用法不对要想this.$refs[‘form’].resetFields()方法有效，必须配置el-form :model 属性和el-form-item中的prop属性，才可以。
注意：this.$refs[‘form’].resetFields()这个做法其实是重置表单到初始值，不是清空表单，当表单第一次在页面中渲染时所用的数据就是初始数据。
2、坑1在还没有显示对话框之前就调用this.$refs[‘form’].resetFields()，会报错。
解决方法：
123this.$nextTick(() => { this.$r ...
