js基础回顾－对象数组篇

Js对象

对象中包含一系列属性，js中除了基本类型外就是对象，它主要有以下特点

对象的属性是无序的

每个属性对应一个key和value ，key为字符串

每个对象都有一个原型

对象结构



属性可动态添加和删除 delete obj.z －》 属性具有属性标签及get/set方法

原型 会沿着原型链一直往上找

class 对象属于哪一个种类 extensible 是否允许新增属性

创建对象的方式：

var obj = {x:1,y:2}

new/原型链

Object.create

属性操作

//读取属性
var obj ＝ {x:1,y:2};
obj.x           //1
obj["y"]        //2

var obj = {x:1}
obj.y   //undefined    对不存在的属性，会沿着原型链去找到顶
if(obj.y)

obj.y && obj.yz && obj.x

//删除属性
delete obj.x

delete Object.prototype  //false   有些属性不允许删除

//属性检测
var cat = new Object;
cat.name = 'tom';
'name'  in  cat    //true
'toString' in cat   //true   in 会按原型链往上找

cat.hasOwnProperty('toString');   //false， 判断是否为自带属性的方法

cat.propertyIsEnumerable("toString");   //false    对象枚举属性 对象会有一大堆属性，但原型链上的大部分属性的枚举属性是false，所以不显示

//增加不可枚举属性
Object.defineProperty(cat,'name',{enumberable:false,value:'tom'});
用defineProperity()时 属性值默认false

//实例
var o = {x : 1, y : 2, z : 3};
'toString' in o;        // true
o.propertyIsEnumerable('toString'); // false

var key;
for (key in o) {
console.log(key); // x, y, z
}

var obj = Object.create(o);
obj.a = 4;
var key;
for (key in obj) {
console.log(key); // a, x, y, z
}

var obj = Object.create(o);
obj.a = 4;
var key;
for (key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(key); // a
}
}

get/set 方法

var man = {
name:'zzz',
$age:null,
get age() {
if(this.$age == undefined)    //非严格等于，null和undefined都进入
return new Data().getFullYear() - 1900;
}else{
return this.$age;
},
set age(val){
val = +val;     //转换数字
if(!isNan(val) && val>0 && val <150){
this.$age = +val;
} else {
threw new Error('Incorrect val of ' + val);
}
}

}

function foo(){}
Object.defineProperty(foo.prototype,'z',
{get:function(){return 1}});
var obj = new foo();

obj.z;  //1
obj.z = 10;
obj.z = 1; //obj对象上无z属性，原型链向上查找，发现有对应get/set方法，它不会给当前对象操作属性

Object.defineProperty(obj,'z',
{value:100,configurable:true});
obj.z;  //100
delete obj.z;
obj.z;  //1  当前对象无属性，原型链上有，但如果不可写，是无法赋值的

属性标签

Object.getOwnPropertyDescriptor({pro:tue},'pro');
//Object {value: true, writable: true, enumerable: true, configurable: true}          w:可写  e：遍历枚举（for in）  c：修改删除
Object.getOwnPropertyDescriptor({pro:tue},'pro'); //undefined

var person = {};
Object.definProperty(person,'name',{
configurable:false,
writable:false,
enumerable:false
value:'hangview'

})
Object.keys(person)               //返回所有属性，没有

//多个属性定义
Object.defineProperties(person,{
title:{value:'fe',enumerable:true}, //默认false
corp:{value:'ABC',enumerable:true},
salary:{value:50000,enumerable:true,writable:true},
luck:{
get:function(){
return 'good';
}
},
promote:{
set:function(level){
this.salary*=1+level*0.1;
}
}

})
person.salary  //  50000
person.promote = 2;
person.salary  //  60000

对象标签，对象序列化

[[proto]] 原型

[[class]]

var toString = Object.prototype.toString;
function getType(o){return toString.call(o).slice(8,-1)};  //截取
toString.call(null)   //"[object Null]"
getType(null)    //"Null"
typeof new Number(1)   //"object"               getType(1)      //"Number"
getType(new Number(1))   //"Number"  Object.prototype.toString会将参数变为对象再处理

[[extensible]]

Object.isExtensible(obj);
Object.preventExtensions(obj);  //限制无法添加新属性
Object.seal(obj);               //将对象属性configurable全设为false
Object.isSealed(obj);

Object.freeze(obj);       //将对象属性configurable,writable全设为false
Object.isFrozen(obj);
//以上方法只针对对象，不针对其原型链

序列化

var obj = {x:1,y:true,z:[1,2,3],nullVal:null}
JSON.stringify(obj)
//"{"x":1,"y":true,"z":[1,2,3],"nullVal":null}"

//undefined的属性不会出现在序列化结果里 ,NaN/Infinity->null ,时间->UTC时间格式
var obj = {val:undefined,x:NaN,y:true,z:new Date()}
JSON.stringify(obj)
//"{"x":null,"y":true,"z":"2016-03-12T07:53:13.923Z"}"

//将json数据转换为对象：
z = JSON.parse('{"x":1}')   //Object {x: 1}

