小白学js第七天之对象
目录
- 什么是对象
- 对象字面量
- 对象的创建
- 属性和方法
- new关键字
- this详解
- 对象的使用
- 遍历对象中的属性
- 删除对象的属性
今日份脑图,请戳☟[http://naotu.baidu.com/file/dba92f69c1b8a1902944644913d296e6?token=9d7e5519028c2daf]
什么是对象
- 对象可以是任何东西,但对象是一个具体的事物
//手机不是对象, 手机是一类事物
//但是 一部具体的手机就是一个对象
//汽车也不是对象, 是一类事物
//但是一辆具体的车就是一个对象
// 对象由特征(属性)和行为(方法)组成
//程序中的对象都是现实生活中的事物的抽象
var student = {
name : 'zs'; //属性
age : 18; //属性
sayHi function() { //方法
console.log('hello');
}
};
对象和函数的区别
- 函数封装一组代码
- 对象封装一组属性和方法
对象字面量
语法
SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。
var 对象名 = {
属性名 : ;
方法名 :;
}
// eg:创建dog对象
// 属性:name 昵称 type 品种 age color
// 方法:bark 叫 eat 吃
var dog = {
name: 'puppy',
type: '柯基',
age: 2,
color: 'white',
bark: function() {
console.log(this.name + ':wangwangwang');
},
eat: function() {
console.log(this.name + ':啃骨头');
}
}
console.log(dog.name); //访问属性
console.log(dog['age']); //访问对象的另一种方法
dog.bark(); //访问方法
创建一个对象
//第一种
// 创建一个hero对象
// 属性:name 名字 装备 weapon 武器 blood
// 方法:attack 攻击 run
var hero = {
name: '兰陵王',
equipment: ['头盔', '靴子', '盔甲'],
weapon: '泣血之刃',
blood: 100,
attact: function() {
console.log(this.name + '加速攻击');
},
run: function() {
console.log(this.name + '加速跑');
}
}
console.log(hero.name);
hero.attact();
hero.run();
// 第二种 用newObject()创建一个新的对象
var hero = new Object(); //创建了一个空对象
//打印一个不存在的属性返回值为undefined
//console.log(hero.name); // undefined
hero.name = '兰陵王';
hero.equipment = ['头盔', '靴子', '盔甲'];
hero.weapon = '泣血之刃';
hero.blood = 100;
hero.attack = function() {
console.log(this.name + '加速攻击');
}
hero.run = function() {
console.log(this.name + '飞速跑');
}
console.log(hero.name);
hero.attack();
//第三种 工厂方法
function creatHeroes(name, equipments, weapon, blood) {
var hero = new Object();
hero.name = name;
hero.equipments = equipments;
hero.weapon = weapon;
hero.blood = blood;
hero.attack = function() {
console.log(this.name + '攻击');
}
hero.run = function() {
console.log(this.name + '加速跑');
}
return hero;
}
var hero1 = creatHeroes('黄忠', ['鞋子, 背包, 炮弹'], '枪', 100);
var hero2 = creatHeroes('刘备', '鞋子', '剑', 100);
console.log(hero2);
// 4 自定义构造函数
function Heroes(name, equipments, weapon, blood) {
this.name = name;
this.equipments = equipments;
this.weapon = weapon;
this.blood = blood;
this.attack = function() {
console.log(this.name + '攻击');
}
return hero;
}
this.run = function() {
console.log(this.name + '加速跑');
}
var hero = new Heroes('刘备', '鞋子', '剑', 100);
console.log(hero);
属性和方法
- 如果一个变量属于一个对象所有,那么该变量就可以称之为该对象的一个属性,属性一般是名词,用来描述事物的特征
- 如果一个函数属于一个对象所有,那么该函数就可以称之为该对象的一个方法,方法是动词,描述事物的行为和功能
new 关键字
构造函数 ,是一种特殊的函数。主要用来在创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中。
- 构造函数用于创建一类对象,首字母要大写。
- 构造函数要和new一起使用才有意义。
new在执行时会做四件事情
new会在内存中创建一个新的空对象
new 会让this指向这个新的对象
执行构造函数 目的:给这个新对象加属性和方法
new会返回这个新对象
this详解
- 函数在定义的时候this是不确定的,只有在调用的时候才可以确定
- 一般函数直接执行,内部this指向全局window
funtion fn() {
console.log(this);
}
fn();
- 函数作为一个对象的方法,被该对象所调用,那么this指向的是该对象
var student = {
name: 'zs',
age: 18,
class: 'one',
learn: function() {
console.log(this.name + ' learn English');
}
}
student.learn();
- 在构造函数中,this就是构造函数创建的对象
// 在构造函数中,this就是构造函数创造的对象
function person(name, age, classes) {
this.name = name;
this.age = age;
this.classes = classes;
this.learn = function() {
console.log(this.name + ' learn English');
}
}
for (var name in person) {
console.log(name + '==' + person(name));
}
var student = new person('王五', 18, 'one');
console.log(student.name);
对象的使用
遍历对象的属性和方法
通过for..in语法可以遍历一个对象
var student = {
name: 'zs',
age: 8,
classes: 'one',
learn: function() {
console.log(this.name + '正在学习');
}
}
for (var key in student) {
console.log(key + '===' + student[key]);
}
删除对象的属性和方法
delete 对象名.属性名或 delete.方法名
function fun() {
this.name = 'mm';
}
var obj = new fun();
console.log(obj.name); // mm
delete obj.name;
console.log(obj.name); // undefined
Bye for now!

更多精彩