02学习 JS面向对象笔记
其实很多人都说JS难，其实JS就是要多练习，JS 快速成长 多练 从头到尾 1~3 遍
多练 然后写代码的能力提升快 不要拷贝别人的代码
本篇文章记录的是
0.属性的操作
1.属性的删除
2.属性的检测
3.枚举属性
4.序列化对象
-----------------------------
属性的设置 和 获取
例：
var obj ={};
obj.name = 'shaozhu';//方法一
obj['age'] = 22;//方法二
这两个设置属性的区别 ！！！！！
用点 '.' 只能获取自身的属性
[] 可以是变量 也就是说 当value 是变量的时候，'.'是获取不到的，要用[] 来获取
var obj ={}; obj.name = "shaozhu"; obj['age']=22; obj['age']
22
-----------------------
反面例子
var o = {}; o.name = 'xxx'; var nameA = 'name'; console.log(o[nameA]);
输出 xxx
[nameA] 里面的就是变量 如果用点的画就不行了
-----------------------
正面例子
var o = {} o.name = 'xxx'; var nameA = 'name'; console.log(o[name]);
输出 undefined 这里应该是要加引号的 呵呵
----------------------------------------------
知识点1.属性的删除
var o = {} o.name = 'xxx'; delete o.name;
-----------------------
知识2.属性的检测
1. in 运算符 (返回 布尔类型 )
2.hasOwnProperty()
3. ！==undefined
var o = {} o.name = 'xxx'; console.log("name" in o);//方法1 返回布尔类型 console.log(o.hasOwnProperty("name"));//方法2 返回布尔类型 console.log(o.name !== "undefined" ) //方法3 返回布尔类型 这个方法有缺点 慎用 也有点 low
记得加引号
-----------------------
知识点3.枚举属性
-----------------------
for in var o ={x:1,y:2,z:3};//数组 for(a in o){ console.log(a);//得到的是key }
这样遍历出来的 key x y z
-----------------------
for in var o ={x:1,y:2,z:3};//数组 for(a in o){ console.log(o[a]);//得到value }
这样遍历出来的就是 value 1 2 3
--------------------------------------
var arr = [{x:1},{y:2},{z:3}];//数组对象 for(a in arr){console.log(a)} //0 1 2 得到的是数组的索引
PS：
for 是同步的
each 是异步的
$.each(data,function(index,item)){ ... }
---------------------------
4.序列化对象
数据类型有 xml json
var o2 = {x:1,y:2,z:3}; console.log(typeof(JSON.stringify(o2)));//对象转字符串
string
------------
var o2 = {x:1,y:2,z:3}; var str = JSON.stringify(o2);//转成字符串 console.log(typeof(JSON.parse(str))); //字符串转对象
object
---------------------------------------
var o2 = {x:1,y:2,z:3}; var str = JSON.stringify(o2);//转成字符串 var obj =JSON.parse(str); //这个是深拷贝 console.log( typeof(obj)); obj.x object 1
---------------------------------------
深拷贝 类似于双胞胎 完全独立的 各自有各自的行为 JSON.parse(str);
//这个是深拷贝 不会随着发生变化
浅拷贝 (引用) 相对于影子 对象 数组 都是浅拷贝 人和影子会一起动（对象和数组都是引用） 会随着发生变化
var o2 = {x:1,y:2,z:3}; var p = o2; o2.x = '123'; console.log(p)
{x: "123", y: 2, z: 3}//改变了！！！
一个 ajax 的例子
function getFormData() { var _name = $.trim($(".name").val()); var _age = $.trim($(".age").val()); var _address = $.trim($(".address").val()); var _mobile = $.trim($(".mobile").val()); var _email = $.trim($(".email").val()); var data = { "name": _name, "age" : _age, "address" : _address, "mobile" : _mobile, "email" : _email }; return data; }; //提交 $(".btn-submit").on('click',function() { var data = getFormData(); alert(JSON.stringify(data)); $.ajax({ type: "POST", //请求方式 url: url, //请求路径 cache: false,//是否异步 data: {dataJson: JSON.stringify(data)}, //传参 dataType: 'json', //返回值类型 success: function (msg) { }, error: function () { } }); });
//数组对象有a返回1反之返回2；
var arr =[{a:1,q:2,w:3},{d:1,r:2,c:3},{t:1,v:2,z:3},{g:1,f:2,z:3}]; "a" in arr[0] 解：
var arr = [{a:1,q:2,w:3},{d:1,r:2,c:3},{t:1,v:2,z:3},{g:1,f:2,z:3}]
var arr =[{a:1,q:2,w:3},{d:1,r:2,c:3},{a:1,v:2,z:3},{g:1,f:2,z:3}];
for(var i=0;i<arr.length;i++){
if("a" in arr[i]){
//属性检测
console.log(1);
break;
}
}
var arr = [{a:1,q:2,w:3},{d:1,r:2,c:3},{t:1,v:2,z:3},{g:1,f:2,z:3}]
$.each(arr,function(index,item){
if(item.hasOwnProperty('a')){
console.log('ok');
}else{
console.log('error');
}
})
