美文网首页
前端笔试中容易碰到的知识点进行中

前端笔试中容易碰到的知识点进行中

作者: 白白白白白甲 | 来源:发表于2017-08-29 15:57 被阅读0次

    HTML/CSS

    1. Viewreport是meta属性,不是html5新增属性
    2. web表单登录中用到图形验证码的方式,服务器端生成验证码后一方面通过图片将验证码返回给客户端,同时在服务器端保存文本的验证码,由服务器端验证输入内容是否正确。
    3. obj.options[obj.selectedIndex].text获取表单select中被选择的文本。
    4. Readonly = true时,页面上不能更改,但是input值会随着表单提交。

      Disabled = true时,页面上不能更改,input值不会随表单提交。
    5. html5标准的链接默认都是带下划线的

      bootstrap链接只有在hover状态下才带下划线
    6. iframe可用在以下几个场景中:
      1. 典型系统结构,左侧是功能树,右侧就是一些常见的table或者表单之类。为了一个功能,单独分离出来,采用iframe。
      2. ajax上传文件
      3. 加在别的网站内容,例如gogle广告,网站流量分析。
      4. 在上传图片时,不用flash实现无刷新。
      5. 跨域访问的时候可以用到iframe,使用iframe请求不同域名下的资源。
    7. bootstrap3浏览器兼容
    bootstrap3兼容性.png
    1. bootstrap 屏幕兼容栅格参数
    屏幕兼容.png
    1. Ajax 与 flash区别

      1. Ajax的优势:
        1. 可搜索性
        2. 开放性
        3. 费用
        4. 易用性
        5. 易于开发。
      2. Flash的优势:
        1. 多媒体处理
        2. 兼容性
        3. 矢量图形
        4. 客户端资源调度
      3. Ajax的劣势:
        1. 它可能破坏浏览器的后退功能
        2. 使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中 ,不过这些都有相关方法解决。
      4. Flash的劣势:
        1. 二进制格式
        2. 格式私有
        3. flash 文件经常会很大,用户第一次使用的时候需要忍耐较长的等待时间
        4. 性能问题
    2. 置换元素与不可替换元素

      1. 置换元素:浏览器根据元素的标签和属性,来决定元素的具体显示内容。
      2. 不可替换元素:(x)html 的大多数元素是不可替换元素,即其内容直接表现给用户端(如浏览器)。例如: <label>label中的内容</label> 标签<label>是一个非置换元素,文字label中的内容”将全被显示。
    3. i++与++i的区别

      1. i++表示先把i传值给函数,然后再将i+1;
      2. ++i表示现将i+1再传值给函数
    4. 排序稳定性
      不稳定:快选堆希
      稳 定:插冒归基

    5. 使用 for in 循环数组中的元素会枚举原型链上的所有属性,过滤这些属性的方式是使用hasOwnProperty函数

      for in可以获取object的所有属性,包括自定义属性以及原型链属性。

      for(var attr in object){
        console.log(attr+":"object[attr]);
      } hasOwnProperty()只能获取自定义属性,无法获取原型链属性。

    6. JSONP的优缺点

      1. 优点
        1. 它不像XMLHttpRequest对象实现的Ajax请求那样受到同源策略的限制,JSONP可以跨越同源策略;
        2. 它的兼容性更好,在更加古老的浏览器中都可以运行,不需要XMLHttpRequest或ActiveX的支持
        3. 在请求完毕后可以通过调用callback的方式回传结果。将回调方法的权限给了调用方。这个就相当于将controller层和view层终于分开了。我提供的jsonp服务只提供纯服务的数据,至于提供服务以 后的页面渲染和后续view操作都由调用者来自己定义就好了。如果有两个页面需要渲染同一份数据,你们只需要有不同的渲染逻辑就可以了,逻辑都可以使用同 一个jsonp服务。
      2. 缺点
        1. 它只支持GET请求而不支持POST等其它类型的HTTP请求
        2. 它只支持跨域HTTP请求这种情况,不能解决不同域的两个页面之间如何进行JavaScript调用的问题。
        3. jsonp在调用失败的时候不会返回各种HTTP状态码。
        4. 缺点是安全性。万一假如提供jsonp的服务存在页面注入漏洞,即它返回的javascript的内容被人控制的。那么结果是什么?所有调用这个 jsonp的网站都会存在漏洞。于是无法把危险控制在一个域名下…所以在使用jsonp的时候必须要保证使用的jsonp服务必须是安全可信的。
    7. 行内块元素有,input textarea object img select,默认属性是inline-block。

    8. web storage有以下几种对象:

      1. sessionStorage:存储特定于某个会话的数据,该数据只保留到浏览器关闭。
      2. globalStorage:目的是跨越会话存储数据,不过要指定哪些域可以访问该数据。如果不使用 removeItem() 或 delete 删除,或者用户未清除浏览器缓存,存储在globalStorage上的数据会一直保留在磁盘上。所以globalStorage非常适合在客户端存储文档或长期保留用户偏好设置。
      3. localStorage:在HTML5中作为持久保持客户端数据的方案取代了globalStorage。它不能被指定访问规则,要访问localStorage,页面必须来自同一个域名,使用同一种协议,在同一个端口上。它的数据也保留到通过JavaScript删除或用户清除浏览器缓存。
    9. 函数加括号与不加括号的区别
      简单来说,fun是调用整个函数,fun()得到的的是函数调用之后的返回值。

      所以在setTimeOut(fun,500)或者addEventListener('click',fun)中调用的都是函数,所以不能加括号。

      而setTimeOut如果加引号的话,就是要加括号生效。setTimeOut('fun',500).

    10. dom2规定的时间流包括三个阶段:1. 事件捕获 2. 处于目标阶段(事件处理) 3. 事件冒泡阶段

    11. 各种存储方案简单对比

      • Cookies:浏览器均支持,容量为4KB
      • UserData:仅IE支持,容量为64KB
      • Flash:100KB,非HTML原生,需要插件支持
      • Google Gears SQLite:需要插件支持,容量无限制
      • LocalStorage:HTML5,容量为5M
      • SessionStorage:HTML5,容量为5M
      • globalStorage:Firefox独有的,Firefox3开始就不支持这个方法。
        UserData仅IE支持,Google Gears SQLite需要插件,Flash已经伴随着HTML5的出现退出了历史舞台,因此现在主要需要了解的只有:Cookie,LocalStorage,SessionStorage;
    12. JavaScript中只有函数作用域的概念,没有块级作用域的概念。
      class="lang-js">var msg='hello'; for (var i=0; i<10; i++) { var msg='hello'+i*2+i; } alert(msg);
      输出结果为hello189,而不是hello。

    13. var x = new Boolean(false); 此时的x为object,所以if(x)为true。如果var y = Boolean(0);此时的y为false是布尔值,所以if(y)为false。

    14. console.log(Number("")); //0
      console.log(Number(null)); //0
      console.log(Number(undefined)); //NaN

      console.log(parseInt("")); //NaN
      console.log(parseInt(null)); //NaN
      console.log(parseInt(undefined)); //NaN

      console.log(null == 0); //false
      console.log(undefined == 0); //false

      • 一个promise可能有三种状态:等待(pending)、已完成(fulfilled)、已拒绝(rejected)
      • 一个promise的状态只可能从“等待”转到“完成”态或者“拒绝”态,不能逆向转换,同时“完成”态和“拒绝”态不能相互转换
      • promise必须实现then方法(可以说,then就是promise的核心),而且then必须返回一个promise,同一个promise的then可以调用多次,并且回调的执行顺序跟它们被定义时的顺序一致
      • then方法接受两个参数,第一个参数是成功时的回调,在promise由“等待”态转换到“完成”态时调用,另一个是失败时的回调,在promise由“等待”态转换到“拒绝”态时调用。同时,then可以接受另一个promise传入,也接受一个“类then”的对象或方法,即thenable对象。
      1. DNS就是将域名翻译成IP地址。
      2. 主要用UDP,但是当请求字节过长超过512字节时用TCP协议,将其分割成多个片段传输。
      3. DNS协议默认端口号是53。
      4. 操作系统的DNS缓存:windows DNS缓存的默认值是 MaxCacheTTL,它的默认值是86400s,也就是一天。macOS 严格遵循DNS协议中的TTL。
      5. 游览器的DNS缓存:chrome对每个域名会默认缓存60s;IE将DNS缓存30min;Firefox默认缓存时间只有1分钟;Safari约为10S。
    15. typeof Symbol() //"symbol"
      typeof Number() //"number"
      typeof String() //"string"
      typeof Function() //"function"
      typeof Object() //"object"
      typeof Boolean() //"boolean"
      typeof null //"object"
      typeof undefined //"undefined"

    16. var bb = 1;
      function aa(bb) {
      bb = 2;
      alert(bb);
      };
      aa(bb);
      alert(bb);
      弹出2,1;因为传入了参数bb,所以虽然bb在函数体内没有用var定义,但是依然作用后被销毁,若改成
      <pre>var bb = 1;
      function aa(bb) {
      var bb = 2;
      alert(bb);
      };
      aa(bb);
      alert(bb);</pre>
      则弹出2,2,。

    17. JavaScript原始数据类型:String,Null,Undefined,Boolean,Number,Symbol(ES6新增)。
      基本数据类型:String,Null,Undefined,Boolean,Number,Symbol(ES6新增);

    相关文章

      网友评论

          本文标题:前端笔试中容易碰到的知识点进行中

          本文链接:https://www.haomeiwen.com/subject/wdnodxtx.html