专业技能
一般来说,面试官会根据你的简历内容去提问,但是技术基础还有需要自己去准备分类,形成自己的知识体系的。简单列一下我自己遇到的一些题
- HTML+CSS
- JavaScript
- 前端框架
- 前端性能优化
- 前端监控
- 模块化+项目构建
- 代码管理
- 信息安全
- 网络协议
- 浏览器
- 算法与数据结构
- 团队管理
- 开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
最近得空把之前遇到的面试题做了一个整理,包括我本人自己去面试遇到的,还有其他人员去面试遇到的,还有网上刷到的,我都统一的整理了一下,希望对大家有用。
其中包含HTML、CSS、JavaScript、服务端与网络、Vue、浏览器等等
由于文章篇幅有限,仅展示部分内容
//定义全局主题&颜色的map数组,鉴于V5只有白天和晚上的主题,此处仅定义这两种
//切记 所有颜色一式两份儿,务必保证key值统一,key值可以自定义,注意避免$%_之类的,
//与sass自有符号冲突,见文知意即可
//data-theme为dark时,样式引用dark
/* theme variable */
$themes: (
// light
light:
(
// light theme
color-primary: #3961f5,
color-primary-second: #5e81f7,
color-text-primary: #242f57,
color-success: #04b78a,
color-warning: #f2a626,
color-danger: #ee2e6b,
background: #fff,
background-content: #f4f7fc,
background-color: #eaedf7,
),
//dark theme
dark:
(
color-primary: #3961f5,
color-primary-second: #5e81f7,
color-text-primary: #ffffff,
color-danger: #ee2e6b,
background: #1d2742,
background-content: #13192f,
background-color: #1d2742,
)
);
这里定义了一个map–$themes,分别存放对应主题的颜色变量集合。
注意,scss文件名建议用下划线开头,如_themes.scss,防止执行时被编译成单独的css文件,详参sass中文教程(3.1 sass文件导入)。
2.定义另外一个sass文件_handle.scss来操作1中的$theme变量(当然两个文件可以合并,分开写是想把配置和操作解耦),上代码:
@import “@/style/_themes.scss”;
//此处用了sass的map遍历、函数、map存取、混合器等相关知识,
//详细API参考https://www.sass.hk/docs/
//遍历主题map
@mixin themeify {
@each $theme-name, $theme-map in $themes {
//!global 把局部变量强升为全局变量
$theme-map: $theme-map !global;
//这步是判断html的data-theme的属性值 #{}是sass的插值表达式
//& sass嵌套里的父容器标识 @content是混合器插槽,像vue的slot
[data-theme=“#{$theme-name}”] & {
@content;
}
}
}
//声明一个根据Key获取颜色的function
@function themed($key) {
@return map-get($theme-map, $key);
}
//暂时想到的常用的开发场景下面三种背景颜色、字体颜色、边框颜色 至于阴影什么之类的忽略了
//获取背景颜色
@mixin background_color($color) {
@include themeify {
background-color: themed($color);
}
}
//获取字体颜色
@mixin font_color($color) {
@include themeify {
color: themed($color);
}
}
//获取边框颜色
@mixin border_color($color) {
@include themeify {
border-color: themed($color);
}
}
可以根据自己的使用场景自定义混入器,上面只定义了三个常用的,更改主题无非是更改背景&边框&字体等的颜色。
3.具体在vue中使用,直接引入对应混入器就好,取哪个颜色,传哪个key,就这么简单
打开全栈工匠技能包-1小时轻松掌握SSR
两小时精通jq+bs插件开发
生产环境下如歌部署Node.js
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
网易内部VUE自定义插件库NPM集成
谁说前端不用懂安全,XSS跨站脚本的危害
webpack的loader到底是什么样的?两小时带你写一个自己loader