myJS
  • 说明
  • js核心
  • 函数式编程
    • 链式优化
    • 你真的知道函数吗?
    • 纯函数
    • 函数柯里化
  • 内存的那些事
    • 栈内存和堆内存
    • 垃圾回收机制-GC
    • 闭包恍然大悟
      • 运行时的词法作用域
    • 数据结构基于内存
    • 怎样用chrome devtool 查看内存泄漏状况
    • dom元素的内存泄漏例子讲解
  • 网络请求
    • 原生js请求
    • https了解一下
    • 跨域方法
    • 你不知道的浏览器页面渲染机制
    • 聊点 TCP 干货(1)
  • 异步编程
    • await 和 async
  • 服务器
    • nginx
  • 模块化编程
    • commonJs模块
    • ES模块
    • AMD模块
    • CMD模块
    • module.exports与export那些事儿
  • webpack
    • 环境变量的使用
      • node配置
      • webapck配置
    • postcss处理css
    • webpack-dev-server
    • HMR热更新原理
    • babel配置
      • 转化es6
      • Runtime transform/runtime
    • extract-text-webpack-plugin
    • css加载
    • 打包优化
    • 第三方插件加载中
    • 热更新踩坑
    • typescript+node
    • 代码分割的意思
  • CMD命令行
    • 文件的增删改查
  • node
    • path模块
    • node 文件路径的分析
  • js一些资源库
  • node毛皮
    • cnpm 淘宝镜像
  • 浏览器调试
    • js调试
    • 浏览器同源政策及其规避方法
  • 好好理解变量
    • this指向
    • 作用域
  • 专有名词理解
    • MVC
  • postman
    • 环境变量
  • 树的遍历和操作
    • 二叉树
  • 关于Date你要知道的是?
    • 获取某个月的天数
    • js 日期详解
  • Dom 对象
  • 回调函数
    • 语法。为什么要用
  • class 怎样用好类
    • 用类直接创建对象关联到变量
  • js引擎
  • git操作
    • .gitignore忽略文件
    • 删除操作
  • table学习
    • 表格样式
    • 固定列和行
  • 拖拽
    • 目标容器
    • 狐火的拖拽就是不一样
  • 正则学习
  • 算法
    • 数据结构
  • js小技巧
  • indexDB
  • Matrix 矩阵
Powered by GitBook
On this page

Was this helpful?

网络请求

刚开始接触网络请求时,倒是知道怎么写原生的js 请求,现在都是用jq的ajax了,而且还多了很多的类似的库,有$http、axions,等。发现有的时候还是的用到原生的js请求。其实在昨天,我还是把表单请求和ajax混在一起的,表单请求不就是ajax 里的contentType为application/application/x-www-form-urlencoded ?

真是太无知了,太嫩了!

  • 表单请求是不需要js代码的,浏览器可以不用开启js引擎!,走的是浏览器,所有会导致页面的刷新。

   <form
     action="www.api.com/test"
      method="post"
   >
      <input type="text" name="filed1">
      <button type="submit"></button>
   </form>

这样当点击提交按钮的时候会默认获取input的数据,生成键值对,键名是input的name属性,值是input的value。然后把请求地址是form的action.

  • ajax 请求底层封装的是XMLHttpRequest,这个是用的js引擎,所以浏览器必须开启js引擎。这样浏览器不会刷新页面。

什么时候表单提交优势大于ajax这样的XMLHttpRequest 呢?

在做文件下载和文件上传的时候,用表单的方式优势大。因为文件类型的特别,现在除了formData对象可以接收文件类型,就可以通过ajax传给后台了。但是文件下载就不可以,当后台返回一个文件流时,ajax的响应数据会解析成字符串,ajax不支持blob 类型。所以一般在实现文件的下载时,有三种方法:

  1. 直接把请求地址放在浏览器上,例如:window.loaction.href= "......." ;因为浏览器是可以解析文件流的。然而这样的方法不能实现post 方式传参。

  2. 表单的形式,这样请求走的是浏览器。依然可以解析文档流。可是这样的方式还是有局限性,传递参数的方式contentType 只能是 application/application/x-www-form-urlencoded 。而且有的时候我们要传递的参数,不是说是在input里填的内容,可能是某个对象或是数组。不过机智的是,我们可以用一个隐藏的文本框input,在点击提交的时候,把这个是对象或数组的参数,字符串化,赋给这个input,这样就可以传个对象过去了。但是还是没解决ContentType 为 application/json,

  3. 原生的XMLHttpRequest.可以返回文档流,而且不会像ajax把它解析成字符串.并且传参的方式就可以是多样化的了。不过返回的文档流得需要用到blob对象来解析成文件从而下载出啦。(具体请看原生js请求)

Previousdom元素的内存泄漏例子讲解Next原生js请求

Last updated 6 years ago

Was this helpful?