相关前端知识点总结

摘要：学习中，遇到的相关知识点总结，后续继续补充。

1，@keyframes,

     通过@keyframes规则可以创建动画，创建对话的原理是将一套css样式逐渐变化为另一套样式，在动画过程中能够多次改变这套css样式。以百分比来规定改变发生的时间，或者通过关键词from和to，等价于0%和100%，0%是动漫的开始时间，100%是动漫的结束时间。举例如下：

@keyframes   myMove { 0%  {top:0px;}

                                         50%  {top: 100px}

                                         100%  {top: 0px}

                                       }

注：在一个动画中可以改变多个css样式，也可以多次改变多个css样式。

2，Object.keys()方法会返回一个给定对象自身的可枚举属性组成的数组（不包括原型上的可枚举属性）；

      for  ....in..也返回一个可枚举属性组成的数组，包括数组中的属性包括对象自身和原型上的；

      Object.getOwnPropertyNames()  返回一个由对象中所有的自身属性构成的数组（包括不可枚举的）。

3，jQuery中的get()和eq()的区别

      eq()返回的是一个jquery对象，get()返回的是一个html对象数组。

4，ArrayList和LinkedList的区别

     ArrayList保存所有的元素包括null,

                     优点：根据索引可以快速访问数据，缺点：指定索引位置插入删除慢。

      LinkedList链表结构保存对象，

                      优点：便于插入删除，缺点：随机访问效率低。

5， 排序算法中哪些是稳定的，哪些是不稳定的？

       稳定排序：冒泡排序、直接插入、二分法插入、表插入、归并排序和基数排序；

      不稳定排序：快速排序、选择排序、堆排序、shell插入排序。

6， 数据的逻辑结构包括：线性结构、树、图、集合这四种，其中线性结构又包括：线性表、栈和队列等等。

7， 数组方法

      原数组不改变的方法有：slice()、subString()、subStr()、join()、concat()、forEach()、map()、filter()；

      改变原数组的方法有：push()、pop()、shift()、unshift()、sort()、reverse()、splice()

8，JS的typeof运算符的结果可能为：string，number，boolean，undefined，object，function，symbol(es6新加)

9， 除了数组和对象，其他类象的数据都可以通过简单的赋值进行克隆，包括函数的克隆（复制），函数的克隆会在内存中单独开辟一块空间，互不影响。而数组和对象有浅克隆和深克隆之分。

10， Http状态码五种不同的类型所代表的含义(服务器响应状态)

         1XX临时/信息响应（表示临时响应，并需要请求者继续执行操作）；
         2XX成功（服务器成功处理了请求）；
         3XX重定向（表示要完成请求，需要进一步的操作）
         4XX客户端/请求错误
         5XX服务器错误

11，请求头和响应头

        请求报文包括：请求行、请求头部、空行和请求数据；

        响应报文包括：状态行、响应头部和响应正文

12， 形成BFC(块级格式化上下文)的条件

        1) 浮动元素，float除none以外的值；2）绝对定位元素，position(absolute,fixed); 3）display为以下其中之一的值：inline-block,table-cell,table-captions;4)overflow除了visible以外的值（hidden,auto,scroll）

13， react.js和vue.js的异同(通过网上看了多篇文章总结而成)

     概念：

React 是一个用于构建用户界面的 JAVASCRIPT 库。React主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图）。React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。

React 特点

• 1.声明式设计 −React采用声明范式，可以轻松描述应用。

• 2.高效 −React通过对DOM的模拟，最大限度地减少与DOM的交互。

• 3.灵活 −React可以与已知的库或框架很好地配合。

• 4.JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ，但我们建议使用它。

• 5.组件 − 通过 React 构建组件，使得代码更加容易得到复用，能够很好的应用在大项目的开发中。

• 6.单向响应的数据流 − React 实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单。

Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的渐进式框架。Vue 只关注视图层， 采用自底向上增量开发的设计。Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。vue.js是一个javascript mvvm库，它是以数据驱动和组件化的思想构建的。

相似处：

 1.使用虚拟dom

2.提供了响应式和组件化的视图组件

3.关注核心库，伴随于此，有配套的路由和负责处理全局状态管理的库

相似之处详解：