//序列化自定义
var obj = {x:1,y:2,
o:{o1:1,o2:2,
toJSON:function(){
return this.o1 + this.o2;
}
}
};
JSON.stringify(obj);  //    "{"x":1,"y":2,"o":3}"

其它对象方法

toString方法
valueOf 方法
对象转换类型时，会先找valueOf方法， 再找toString方法，两个方法可以自定义

Js数组

序言

数组也是一种对象，它是值的有序集合。每个值叫做元素，每个元素在数组中都有数字位置编号，也就是索引。js的数组是弱类型的，数组中可以包含不同类型的元素。

数组大小 size from 0 to 2^23 - 1

创建数组的方式主要有两种
var a = [1,2,3,{name:'zzz',age:18},null];
var b = [,,]  //undefined * 2

var c = new Array(100); // undefined*100
var d = new Array(true,3,5) // [true,3,5]

数组元素读写：
a[1];a.length; d[3] = 7;
delete a[0]; // delete只是将元素改为了undefined，数组长度不变

var arr = [1,2,3];
arr[2] = undefined;  //[1,2,undefined]
2 in arr      //true
delete arr[2]  //[1,2,undefined]
2 in arr     //false

a.unshift(2);   //在数组头部添加元素
a.length -= 1 ; 等价于  arr.pop();           // 删除掉尾部元素
a.shift();    //删除头部元素

数组迭代
for循环
for(i in arr) {   }
//for in 会出现原型上的属性，需要用hasOwnProperty()判断一下；同时它不保证顺序

数组方法

{} => Object.prototype
[] => Array.prototype

//join  数组转换为字符串
var  arr = [1,2,3];
arr.join();  //1,2,3
arr.join('_'); //1_2_3

function repeatString(str,n){
return new Array(n+1).join(str);
}
repeatString('a',3);    //aaa

//reverse 颠倒顺序 ,原数组被修改
var arr = [1,2,3];
arr.reverse();  // [3,2,1]

//sort  排序，原数组被修改
var arr = [13,21,51,3];
arr.sort();     //[13,21,3,51] 转换为字符串后再排序

arr.sort(function(a,b){
return a-b;
})   //[3,13,21,51]

arr = [{age:25},{age:39},{age:99}];
arr.sort(function(a,b){
return a.age-b.age;
})
arr.forEach(function(item){
console.log('age',item.age);
})
//age 25 age 39 age 99

//contact  原数组未被修改
var arr = [1,2,3];
arr.concat(4,5); //[1,2,3,4,5]
arr //[1,2,3]

arr.contact([10,11],13);  //[1,2,3,10,11,13]
arr.concat([1,[2,3]]);  //[1,2,31,[2,3]] 只会拆一次

//slice  返回数组一个片段,左闭右开，原数组未被修改
var arr = [1，2，3，4，5]；
arr.slice(1,3); //[2,3]
arr.slice(1); //[2,3,4,5]
arr.slice(1,-1); // [2,3,4] 倒数第一个，不包含

//splice 数组拼接, 对愿数组修改
var arr = [1,2,3,4,5];
arr.splice(2);      //[3,4,5]
arr; // [1,2]

arr.splice(2,2)  //从第二个元素开始，删除2个元素
arr; //[1,2,5]

arr.splice(1,1,'a','b'); //return [2]
arr;      //[1,"a","b",3,4,5]

//forEach     ES5   ie9+
var arr = [1,2,3,4,5];
arr.forEach(function(x,index,a){
console.log(x+'|'+index+'|'+(a===arr));
}
)
//输出：
1|0|true
2|1|true
3|2|true
4|3|true
5|4|true

//map  不修改原数组
var arr = [1,2,3];
arr.map(function(x){
return x＋10；
});    //[11,12,13]
arr;//[1,2,3]

//filter  筛选  不修改原来数组
var arr = [1,2,3,4,5,6,7,8];
arr.filter(function(x,index){
return index%3 === 0 || x >= 8;
}) // returns [1,4,7,8,9,10];

//every,some  对数组的判断
//every 对每一个元素都要符合条件
arr.every(function(x){
return x<10;
})  //true
arr.every(function(x){
return x<3;
})  //false
//some  有一个即可

//reduce 数组两两操作 ,每次的结果作为新的第一个参数，第二个参数是下一个新的
var arr =[1,2,3];
var sum = arr.reduce(function(x,y){
return x+y;
})    // 6
reduceRight   //从右往左

//indexOf   检索元素在数组中的位置  lastIndexOf   从右往左
var arr = [1,2,3,2,1];
arr.indexOf(99)  //-1 不存在，返回－1
arr.indexOf(1,1)  //4  从第二个元素开始找
arr.indexOf(1,-3)  //4 从倒数第三个元素开始查找

Array.isArray([]);  //true  非原型链上的方法，数组构造器的方法

数组 VS 一般对象

相同点 : 都可以继承，数组是对象，对象不一定是数组，都可以当作对象增删属性

不同点 : 数组自动更新length，按索引访问数组尝尝比访问一般对象属性明显迅速。数组对象继承Array.prototype上的大量数组操作方法

字符串类数组

var str = ‘hello world’;

str[1]

Array.prototype.join.call(str,’_’);