js对象

1 定义
(1)语法形式:

var obj = {
 key:value
};

(3)构造形式:

var obj = new Object();
obj.key = value;

2 js 的类型

(1)string
(2)number
(3)boolean
(4) null
(5) undefined
(6) object
简单基本类型:string ,number,boolean,null undefined .null有时会被当做一种对象。typeof null``// “object”.这是语言的一个bug。(原理:不同的对象在底层都表示成二进制,在js中如果前三位都是0,则为object类型,null的二进制本身就是全部为0的,故显示为object)
函数就是对象的一个子类型(即可调用的对象),数组也是对象中的一个子类型。
js中的一些对象子类型(内置对象):
(1)String
(2)Number
(3 Boolean
(4) Object
(5) Function
(6) Array
(7) Data
(8) RegExp
(9) Error

var obj = "I love you,rose";
typeof obj;//string
var obj1 = new String("I love you ,rose");
typeof obj1;//"object"
obj1 instanceof String //true

在必要时js引擎会自动把string字面量 转换为String,以便我们对其进行其他的操作。

var obj2  = " i a m";
obj2.length;  //5
obj2.charAt(4);//"m“

对于Number,Boolean,引擎也会把字面量转换成内置对象来进行操作,但是由于Object.Array,Function,RegExp他们都是对象,不是字面量。‘
存贮在对象中的属性只是一个指针,它指向该属性值。调用时有两中形式Object.key或者Object[''key''];其中.操作符需要让属性名满足标识符的规则,但是["..’']操作符可以使用任意Utf-8或者Unicode字符串作为属性名。

在对象中属性名一直都是字符串。使用typeof操作符后也是以字符串的形式输出的。如果进行多于一次的typeof操作,都会变为"strng".

typeof obj3//"object"
typeof typeof obj3//"string"

可计算属性名:

es6:
var prefix = "foo";
var myObject = {
 [prefix + "bar"]:"the girl is my friend",
[prefix +"baz"]:"the boy is my brother"
}
myObject.foobar;//"the girl is my friend"
myObject.foobaz;//"the boy is my brother"

可计算属性名最常用的场景可能是ES6的Symbol。

数组

向数组添加属性:

var arr1 = ["bat",1,"foo"];
arr1.bar = "bar";
arrq.length ;//3
arr1["3"] = "mioa";
arr1.length ;//4

从上面的代码我们发现给数组直接添加属性值时,如果是字符串的属性名,则他的length不会改变,如果是数字的属性名时,他会以为是数组的下标,从而添加长度length

复制对象(面试)

属性描述符

var myObject ={
a:2
};
Object.getOwnPropertyDescriptor(myObject,"a");
//{value: 2, writable: true, enumerable: true, configurable: true}

禁止对象拓展(添加不了新属性):

var myObject = {
 a:2
}
Object.perventExtensions(myObject);
myObject.b = 1 ;
myObject.b;//undefined

冻结对象(无法添加无法删除属性,除此之外还不能修改属性的值):

var myObject = {
 a:2
}
Object.freeze(myObject);
myObject.a = 5;
myObject.a //2

Getter&Setter

es5中可以使用getter 和setter部分改写默认操作

var myObject ={
get a(){
  return 2;  
  }
};
Object.defineProperty(
myObject,
"b",{
 get :function(){return this.a*2},
   enumerable:true
}
)
myObject.a//2
myObject.b//4

上面的代码在给我们展示给对象myObject 中的属性定义了一个getter函数,然后再设置了一个新属性为,再给其设置getter函数.
只使用一个(Getter或者是Setter)是理想的,他们应该成对存在:

var myObject3 = {
get a(){
 return this._a_;
  },
set a(val){
  return this._a_ = val*2;
  }
};
myObject3.a = 2;
myObject3.a  //4

引擎先读set再get

看对象是否存在该属性的方法:

(1)in操作符:

var obj = {
a:2
};
//false
("b" in obj);

(2) hasOwnproperty方法:

var obj = {
a:2
};

//true
obj.hasOwnProperty("a");

(3)很厉害的判定法:

Object.prototype.hasOwnProperty.call(obj,"a");

注意 in操作符是可以检查容器内是否有某个值,但是它实际上是在检查属性名是否存在。

var arr3 = [1,2,3];
(3 in arr3);//false

出现上面这段代码的原因如下:
对于数组来说:它的属性名(也就是索引)是0,1,2,里面是没有3的。
所以它会报false.

你可能感兴趣的:(js对象)