1）Vue.js(2.0版本)与React的其中最大一个相似之处，就是他们都使用了一种叫'Virtual DOM'的东西。它的诞生是基于这么一个概念：改变真实的DOM状态远比改变一个JavaScript对象的花销要大得多。Virtual DOM是一个映射真实DOM的JavaScript对象，如果需要改变任何元素的状态，那么是先在Virtual DOM上进行改变，而不是直接改变真实的DOM。当有变化产生时，一个新的Virtual DOM对象会被创建并计算新旧Virtual DOM之间的差别。之后这些差别会应用在真实的DOM上。如果你的应用中，交互复杂，需要处理大量的UI变化，那么使用Virtual DOM是一个好主意。如果你更新元素并不频繁，那么Virtual DOM并不一定适用，性能很可能还不如直接操控DOM。

2）React与Vue都鼓励组件化应用。这本质上说，是建议你将你的应用分拆成一个个功能明确的模块，每个模块之间可以通过合适的方式互相联系。

3）他们都是JavaScript的UI框架，专注于创造前端的富应用。不同于早期的JavaScript框架“功能齐全”，Reat与Vue只有框架的骨架，其他的功能如路由、状态管理等是框架分离的组件。

不同点：

      1） Vue,js更适合小型项目，react.js适合大型项目的开发；

       2）vue是双向数据绑定,react是单向数据流。

      3）状态管理 vs 对象属性，应用中的状态是（React）关键的概念，在React中你需要使用setState()方法去更新状态。在Vue中，state对象并不是必须的，数据由data属性在Vue对象中进行管理，在Vue对象中，data参数就是应用中数据的保存者。对于管理大型应用中的状态这一话题而言，Vue.js的作者尤雨溪曾说过，（Vue的）解决方案适用于小型应用，但对于对于大型应用而言不太适合。

     4） React与Vue最大的不同是模板的编写。Vue鼓励你去写近似常规HTML的模板。写起来很接近标准HTML元素，只是多了一些属性。另一方面，React推荐你所有的模板通用JavaScript的语法扩展——JSX书写

     5）vue和react.js最大不同之处在于它们对DOM的渲染方式不同，vue可以直接在vue文件中使用html标签，数据绑定时类似angular，可以进行条件渲染，而react.js则采用了jsx语法，运用虚拟DOM 的概念进行，DOM对页面元素进行渲染，获取页面元素需要用ref来获取。

Vue致力解决的问题与React一致，但却提供了另外一套解决方案。Vue使用模板系统而不是JSX，使其对现有应用的升级更加容易。

Vue主要是由一位开发者进行维护的，而不像React一样由如Facebook这类大公司维护。

注：4）和5）有点啰嗦，合二为一。我简单理解为：两者最大区别是，Vue编写常规的html模板，使用模板系统对DOM进行渲染，而react使用jsx语法，运用虚拟DOM 的概念，对DOM和页面进行渲染。

14， 解决老浏览器不支持ES6的方法有哪些？

     1.使用最新的浏览器。比如谷歌或者火狐。但是最新的浏览器可能也会出现部分新特性无法支持的情况。所以就产生了第二种解决方案，也是当前最普遍用的最多的方案。

 

   2.语法解析转换工具。什么是语法解析转换工具呢？语法转换工具就是将我们写的es6的语法转换成es5，相当于在es6和浏览器之间做了一个翻译的作用，因为es5出来较早，浏览器对es5的支持还是没有任何问题的，所以这样就部分解决了es6的兼容问题了。如今也没有任何一款工具能完美的将es6转换成es5，所以不建议在生产环境中使用支持度较低的新特性。

 

 

 

小结

总结一下，我们发现， 
- Vue的优势包括： 模板和渲染函数的弹性选择；简单的语法及项目创建 ；更快的渲染速度和更小的体积 ；
- React的优势包括： 更适用于大型应用和更好的可测试性 ； 同时适用于Web端和原生App ；更大的生态圈带来的更多支持和工具 
   实际上，React和Vue都是非常优秀的框架，它们之间的相似之处多过不同之处，并且它们大部分最棒的功能是相通的： 
- 利用虚拟DOM实现快速渲染 
- 轻量级 
- 响应式和组件化 
- 服务器端渲染 
- 易于集成路由工具，打包工具以及状态管理工具 
- 优秀的支持和社区

 

 

 

 

 

 

作为学习的一个记录，后续会不断添加总结。