zoukankan      html  css  js  c++  java
  • 前端学习方向

    基本功考察

    一.关于Html

    1、html语义化标签的理解、结构化的理解;能否写出简洁的html结构;SEO优化。
    根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于维护代码的同时让浏览器的爬虫和机器很好地解析。

    2、h5中新增的属性,如自定义属性data、类名className等;新增表单元素;拖拽Drag。

    3、h5中新增的API、修改的API、废弃的API稍作了解(离线存储、audio、video)。

    2.关于CSS

    1、CSS选择器(三大特性)。
    层叠性:浏览器解析CSS是从上至下,当CSS冲突时以最后定义的CSS为准。层叠性是指多种CSS样式的叠加。例如,当使用内嵌式CSS样式表定义<p>标记字号大小为12像素,链入式定义<p>标记颜色为红色,那么段落文本将显示为12像素红色,即这两种样式产生了叠加。
    继承性:继承就是子标签继承了上级标签的CSS样式的属性
    继承性是指书写CSS样式表时,子标记会继承父标记的某些样式.
    文本相关属性:font-family, font-size, font-style,font-weight, font, line-height,text-align,color 继承特殊性: <a href="#"> 无法继承父类的颜色 原因: <a href="">自己默认有颜
    h 标题标签不能继承父类设置文字大小


    优先级
    权重计算规则

    第一等:代表内联样式,如: style=””,权值为1000。

    第二等:代表ID选择器,如:#content,权值为0100。
    第三等:代表类,伪类和属性选择器,如.content,权值为0010。

    第四等:代表类型选择器和伪元素选择器,如div p,权值为0001。
    通配符、子选择器、相邻选择器等的。如*、>、+,权值为0000。
    继承的样式没有权值。
    2、BFC机制。
    创建BFC的方式很多,常见包括:
    float不为none的都可以(脱离文档流)
    overflow: hidden / auto
    position: 不为static 、 relative都可以
    display为inline-block,table-cell,table-caption,flex,inine-flex
    BFC渲染规则
    规则1: 创建了BFC的元素中,在垂直方向上的margin会发生重叠。根元素<html>就是一个BFC元素 (这个可以解释margin重叠)
    规则2: BFC元素在页面上是一个独立的容器,外面的元素和里面的元素互不影响。
    规则3: BFC元素不会和浮动的元素重叠。(这个可以解释两栏自适应)
    规则4: 计算BFC元素的高度时,里面浮动元素的高度也会参与计算 (用来解释overflow:hidden可以清除浮动)
    补充2点:
    关于margin的重叠规则。在现象二中,他们的重叠规则是,margin-bottom和margin-top会重叠,重叠之后取较大的margin值
    关于"清除浮动"的说法。实际上"清除浮动"的说法不太准确,因为清除浮动,你直接删掉float:left就行了。更准确的说是"闭合浮动",或者说清除浮动带来的副作用。
    3、盒模型。
    盒模型是有两种标准的,一个是标准模型,一个是IE模型。

    4、CSS模块化开发(封装);SCSS和LESS的使用。

    5、屏幕适配以及页面自适应。

    6、CSS3中新增的选择器。

    7、CSS3中新增的属性,transform、trasition、animation等。

    3.关于布局

    1、标准文档流(padding + margin + 负margin)+ 浮动float + 定位 left + right + top + bottom。

    2、百分比布局:px单位用%num代替,占父级元素的百分比。

    3、flex弹性布局:主轴、辅助轴的几个属性。

    4、grid栅格布局:使用框架中的类名来替代,本质上还是百分比布局。

    4.关于JS基础

    1、变量数据类型及检测:基本 + 引用。

    2、运算符:算术 + 条件 + 逻辑 + 位 + 短路、隐式转换等。

    3、条件、循环、异常处理if、switch(){case xxx:}、try、catch、finally、throw。

    4、函数定义、调用方式(apply、call、直接调用);传参:实参给形参赋值。

    5、字符串、数组、对象常用API。

    6、正则表达式。

    5.关于JS高级

    1、作用域、作用域链、闭包。

    2、原型、原型链、继承。

    3、函数上下文、this指向。

    4、js的运行机制、事件队列和循环。

    5、Ajax原理、axios库。

    6、同步、异步编程。

    7、jQuery源码学习。

    6.关于浏览器

    1、浏览器的构成和运行机制。

    2、浏览器内核。

    3、浏览器交互:BOM和DOM相关webApi、监听事件。

    4、浏览器缓存机制。

    5、浏览器的渲染原理。

    6、浏览器的安全性:跨域和攻击。

    7.关于网络协议

    1、HTTP协议。

    2、cookie、session、token。

    8.关于ES6语法

    1、字符串、数组、对象扩展的api。

    2、变量扩展:let、const解构赋值,块级作用域。

    3、函数扩展:箭头函数默认参数、rest参数。

    4、展开运算符、模板字符串。

    5、set和map数据结构。

    6、迭代器和生成器函数next和yield的理解。

    7、proxy对象属性代理器:属性的读取(get)和设置(set)相关操作。

    8、promise对象、异步编程的解决方案。

    9、async + await:异步编程的终极方案promise + generator的语法糖。

    10、class语法、构造函数的语法糖。

    11、模块化编程export + import的导出和导入。

    9.VUE基础

    1、基本指令。

    2、实例的属性和方法。

    3、实例的生命周期。

    4、组件基础:创建、注册、添加属性方法、套用等。

    5、组件通信传值,父子、兄弟、跨级。

    6、插槽slot等。

    10.VUE高级

    1、vue-router:搭建SPA

    路由、组件的配置。
    路由间的传值。
    路由跳转。
    路由的导航守卫。
    记住在router.js和组件页面中的使用方式。
    2、vuex:状态管理、数据仓库store

    实例化仓库的5大属性的使用。
    state、getters、mutations、actions、modules。
    辅助函数mapState等,仓库中计算属性的映射、方便操作。
    记住在store.js和组件中使用方式。
    11.VUE深入、源码阅读

    1、数据响应式原理。

    2、virtual dom。

    3、diff 算法。

    4、nextTick等等。

    工程能力考察

    1.项目能力

    1、vue-cli脚手架搭建和功能配置vue.config.js。

    2、webpack的常用配置。

    3、项目构建打包。

    4、熟悉各类框架的文档。

    5、UI框架:Bootstrap、MUI、Element-ui等。

    6、常用的插件整理;整理一个自己插件库,封装自己的方法库、组件库。

    7、常用的工具熟练度。

    8、PC端和移动端开发注意事项。

    9、经验总结:快速确定项目的技术选型。

    10、坑点总结:项目遇到坑坑坑!

    11、项目中的性能优化记录(都是细节点,多记录)。

    12、需求文档的理解,可以结合项目流程图、UML图。

    13、问题解决能力:bug定位调试、查找文档、寻求他人。

    14、记录习惯养成。

    2.模块化、组件化开发能力

    1、项目分类;各类文件整理、分类。

    2、各类功能封装。

    3、组件和功能模块的抽离、解耦、复用。

    内功考察

    1.面向对象的编程思想

    1、类的抽象。

    2、对象的封装、继承。

    3、为了更好的去管理数据、分类数据,实现高内聚、低耦合。

    2.设计模式

    设计模式感觉也是将面向对象思想再度抽象成现实中某些特定模式。

    3.数据结构和算法

    1、学习常用的排序搜索算法、顺序表、链表、栈、队列、树、堆等。

    2、考验你的抽象思维和数学功底。

    3、将现实需求抽象成计算机代码的思维能力。

    附加技能考察

    1.学习能力

    1、持续学习的态度——博客、笔记记录。

    2、技术论坛活跃度高、问答多。

    3、GitHub开源项目参与。

    2.了解一门后端语言

    1、python、node.js、php等。

    2、数据库mysql、redis、mongodb;sql的操作语句、mongodb的操作语句、redis的操作语句。

    3、node + express搭建本地服务等。

    4、python + django + request + scrapy。

    3.系统编程

    1、Linux命令行操作、系统文件管理。

    2、多任务、多线程、多进程、协程、并发、并行、串行、同步、异步等概念的理解。


    持续更新

  • 相关阅读:
    结构型模式(一) 适配器模式
    选择器
    CSS引入
    CSS语法
    CSS介绍
    HTML练习
    HTML标签嵌套规则(重点)
    HTML标签分类(重点)
    HTML标签属性
    body标签
  • 原文地址:https://www.cnblogs.com/lan-cheng/p/12934520.html
Copyright © 2011-2022 走看看