JavaScript学习第六天笔记（对象）
对象
概述
在JavaScript中的对象，和其他编程语言中的对象一样，可以比照现实生活中的对象来理解它。
对象的分类
1.内置对象/原生对象
就是JavaScript运行环境提供的对象。在ECMAScript标准定义，由JavaScript解释器/引擎提供具体实现。
2.宿主对象
指的是JavaScript运行环境提供的对象。一般是由浏览器厂商提供实现的（目前也有独立的JavaScript解释器/引擎提供实现），主要分为BOM和DOM。
3.自定义对象
就是由开发人员自主创建的对象。
Object对象
概述
Object类型与Array、Math等一样都是JavaScript的引用类型。不过Object类型是JavaScript中所有类型的父级（所有类型的对象都可以使用Object的属性和方法）.
JavaScript可以通过Object的构造函数来创建自定义对象。当以非构造函数形式被调用时，Object等同于new Object（）。
Object对象的方法
Object对象的方法分为自有方法和原型方法两种：
1.自由方法
a.creat（） 值原定对象和属性来创建一个新的对象
b.getOwnPropetyNames（） 返回一个数组，它包含了指定对象所有的可枚举或不可枚举的属性名。
c.keys（） 返回一个数组，包含指定对象的所有自由可遍历属性的名称。
2.原型方法
prototype.hasOwnProperty() 返回一个布尔值，该值指示对象是否包含制定的属性。
对象初始化器方式
使用对象初始化器也被称作通过字面值创建对象。通过对象初始化器创建对象的语法如下：
var 函数名 ={
属性名：属性值，
方法名：function（）{
}
}示例代码如下：
var obj1 = {
name:'EVA',
age:14,
sayMe:function(){
console .log('EVA001');
}
}对象构造函数方式
利用Object作为构造函数创建对象
var 对象名 = new Object();
var 对象名 = Object();
var obj2 = new Object();
var obj3 = Object();
console.log(obj2);// {}
console.log(obj3);// {}
var obj4 = new Object(undefined);
var obj5 = new Object(null);
console.log(obj4);
console.log(obj5);利用Object.create（）方法创建对象
var 对象名 = Object.create(null) -> 创建一个空对象
var 对象名 = Object.create(obj)
obj - 表示另一个对象
特点 - 当前创建的新对象拥有与obj对象相同的属性和方法
var obj6 = Object.create(null); var obj7 = Object.create(obj1); console.log(obj6); console.log(obj7);
创建空对象的方法
1.var obj1 = {};
2.var obj2 = new Object();
3.var obj3 = Object();
4.var obj4 = new Object(undefined);
5.var obj5 = new Object(null);
6.var obj6 = Object(undefined);
7.var obj7 = Object(null);
8.var obj8 = Object.create(null);
对象的复制
var obj1 = {
name : '123',
sayMe : function(){
console.log('THIS IS 123');
}
}
console.log(obj1);
var obj2 = obj1;
console.log(obj2);
// 修改obj1对象的name属性值
obj1.name = '456';
console.log(obj1);
console.log(obj2);调用对象的属性
var obj = {
name:'Chambers',
'Type-Content':'text/html',
sayMe : function(){
console .log('Gemini');
}
}1.对象名.属性名（不适用于复杂命名的属性）
console .log(obj.name);//输出结果：Chambers
2.对象名[属性名]-通用的调用方式，适用于复杂命名的属性名称
console .log(obj['name']);//输出结果：Chambers
注意：当访问一个对象不存在的属性的值为undefined
新增对象的属性
var obj = {
name : '张无忌',
sayMe : function(){
console.log('我是张无忌');
}
}
/*
1.对象名.新的属性名 = 属性值
2.对象名[新的属性名] = 属性值
*/
obj.age = 18;
console.log(obj);空对象默认没有自身的属性和方法（有父级Object的）
var obj1 = {};
console .log(obj1);
obj1.name = 'EVA';
console .log(obj1);修改对象的属性
1.对象名.已存在的属性名 = 属性值
2.对象名.[已存在的属性名] = 属性值
var obj {
name ：'GEMINI';
sayMe : function(){
console .log('this is eva');
}
}
obj.name = 'eva';
console .log(obj);删除对象的属性
1.delete 对象名.属性名
2.delete 对象名[属性名]
var obj ={
name:'EVA',
sayMe:function(){
console .log('this is eva');
}
}
delete obj.name；
console .log(obj.name);//undefined检测对象的属性
var obj = {
name : '张无忌',
age : 18
}
console.log(obj.age);// undefined
// 1.判断对象的属性值是否为 undefined
if (obj.age !== undefined) {
console.log('obj对象的age属性存在...');
} else {
console.log('请先定义obj对象的age属性...');
}
// 2.判断对象的属性值 - 先转换为Boolean类型
if (obj.age) {
console.log('obj对象的age属性存在...');
}
// 3.利用in关键字进行判断
if ('age' in obj) {
console.log('obj对象的age属性存在...');
} else {
console.log('obj对象的age属性不存在...')
}
// 4.Object类型提供了hasOwnProperty()方法
if (obj.hasOwnProperty('age')) {
console.log('obj对象的age属性存在...');
} else {
console.log('obj对象的age属性不存在...')
}遍历对象的属性
var obj = {
name : '张无忌',
age : 18,
sayMe : function(){
console.log('我是张无忌');
}
}
// 1.for...in语句
for (var objAttr in obj) {
// 通过对象属性或方法对应的值的类型进行区别
if (obj[objAttr] instanceof Function) {
// 当前是对象的方法
obj[objAttr]();
} else {
// 当前是对象的属性
console.log(obj[objAttr]);
}
}
// 2.Object类型提供了keys()方法 - 只能遍历可枚举的属性
var arr = Object.keys(obj);
for (var v in arr) {
var objAttr = arr[v];
// 通过对象属性或方法对应的值的类型进行区别
if (obj[objAttr] instanceof Function) {
// 当前是对象的方法
obj[objAttr]();
} else {
// 当前是对象的属性
console.log(obj[objAttr]);
}
}
// 3.Object类型提供了getOwnPropertyNames()方法 - 包括不可枚举的属性
var arr = Object.getOwnPropertyNames(obj);
for (var v in arr) {
var objAttr = arr[v];
// 通过对象属性或方法对应的值的类型进行区别
if (obj[objAttr] instanceof Function) {
// 当前是对象的方法
obj[objAttr]();
} else {
// 当前是对象的属性
console.log(obj[objAttr]);
}
}调用对象的方法
var obj = {
name : 'EVA',
age : 14,
sayMe : function(){
console.log('this is eva');
}
}
// 1.对象名.方法名()
obj.sayMe();
// 2.对象名[方法名]()
obj['sayMe']();新增对象的方法
var obj = {
name : 'eva',
age : 18,
sayMe : function(){
console.log('this is eva');
}
}
// 1.对象名.新的方法名 = function(){}
obj.sayYou = function(){
console.log('shinji');
}
console.log(obj);
// 2.对象名[新的方法名] = function(){}修改对象的方法
1.对象名.方法名 = function(){}
2.对象名[方法名] = function(){}
var obj = {
name : 'EVA',
age : 18,
sayMe : function(){
console.log('this is eva');
}
}
obj.sayMe = function(){
console.log('shinji');
}
console.log(obj);
obj.sayMe();删除对象的方法
1.delete 对象名.方法名
2.delete 对象名[方法名]
var obj = {
name : '张无忌',
age : 18,
sayMe : function(){
console.log('我是张无忌');
}
}
delete obj.sayMe;
// 访问对象中不存在的方法 -> 报错(TypeError: obj.sayMe is not a function)
// obj.sayMe();
console.log(obj.sayMe);// undefined
console.log(obj);
// 以属性是否存在的方式进行判断
if ('sayMe' in obj) {
// 确认目前是一个方法
if (obj.sayMe instanceof Function) {
obj.sayMe();// 方法调用
}
}
// 以上代码可以优化为以下代码
if ('sayMe' in obj && obj.sayMe instanceof Function) {
obj.sayMe();// 方法调用
}