JavaScript {} 和[]的区别 post提交数据

Posted 2020-10-17 落叶落

 

　　

今天在写一个提交到后台的时候 数据后台解析不了 出了点小小周折,看了下之前写的代码 发现是有个东西疏忽了,为了避免以后不再犯同样的错误,特记录如下:

{}和[]两个看起了差不多 有时候傻傻分不清楚 其实两者差异还是比较大的

{}在js中是一个对象 例如:

var object={};
//初始化操作
object={
‘id‘:1,
‘name‘:‘我是对象‘
}

//赋值操作
object.id=1;
object.name=‘我是对象‘;

//还可以给对象一个函数
object.add=function(){
alert(‘添加成功‘)
}

而[]在js中是一个数组 例如

var array=[];

//赋值
array.id=1;
array.name=‘我是数组‘;

这是定义上的区别,

在实际上会有什么影响呢?

这里仅介绍我这次出的问题

我页面是这样的 页面有参数 a b c 

如果是普通参数的话 用表单提交 或者普通post提交都可以

但是 b 是一个数组 

c则是一个数组 c[0]又是一个数组

这样我就打算构建一个对象 直接提交到后台 省得在后台在解析字符串 还原

于是我构建了这样一个对象

var request=[];

request.a=‘标题‘;

var b=[]; 
b.push({‘ele‘:‘元素1‘});
b.push({‘ele‘:‘元素2‘});
request.b=b;

var c=[]; 
var d=[];
d.push({‘ele‘:‘元素3‘});
c.push({‘array‘:d});
request.c=c;

 

然后用$.ajax 提交到后台

$.ajax({
        type: "POST",
        url: "test",
        data: JSON.stringify(request),
        async: true,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (result) { //成功执行函数          
            console.log(result);
        },
        error: function (result) { //错误时执行的函数
            alert("网络错误，请稍后再试");
        }
    });

后台时间上只是把接收到的对象再返回来,这时候 返回来的参数都是空值

仔细看了一下 开始以为是ajax参数出问题了 后来回顾了一下以前写的代码 发现是{} []的问题

于是改为如下

var request={};

request.a=‘标题‘;

var b=[]; 
b.push({‘ele‘:‘元素1‘});
b.push({‘ele‘:‘元素2‘});
request.b=b;

var c=[]; 
var d=[];
d.push({‘ele‘:‘元素3‘});
c.push(d);

request.c=c;

　　

　再次提交 a b 取到值 但是c仍然是空

再次修改

var request={};

request.a=‘标题‘;

var b=[]; 
b.push({‘ele‘:‘元素1‘});
b.push({‘ele‘:‘元素2‘});
request.b=b;

var c=[]; 
var d={};
d.ele=‘‘元素3‘;

c.push(d);

request.c=c;

　　这时 a b c 都取到值

 

结论 用jquery post提交参数时 后台使用对象接受时 只能提交一个对象{} 对象里面的某个属性可以是数组 但是数组必须是一个对象数组 不能是一个二维数组 即使实际上可以作为一个二维数组 也要把里面那个数组作为对象的属性赋值;

另外

JSON.stringify(data) 提交时 不可缺少 否则浏览器会自动以表单参数拼接方式提交 会丢失参数
提交时 检查JSON.stringify(data)这个参数是否正确展示了数据