设计模式及HTTP基础

8月18日学习笔记

设计模式:

1.简单工厂模式:

设计一个单独的类来控制实例化的过程,这就是工厂。

核心思想:

将创建对象的操作单独封装,只对外留出接口,实现构造函数和创建者的分离。

分类:

  • 简单工厂模式:一个工厂对象用来创建同一类对象实例。
  • 工厂方法模式:建立抽象核心类,将创建实例的实际重心放在核心抽象大类的子类中(?)
  • 抽象工厂模式:对类的工厂抽象来创建产品类簇,不负责创建某一类产品的实例。

实例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
//Product
class Product{
constructor(proName){
this.proName=proName;
}
init(){
console.log('Initation '+this.proName)
}
}
//Product factory
class ProductFactory{
create(proName){
return new Product (proName);
}
}
let a = new ProductFactory();
let b=a.create('Ipad');
b.init(); //=>Initation Ipad

从中可以看出,工厂模式最直观的地方在于,创建对象不是直接通过创建产品类的对象实际,而是通过工厂方法实现。

在工厂模式中,每次创建新的对象实例时,只需要传入对应参数就能得到指定的对象。

应用场景:

(1)jQuery选择器$(Selector):

$(Selector)能直接实现new $(Selector)的效果,同时去除了new书写繁杂的弊端,且实现链式操作,代码简洁。
其底层实现如下:

1
2
3
4
5
6
7
8
9
class JQuery{
constructor(selector){
super(selector)
}
//..
}
window.$=function(selector){
return new JQuery(selector)
}

(2)Vue 异步组件:

1
2
3
4
5
6
7
Vue.componet('async',(resolve,reject)=>{
setTimeout (function(){
resolve({
template:'<div> I am template!</div>'
})
},1000)
})

前端基础:

1.HTTP协议:

HTTP方法:

  • HTTP1.0定义了GET,POST,HEAD方法

  • HTTP1.1新增了OPTIONS,PUT,DELETE,TRACE和CONNECT方法

    方法作用?

  • GET:请求服务器发送某些资源。

  • POST:通常是前端发送数据到后端。

  • HEAD:请求资源的头部信息,通常用在请求下载一个大文件前获取其大小再决定是否下载以节约带宽。

  • OPTIONS:用于获取目的资源支持的通信选项。

  • PUT:用于新增资源或者使用请求中的有效负载替换目标资源的表现形式(?)

  • DELETE:删除指定资源

  • PATCH:对资源进行更新(modified)

  • CONNECT:HTTP/1.1协议中预留给将连接改为管道方式的代理服务器。

  • TRACE:回显服务器收到请求。

    PUT和POST区别:

    PUT和POST方法区别在于,PUT方法是幂等的,连续调用多次效果相同,而POST为非幂等,且通常情况下PUT指向具体单一资源而POST指向资源集合。

举个例子,我们在开发一个博客系统,当我们要创建一篇文章的时候往往用POST https://www.jianshu.com/articles,这个请求的语义是,在articles的资源集合下创建一篇新的文章,如果我们多次提交这个请求会创建多个文章,这是非幂等的。
PUT https://www.jianshu.com/articles/820357430的语义是更新对应文章下的资源(比如修改作者名称等),这个URI指向的就是单一资源,而且是幂等的,比如你把『刘德华』修改成『蔡徐坤』,提交多少次都是修改成『蔡徐坤』

POST和PUT根本区别在于幂等性。

PUT和PATCH区别

PUT直接发送覆盖整个资源来进行修改,而PATCH只需要发送需要修改的部分。

HTTP状态码?

2XX 成功:

  • 200 OK,表示从客户端发来的请求在服务器端被正确处理
  • 201 Created 请求已经被实现,而且有一个新的资源已经依据请求的需要而建立
  • 202 Accepted 请求已接受,但是还没执行,不保证完成请求
  • 204 No content,表示请求成功,但响应报文不含实体的主体部分
  • 206 Partial Content,进行范围请求

3XX重定向:

  • 301 moved permanently,永久性重定向,表示资源已被分配了新的 URL
  • 302 found,临时性重定向,表示资源临时被分配了新的 URL
  • 303 see other,表示资源存在着另一个 URL,应使用 GET 方法定向获取资源
  • 304 not modified,表示服务器允许访问资源,但因发生请求未满足条件的情况
  • 307 temporary redirect,临时重定向,和302含义相同

4XX客户端错误:

  • 400 bad request,请求报文存在语法错误
  • 401 unauthorized,表示发送的请求需要有通过 HTTP 认证的认证信息
  • 403 forbidden,表示对请求资源的访问被服务器拒绝
  • 404 not found,表示在服务器上没有找到请求的资源
  • 408 Request timeout, 客户端请求超时
  • 409 Confict, 请求的资源可能引起冲突

5XX服务器错误

  • 500 internal sever error,表示服务器端在执行请求时发生了错误
  • 501 Not Implemented 请求超出服务器能力范围,例如服务器不支持当前请求所需要的某个功能,或者请求是服务器不支持的某个方法
  • 503 service unavailable,表明服务器暂时处于超负载或正在停机维护,无法处理请求
  • 505 http version not supported 服务器不支持,或者拒绝支持在请求中使用的 HTTP 版本

307,303,302区别?

302是http1.0状态码,在http1.1中细化302,分出了303和307。
303明确表示客户端应当采用get方法获取资源,会将POST请求变为GET请求重定向。
而307遵照浏览器标准,不会将POST转换为GET