理解对象
- 编程思想:把一些生活中做事的经验融入到程序中
- 面向过程: 凡事都要亲力亲为,每件事的具体过程都要知道,注重的是过程
- 面向对象:根据需求来找对象,所有的是都用对象来做,注重的是结果
- 面向对象的特性: 封装,继承,多态(抽象性)
js不是面向对象的语言,但是可以模拟面向对象的思想,js是一门基于对象的语言。
!!!万物皆对象!!!
- 理解什么是对象
看得见,摸得到,!!!具体特指的!!!某个东西就是对象。
找对象: 通过描述找对象—文字描述找对象。
分析对象有什么特点:特征和行为。
总结什么是对象:有特征和行为的具体特指的某一个事物,对象的特征叫属性, 对象的行为叫方法。
没有对象创建对象
创建对象的方式
- 字面量的方式创建对象
var obj1={
name:'xiaohong', //属性名:属性值,
age:18,
say:function () {
console.log('我是'+this.name);
},
eat:function () {
console.log('吃!');
}
};
//方法调用
obj1.say();
obj1.eat();
存在问题: 一次性的对象,一开始就写好了,要改的话就需要改源码, 创建多个对象会存在很多冗余的代码。
- 调用系统的构造函数创建对象,也叫做 实例化对象。
var obj = new Object(); // Object是系统的构造函数
//添加属性: 对象.名字=值
obj.name = 'xiaosu';
obj.age = 38;
obj.sex = 'male';
//添加方法: 对象.名字=函数
obj.eat = function () {
console.log('我喜欢吃油炸榴莲');
}; //匿名函数, 分号不要忘记
obj.play = function () {
console.log('我喜欢玩积木');
};
obj.cook = function () {
console.log('切菜');
console.log('洗菜');
console.log('把菜放进去');
console.log('大火5分钟');
console.log('出锅');
console.log('放料,吃');
};
console.log(obj.name); //获取
console.log(obj.age); //获取
console.log(obj.sex); //获取
//对象方法的调用
obj.eat();
obj.play();
obj.cook();
同样的问题:也是会存在大量的冗余代码。
- 工厂模式创建对象
字面量方式和构造函数方式创建的对象存在大量的冗余代码,而且在判断类型的时候都是object,没有办法区分它们是具体的哪一类,比如:
//创建3个对象,人的对象,学生的对象,小狗的对象
//创建人的对象
var person = new Object();
person.name = 'xiaosu';
person.age = 18;
person.sayHi = function () {
//在当前对象的方法中是可以访问当前这个对象的属性值的,
console.log('Hello,我的名字是' + person.name);
//在当前的对象的方法中可以使用this关键字代表当前的对象
console.log('Hello,我的名字是' + this.name);
};
//创建学生的对象
var stu = new Object();
stu.name = 'xiaofang';
stu.age = 10;
stu.study = function () {
console.log('学习,敲代码,今天的作业敲四遍,我今年' + stu.age + '岁了。');
console.log('学习,敲代码,今天的作业敲四遍,我今年' + this.age + '岁了。');
};
//创建小狗的对象
var dog = new Object();
dog.name = 'xiaotianquan';
dog.say = function () {
console.log('wangwang');
};
//输出对象类型
console.log(person instanceof Object);//true
console.log(stu instanceof Object);//true
console.log(dog instanceof Object);//true
//以上都是true ,并不能区分到底是什么类型的,----自定义构造函数方式解决
如何一次性创建多个对象?: 把创建对象的代码封装在一个函数中,最后返回一个对象。
function creatObject() {
var obj=new Object(); //创建对象
obj.name='xiaosu'; //添加属性
obj.age=15;
//添加方法
obj.sayHello=function () {
console.log('hello,我叫'+this.name+'我今年'+this.age+'岁。');
};
return obj;
}
//创建人的对象
var per1=creatObject(); //调用函数,返回值是一个对象,设置一个变量来接收, 执行结束后,per1就是一个对象了
per1.sayHello();//可以调用方法了
//在创建一个人的对象
var per2=creatObject(); //这个是第二次创建,虽然控制台输出是一样的但与per1不是同一个对象,两次创建结果是一样的,因此无法分辨
per2.sayHello();
//解决上述问题:工厂模式创建对象
function creatObject2(name,age) {
var obj=new Object(); //创建对象
//添加属性
// var name='xiaosu';
// var age=10;
obj.name=name; //等号左边的name是属性,右边的name是变量名,将右边的变量名赋值给左边的属性
obj.age=age; // 与上边原理相同
//添加方法
obj.sayHello=function () {
console.log('hello,我叫'+this.name+'我今年'+this.age+'岁。');
};
return obj;
}
//创建对象
var per3=creatObject2('小明',10);
per3.sayHello();
var per4=creatObject2('小红',15); //名字和年龄作为参数输入创建对象的函数,创建了两个不同的对象
per4.sayHello();
- 自定义构造函数创建对象
函数与构造函数的区别: 函数名的命名方式不同- 函数名首字母小写: 普通函数,----主要是用来调用的
- 函数名首字母大写: 构造函数,—主要是用来创建对象的, 注意,构建函数也可以当普通函数来使用,但最好是遵循一些约定俗成的规则
function Person(name,age) {
this.name=name;
this.age=age;
this.say=function () {
console.log("I'm "+this.name+". I'm "+this.age+" years old.");
};
}
//创建对象
var obj=new Person('xiaoming',18); //传入参数创建一个对象,使用自定义构造函数创建对象时发生4件事(即:这行代码执行时发生的4件事)
//调用这个对象
console.log(obj.name);
console.log(obj.age);
obj.say(); // 调用对象的方法
var obj2=new Person('小红',17); //传入参数创建一个对象
//调用这个对象
console.log(obj2.name);
console.log(obj2.age);
obj2.say(); // 调用对象的方法
构造函数与工厂模式创建对象中的函数不同:构造函数里面没有再使用系统构造函数先创建一个对象,然后将这个对象作为返回值返回,而且里面的属性和方法前面都变成了this关键字。
要完成的4件事:
1.在内存中申请一块空闲的空间(开辟空间),存储创建的新的对象
2.把this设置为当前的对象
3.设置对象的属性和方法的值
4.把this这个对象返回
工厂模式创建对象中的问题: 对象不能分辨出到底是属于什么类型的?
//自定义一个小狗的构造函数
function Dog(name,age) {
this.name=name;
this.age=age;
this.sayHi=function () {
console.log('Hello, '+this.name+' Are u '+this.age+' ?');
};
}
//创建对象
var dog=new Dog('旺财',3);
console.log(dog.name);
console.log(dog.age);
dog.sayHi();
//判断创建的对象到底是属于什么类型的:
console.log(dog instanceof Person); //false
console.log(dog instanceof Dog); // true 说明 dog对象是 Dog类型的
JSON格式的数据
JSON 也是一个对象,数据都是成对的,一般JSON 格式的数据无论是键还是值都使用双引号括起来:
var json={ //json格式的数据
"name":"小明",
"age":"10",
"sex":"男"
};
注意: 对象: 有 属性和方法, 特指。对象是一组无序属性的集合的键值对, 属性的值可以是 任意类型。数组使用for循环来遍历的,因为对象是无序的, 所以不能使用for循环遍历对象。
//访问json数据中name的值
console.log(json.name);
console.log(json["name"]);
var key="name"; // key是个变量,里面存储的是属性名
console.log(json[key]);
var key1="height"; //相当于是 json.height ,这样就有了这个属性,但是没有赋值, ------ js是一门动态类型的语言
console.log(json[key1]); //结果是 undefined
可以使用for-in循环遍历:
for (var key0 in json) {
console.log(key0); //key0是变量,里面存储的是json对象中的属性名,输出:name,age,sex
console.log(json[key0]); // 输出的是对应属性的值, 输出:小明,10,男, 注意:不能使用json.key0 因为如果里面没有定义这个属性名key0,结果就是undefined
console.log(key0+'-----'+json[key0]);
}
注意:对象中确实有这个属性,则可以使用: json.key 或者 json[key] , 如果没有,不能使用 点语法。
问:js是一门什么语言?
是一门解释性的语言
是一门脚本语言
是一门弱类型语言,声明变量都用 var
是一门基于对象的语言
是一门动态类型的语言。
动态类型的语言,两个方面:
1.代码(变量)只有执行到这个位置时,才知道这个变量中到底存储的是什么类型的,如果是对象,就有对象的属性和方法,如果是变量就是变量的作用
2.对象没有什么,通过点语法就可以为对象添加属性和方法