欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

总结

程序员文章站 2022-04-21 21:39:26
...

移动端是怎么做适配的?

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)]
}