zoukankan      html  css  js  c++  java
  • 相关前端知识点总结

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

    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实现快速渲染 
    - 轻量级 
    - 响应式和组件化 
    - 服务器端渲染 
    - 易于集成路由工具,打包工具以及状态管理工具 
    - 优秀的支持和社区

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

  • 相关阅读:
    高级程序设计语言学习2
    程序设计语言学习
    基于Android,对硬件、框架、API、操作系统、应用程序的理解
    Python_code_使用OpenCV库对图片实现数据增强
    Python_code_使用ImageFilter库对图片实现数据增强
    Python_code_实现贴图功能
    Python_code_使用OpenCV库实现对图像的_平移_旋转_缩放
    Python_code_七段数码管绘制实现_happy-new-year
    3_一幅图像,经过傅里叶变换后,将高频部分删除,再进行反变换,设想一下将会得到什么结果?
    2_图像处理中正交变换的目的是什么?图像变换主要用于那些方面?
  • 原文地址:https://www.cnblogs.com/1833lljy/p/9090707.html
Copyright © 2011-2022 走看看