前端知识点汇总


一、 JS高级

1.作用域/作用域链

2.原型/原型链

3.闭包

4.This指向call/apply

5.javascript 运行机制

6.Ajax原理、Axios库

7.同步/异步编程

8.jQuery源码学习

二、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 的导入和导出

三、DOM

四、浏览器BOM

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

2.浏览器内核

3.浏览器交互:BOM和DOM相关的webapi、监听事件

4.浏览器缓存机制

5.浏览器的渲染原理

6.浏览器的安全行:跨域和攻击

五、模块化编程AMD/UMD/COMMONJS

1.

六、关于网络协议

1. http协议

2. cookie、session、token

七、HTML/CSS/LESS

1.HTML

1.1 Html语义化标签的理解、结构化的理解;

1.2 SEO优化

1.3 H5新增属性,如data、类名className;新增表单元素,拖拽drag

2. CSS

1、css选择器(三大特性)

2、BFC机制

3、盒子模型

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

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

6、css3中心轴的选择器

7、css3新增属性,transform、transition、animation等

4. 关于布局

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

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

3. flex弹性布局: 主轴、辅助轴的几个数学

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

八、NODE/EXPRESS


九、Webpack

1.打包原理

十、VUE

1.Vue双向绑定数据的原理

vue实现数据双向绑定主要是:采用数据劫持结合“发布者-订阅者”模式的方式,通过Object.defineProperty()来劫持各个属性的setter、getter,在数据变动时发布消息给订阅者,触发相应监听回调

2.解释单向数据流和双向数据绑定

单向数据流:顾名思义,数据流是单向的。数据流动方向可以跟踪,流动单一,追查问题的时候可以更快捷。缺点就是写起来不太方便。要使UI发生变更就必须创建各种action来维护对应的state。

双向数据绑定:数据直接是相通的, 将数据变更的操作隐藏在框架内部。优点是在表单交互较多的场景下,会简化大量与业务无关的代码。缺点就是无法追踪局部状态的变化,增加了出错时debug的难度

3.Vue 生命周期的理解

    beforeCreate: 在实例创建之前执行

    create:在实例创建、数据加载后,能初始化数据,DOM渲染之前执行

    beforeMount:虚拟dom已创建完成,在数据渲染前最后一次更改数据

    Mounted:页面、数据渲染完成,真实DOM挂载完成

    beforeUpdate:重新渲染之前触发

    Updated: 数据已更改完成,DOM也重新reder完成,更改数据会陷入死循环

    beforeDestory和destoryed:前者是销毁实例前执行(实例仍然完全可用),后者则是销毁后执行。

4.组件通信

4.1子组件通过props属性,绑定父组件数据,实现双方通信

4.2子组件向父组件通信

将父组件的事件在子组件通过$emit触发

4.3非父子、兄弟组件之间的数据传递

如:EventBus

5.v-if和v-show区别

使用v-if 的时候,如果值为false, 那么页面将不会有html标签生成

v-show则是不管值为true,还是false, html元素都会存在,只是css中display显示或隐藏

6.NextTick

$nextTick 是在下次DOM更新循环结束之后执行延迟回调,在修改数据之后使用$nextTick,则可以在回调中获取更新后的DOM

7.Vue组件data为什么必须是函数

因为js本身的特性带来的,如果data是一个对象,那么由于对象本身属于引用类型,当我们修改其中的一个属性时,会影响到所有vue实力的数据。如果将data作为一个函数返回一个对象,那么每一个实例的data属性都是独立的,不会相互影响了。

8.Computed/methods区别

我们可以将同一个函数定义为一个method或者一个计算属性。对于最终的结果,两种方式是相同的。

不同点:

-- computed:计算属性是基于它们的依赖进行缓存的,只有在它的相关依赖发生改变时才会重新求值

-- methods:只要发生重新渲染,method调用总会执行该函数

9.jQuery、vue有什么不同

Jquery专注视图层,通过操作DOM去实现页面的一些逻辑;vue专注于数据层,通过数据的双向绑定,最终表现在DOM层面,减少DOM操作。

Vue 使用了组件化思想,使得项目子集职责清晰,提高了开发效率,方便重复利用,便于协同开发

10.Vue中key的作用

Key的特殊属性主要用在vue的虚拟DOM算法,在新旧nodes对比时辨识VNodes。如果不使用key,vue会使用一种最大限度减少动态元素并且尽可能地尝试修复/再利用相同类型元素的算法。使用key,它会基于key的变化重新排列元素顺序,并且会移除key不存在的元素

有相同父元素的子元素必须有独特的key。重复的key会造成渲染错误

11.插槽slot

12.Vuex

13.Vue-router

搭建SPA单页应用

1.路由组件配置

2.路由间传参

3.路由跳转

4.路由导航守卫

14.Vue-cli

15.Vue 深入、源码阅读

1.数据响应式原理

2.Virtual dom

3.Diff算法

4.NextTick等等

十一、面向对象的编程思想

1、类的抽象

2、对象的封装、继承

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

十二、设计模式

1、常用设计模式:单例、工厂

十三、数据结构/算法

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

十四、系统编程

1.LINUX命令行操作、系统文件管理

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

十五、Canvas/Svg/D3.js (了解基本用法)

十六、GIT简单操作原理

十七、TypeScript(学习)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容

  • vue概述 在官方文档中,有一句话对Vue的定位说的很明确:Vue.js 的核心是一个允许采用简洁的模板语法来声明...
    li4065阅读 7,185评论 0 25
  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,044评论 0 29
  • 每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的: 实例生命周期钩子 每个 Vue 实例...
    Timmy小石匠阅读 1,371评论 0 11
  • 主要还是自己看的,所有内容来自官方文档。 介绍 Vue.js 是什么 Vue (读音 /vjuː/,类似于 vie...
    Leonzai阅读 3,324评论 0 25
  • 一:什么是闭包?闭包的用处? (1)闭包就是能够读取其他函数内部变量的函数。在本质上,闭包就 是将函数内部和函数外...
    xuguibin阅读 9,513评论 1 52