JS(JavaScript)
对象
一.对象1.对象是什么;理解成你所看到的任何物体独有属性并且使用方法2.对象的分类;- 内置对象/原生对象;
是以ECMAScript为标准定义好的对象,可直接拿来使用
- 宿主对象;
是以浏览器自身运行环境下提供的对象,并且才可使用
- 自定义对象;
开发人自身创建的对象,并使用
二.创建对象;1.对象初始化方法;通过字面量创建对象/*对象的初始化创建方式var 对象名 = { 属性名 : 属性值, 方法名 : function(){ 方法体 }} */var obj1 = { name:'犬夜叉', age: 16, sayMe :function () { console.log('我是犬夜叉'); }}
2.构造函数方法;
通过JS的预定义类型来创造对象/*对象构造函数* 利用所用引用类型创建对应对象;具体类型 var num = new Number();// Number类型 var str = new String();// String类型 var boo = new Boolean();// Boolean类型 利用Object作为构造函数创建对象 var 对象名 = new Object(); var 对象名 = Object(); */var num = new Number();//Number类型var num2 = Number();var str = new String();//String类型var boo = new Boolean();//Boolean类型var obj2 = new Object();var obj3 = new Object();console.log(obj2);console.log(obj3);
3.Object.create方法;
指定原型和多个指定属性对象var obj6 = Object.create(null);var obj7 = Object.create(obj1);/*利用Object.create()方法创建对象* var 对象名 = Object.create(null);创建一个空对象 var 对象名 = Object.create(obj) obj- 表示另一对象 当前创建新对象拥有与obj对象相同属性和方法 */
三.对象的属性;
1.调用对象的属性;对象名.属性名;不能用复杂命名属性名称对象名[属性名];能用复杂命名属性名称var obj = { name : '犬夜叉', 'Type-Content' : 'text/html', sayMe : function(){ console.log('我是犬夜叉'); }}/* 对象名.属性名 * 不适用于复杂命名的属性名称 */console.log(obj.name);// 犬夜叉// console.log(obj.Type-Content);/* 对象名[属性名]-通用调用方式 * 适用于复杂命名的属性名称 */console.log(obj['name']);// 犬夜叉console.log(obj['Type-Content']);// text/html// 访问一个对象不存在的属性 -> 值为 undefinedconsole.log(obj.age);
2.新增对象的属性;
以两种属性表示对象名.新的属性名 = 属性值对象名[新的属性名] = 属性值var obj = { name : '漩涡鸣人', sayMe : function(){ console.log('我是漩涡鸣人'); }}/* 对象名.新的属性名 = 属性值 对象名[新的属性名] = 属性值 */obj.age = 18;console.log(obj);/* 空对象默认没有自身的属性和方法(父级Object) */var obj1 = {};console.log(obj1);obj1.name = '日向雏田';console.log(obj1);
3.修改对象的属性;
var obj = { name : '漩涡鸣人', sayMe : function(){ console.log('我是漩涡鸣人'); }}/* 对象名.已存在属性名 = 属性值 对象名[已存在属性名] = 属性值 */obj.name = '日向雏田';console.log(obj);
4.删除对象的属性;
以delete表示删除该属性delete 对象名.属性名delete 对象名[属性名]var obj = { name : '犬夜叉', sayMe : function(){ console.log('我是犬夜叉'); }}/* delete 对象名.属性名 delete 对象名[属性名] */delete obj.name;console.log(obj.name);// undefined
四.对象的方法;
1.调用对象的方法;有两种方法表示调用对象对象名.方法名()对象名[方法名]()var obj = { name : '犬夜叉', age : 18, sayMe : function(){ console.log('我是犬夜叉'); }}// 对象名.方法名()obj.sayMe();// 对象名[方法名]()obj['sayMe']();
2.新增对象的方法;
以function()来表示新增对象对象名.新的方法名 = function(){}对象名[新的方法名] = function(){}var obj = { name : '漩涡鸣人', age : 16, sayMe : function(){ console.log('我是漩涡鸣人'); }}// 对象名.新的方法名 = function(){}obj.sayYou = function(){ console.log('你是日向雏田');}console.log(obj);// 对象名[新的方法名] = function(){}
3.修改对象的方法;
var obj = { name : '漩涡鸣人', age : 16, sayMe : function(){ console.log('我是漩涡鸣人'); }}// 1.对象名.方法名 = function(){}obj.sayMe = function(){ console.log('你是日向雏田');}console.log(obj);obj.sayMe();// 2.对象名[方法名] = function(){}
4.删除对象的方法;
delete 对象名.方法名delete 对象名[方法名]var obj = { name : '犬夜叉', age : 16, sayMe : function(){ console.log('我是犬夜叉'); }}// delete 对象名.方法名delete obj.sayMe;// 访问对象中不存在的方法-报错(TypeError: obj.sayMe is not a function)// obj.sayMe();console.log(obj.sayMe);// undefinedconsole.log(obj);// 以属性是否存在的方式进行判断if ('sayMe' in obj) { // 确认目前是个方法 if (obj.sayMe instanceof Function) { obj.sayMe();// 方法调用 }}// 以上代码可以优化为以下代码if ('sayMe' in obj && obj.sayMe instanceof Function) { obj.sayMe();// 方法调用}// delete 对象名[方法名]