formData类的学习来上传文件

FormData 接口提供了一种表示表单数据的键值对 key/value 的构造方式，并且可以轻松的将数据通过XMLHttpRequest.send() 方法发送出去，本接口和此方法都相当简单直接。如果送出时的编码类型被设为 "multipart/form-data"，它会使用和表单一样的格式

formData对象

1.创建一个空对象
var formdata=new FormData()

2.追加数据
formdata.append("name","张三";)

3.通过get方法对值进行读取
console.log(formata.get("name"));

4.通过set方法对值进行修改，如果key值不存在，则添加一条数据
var formdata=new FormData();
formdata.set("name","张三");
console.log(formata.get("name"));//张三

//has(key) 判断是否存在对应的key值

var formdata=new FormData( );
formdata. append( "name","李四”);
console.1og( formdata. has("name")); // true
console . log(formdata.has("age")); // false

//delete(key)删除数据

formdata. append("name", "李四");
console .1og( formdata. get("name")); //李四
formdata. delete(" name");
console.1og( formdata. get("name")); // null

//entries()获取一个迭代器，然后遍历所有的数据

 var formData = new FormData( );
 formData. append("k1", "v1");
 formData. append("k1", "v2");
 formData. append("k2", "v1");

var i = formData. entries();
i.next(); // {done:false, value:["k1"， “V1"]};
i.next(); // {done:fase, value:["k1"， "v2"]};
i.next(); // {done:fase, value:["k2"， “v1"]};
i. next(); // {done: true, value : undefined}

//每次返回迭代器的规则，

//每次调用一次next()返回一条数据，数据的顺序根据添加的顺序决定

//返回的是一个对象，当done的属性为 true的时候，就说明已经遍历完毕

具体学习的链接如下

Formdata文件上传 - 掘金

复习

1.函数

函数的声明
var fun=function(){}
Function ()构造函数
var fun=new Function("a","b","return a*b")

函数的提升
也就是说提升是js默认将当前作用域提升到前面的去的行为

自调用函数

如果表达式后面紧跟(),则他自己会自调用
(funciton (){
 var x="Hello!";//我将调用我自己
 //这是一个匿名函数的调用
})

函数是对象
在Js当中使用typeof操作符判断函数类型将返回"function"
但是 js函数描述未一个对象更加准确
js函数有属性和方法
arguments.length会返回函数调用过程种接收到的参数的个数
function muFunction(a,b){
 return argumnets.length;
}

toString()方法 会将函数作为一个字符串返回
function myFunction(a,b){
return a*b;
}

var txt=myFunction .toString();

箭头函数
(参数1，参数2 ，参数3，参数 n)=>{ return 表达式 ;}

//当只有一个参数的时候，圆括号是可选的
(单一参数)=>{函数声明}
单一参数 =>{函数声明}

//没有参数的函数应该写成一对圆括号
()=>{函数声明}
对比
var x=function(x,y){
return x*y;
}

const x=(x,y)=>x*y;
箭头函数没有自己的this,不适合一个对象的方法
当我们使用箭头函数的时候，箭头函数会默认帮我们绑定外层this的值，所以在箭头函数
种this的值和外层的this是一样的
箭头函数不能提升，所以在使用之前需要定义

使用const 比使用var更加安全，因为函数表达式始终是一个常量

2.常见的几种创建对象的方式

var p=new Object ();
p.name='Tom'
p.age=12
p.setName=function(name){
 this.name=name
}

//测试
p.setName('JACK')
console.log(p.name,p.age)
//方式2：
使用对象字面量模式
套路：使用{}创建对象，同时指定属性/方法
使用场景 ：起始对象内部数据是确定的
问题：如果创建多个对象，会有重复代码

var p={
 name:'Tom',
 age:12,
 setName:function(name){
  this.name=name
 }
}

//测试
console.log(p.name,p.age)
p.setName('JACK')

//方法三：工厂模式
使用工厂函数创建动态对象并且返回
使用常见：需要创建；多个对象
问题：对象 没有一个具体的值，都是Object值

function Person(name,age){
this.name=name;
this.age=age
}

Person.prototype.setName=function(name){
 this.name=name;//实例对象
}

 

---

本周小总结:    继续加油！