2021春招冲刺-12.30 POST与GET | JS异步任务 | 判断变量类型

2021春招冲刺

12.30日

1.计网 |

OSI七层协议分别是什么、TCP/IP四层协议分别是什么

> 在前面复习计网的总结中已经介绍过，链接见第一章第五部分网络体系结构

POST和GET区别

• Http中的幂等:
  　　指一次和多次请求某一个资源应该具有同样的副作用。在get中不会改变资源的状态，不论调用一次还是N次都没有副作用，这里强调的是一次和N次具有相同的副作用，而不是每次GET的结果相同。
  　　而POST所对应的URI并非创建的资源本身，而是资源的接收者。比如使用POST请求创建一个新帖子，两次相同的POST请求会在服务器端创建两份资源，它们具有不同的URI；所以，POST方法不具备幂等性。
  

• GET

  • 用来向服务器请求资源，没有副作用。
  • 是幂等的，可以被缓存。
  • 浏览器将GET请求的数据放入URL中，用户直接可以看到。
  • 请求的数据只允许ASCII字符，因为数据在URL中，URL中只允许ASCII字符
  • url有长度限制- > http协议规范中对url没有规定参数上线，一般是浏览器的限制。IE对URL长度的限制是2083字节，其余浏览器理论上没有限制，取决于操作系统的支持。

• POST

  • 是非幂等的,不可缓存。POST请求会修改资源产生副作用，缓存旧资源没有意义。
  • POST请求更加安全，数据被放入body中，用户无法直接看见
  • 由于数据放入body中，支持更多的编码类型，且不对数据做限制

以上这些区别都是浏览器以及Web服务器遵循HTTP的约定实现的,并不是GET和POST的本质区别。

而从报文的角度看，GET方法和POST方法本质没有太大区别，仅仅报文格式以及方法名称不同。他们都是HTTP报文，而HTTP是基于TCP/IP做数据传输的，因此在传输层，他们的传输方式没有任何的区别。

仅仅在约定中，GET方法的数据被放入URL，而POST报文的数据被放入body就是格式上的区别。但是这也不是绝对的，因为get请求依旧支持body中存放数据，在编码过程中，应当养成良好的习惯并遵守规定。

---

2.JS |

判断变量类型的方式有几种

• typeof
  不会对object的具体类型进行返回，如数组对象还是json对象
  未定义 undefined；布尔 boolean; 字符串 string; 数值 number; 对象或者null object ；函数 function;

• toString.call
  Object.prototype.toString,是Object原型对象上的一个方法,该方法默认返回toString运行时this指向的对象类型, 返回的类型格式为[object,xxx]

  toString.call('')         //[object String]
  toString.call(8)          //[object Number]
  toString.call(true)       //[object Boolean]
  toString.call(undefined)  //[object undefined]
  toString.call([])         //[object Array]
  toString.call({q:8})      //[object Object]
  toString.call(window)     //[object global]
  

• instanceof
  用于测试构造函数的prototype属性是否出现在对象的原型链中的任何位置

  var a = [1,2,3,4,5];
  a instanceof Array; //true
  
  function Cat() {}
  var  BlueCat= new Cat();
  console.log(BlueCat instanceof Cat);       // true
  

• constructor
  我们在2020-12-29中的原型与原型链中已经提到过constructor,他是对象所特有的属性，指向该对象的构造函数。
  但用在判别对象类型时，缺点是无法检测null，undefined。因为他们是无效的对象，不存在constructor

    var a = new Array;
    a.constructor === Array // true
  
    var n = new Number(3);
    n.constructor === Number; // true
  
    function Tree(name) {
    this.name = name;
    }
    var theTree = new Tree("Redwood");
    console.log( theTree.constructor );   //function Tree(name){this.name=name}
  

异步任务有哪些

javascript是单线程。单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。
而异步任务指的是，不进入主线程、而进入"任务队列"的任务，只有等主线程任务执行完毕，"任务队列"开始通知主线程，请求执行任务，该任务才会进入主线程执行。

• 定时器 setTimeout()、setInterval()、setImmediate()、process.nextTick()
  注意：js的事件循环（event loop）机制使得异步事件即使设置等待事件为0，也依旧会等主流程中的事件运行结束再运行消息队列中的微任务与宏任务。
• ajax异步 几乎所有的接口都是异步的（也有对应同步接口）
• 事件绑定 Object.observe
• async function 声明定义的异步函数
  异步函数可以包含await表达式，该表达式暂停异步函数的执行 并等待 Promise的执行结果返回，结果返回后就恢复异步函数的执行。
• Promise
  是一个对象，可以保存状态，并将异步操作队列化，按照期望的顺序执行，返回符合预期的结果

---

3.html/css | 实现一个箭头

html代码:

<p>小箭头</p>
<div class="to_right"></div>
<p>大箭头</p>
<span class="textline"></span>
<span class="text"></span>

css代码：

.to_right {
    width: 0;
    height: 0;
    border-left: 10px solid #cccf;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
}
.text{
    display: inline-block;
    border-top: 2px solid;
    border-right: 2px solid;
    width: 80px;
    height: 80px;
    border-color: #EA6000;
    transform: rotate(45deg);
    margin: 50px 0 0 0px;
}
.textline
{
    width: 120px;
    height: 40px;
    display: inline-block;
    border-top: 2px solid;
    border-color: #EA6000;
    margin: 50px -100px 0 0px;
}

实现效果：