总结

作者: zzzZink | 来源:发表于2018-05-09 20:31 被阅读0次

    移动端是怎么做适配的?

    1.meta viewport

    <meta name="viewport" content="width=device-width, user-scalable=no,
        initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    

    2.媒体查询(media query)
    在link标签内使用media

     <link rel="stylesheet" media="(max-width: 500px)" href="mobile.css">
    

    在CSS内使用media

    @media (max-width: 450px){  /*屏幕宽度0—450px*/
        body{
            background: red;
        }
    }
    @media (min-width:451) and (max-width: 645px){ /*屏幕宽度451—645*/
        body{
            background: black;
        }
    }
    @media (min-width: 646px){ /*当屏幕宽度大于等于646时*/
        body{
            background: gray;
        }
    }
    

    3.动态rem方案
    rem:1rem的大小等于根元素(html)的font-size。
    使用JS动态调整rem

    <meta name="viewport" content="width=device-width, user-scalable=no, 
    initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
     <script>
         var pageWidth = window.innerWidth
         document.write('<style>html{font-size:'+pageWidth/10+'px;}</style>')
     </script>
    

    使用sacc编译css
    node-sass -wr scss -o css

     @function px( $px ){
          @return $px/$designWidth*10 + rem;
        }
    
        $designWidth : 640;
    
        .child{
          width: px(320);
          height: px(160);
          margin: px(40) px(40);
          border: 1px solid red;
          float: left;
          font-size: 1.2em;
        }
    

    什么是闭包,闭包的用途是什么?

    什么是闭包:
    函数内部的子函数能够读取到函数的变量就是闭包

    function f1(){
        var x = 1
        function f2(){
            x++
            return x
        }
        return f2
    }
    var foo = f1()
    foo() //2
    

    上面的代码就是闭包,因为创建了全局变量foo,函数f2赋值给foo,所以函数f2存在内存中,而f2依赖于f1,所以f1也一直存在与内存中,函数f1中的变量就不会被销毁。
    闭包的作用:
    1.读取函数内部的变量。
    2.当函数执行完毕时,函数内的变量会被立即销毁,闭包能够将变量一直保存在内存中。

    call、apply、bind 的用法分别是什么?

    call方法可以指定函数内部this指向的作用域,并在指定作用域中运行该函数。
    apply方法的作用与call相似,区别在于apply接收的参数是数组,示例如下:

    function add(a,b){
        return a+b
    }
    add.call(add,1,2) //3
    add.apply(add,[1,2]) //3
    

    bind方法将返回一个新的函数,当新函数被调用时 this 值绑定到 bind() 的第一个参数

    x = 9
    var f = {
      x: 81,
      getX: function() { 
        return this.x
        }
    }
    f.getX() //81
    var obj = f.getX
    obj() //9  将obj()改下为下面的代码
    obj.call(undefined) //9 因为创建了全局变量x,此时this指向的是window,所以返回值是9
    obj = f.getX.bind(f)
    obj() //81 使用bing绑定了this的作用域,再调用obj()返回81
    

    HTTP状态码

    参考HTTP状态码详解

    请写出一个 HTTP post 请求的内容,包括四部分。
    其中
    第四部分的内容是 username=ff&password=123
    第二部分必须含有 Content-Type 字段
    请求的路径为 /path

     POST /path HTTP/1.1
     Host: www.baidu.com
     User-Agent: curl/7.55.0
     Accept: */*
     Content-Length: 24
     Content-Type: application/x-www-form-urlencoded
    
    username=ff&password=123
    

    常见排序算法思路

    参考此处

    一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?

    输入URL之后:
    1.域名解析:

    • 浏览器缓存:先查找浏览器缓存,查询是否有该域名对应的IP。
    • 系统缓存:如果浏览器缓存没有对应ip,则从HostS文件查找是否有该域名和对应的IP.
    • 路由器缓存:如果系统缓存也没有,则到路由器缓存查找
    • ISP DNS缓存:
    • 如果以上都没有找到,则到根域名服务器查找域名对应的IP。

    2.TCP连接:拿到I服务器IP地址之后,开始与服务器建立连接,通信连接过程分为三个过程(三次握手):

      1. 客户端:我要连接你了,可以吗。
      1. 服务端:嗯,我准备好了,连接我吧。
      1. 客户端:那我连接你咯。
      1. 开始后面步骤

    3.浏览器发出请求,服务器响应请求
    4.浏览器处理请求

    • 浏览器根据HTML和CSS计算得到的渲染树,绘制在屏幕上,JS会被执行。

    5连接结束

    如何实现数组去重?

    要求:
    1.不要做多重循环,只能遍历一次
    2.请给出两种方案,一种能在 ES 5 环境中运行,一种能在 ES 6 环境中运行(提示 ES 6 环境多了一个 Set 对象)
    ES5:

    function unique(arr){
        var temp_arr = []
        var hash = {}
        for(let i = 0; i < arr.length; i++){
            if(hash[arr[i]] === undefined){
                temp_arr.push(arr[i])
                hash[arr[i]] = true
            }
        }
        return temp_arr
    }
    

    ES6:

    function unique(arr){
        return [...new Set(arr)]
    }
    

    相关文章

      网友评论

          本文标题:总结

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