1、对象简介:
在 JavaScript 中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如字符串、数值、数组、
函数等。
1.1 创建对象的三种方式
利用字面量创建对象
利用 new Object 创建对象
利用构造函数创建对象
1.2 使用字面量创建对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
// 1.利用对象字面量创建对象 {}
// var obj = {}; // 创建了一个空的对象
var obj = {
// 里面的属性或者方法我们采取键值对的形式
uname: 'Echo',
age: 18,
sex: '男',
sayHi: function() {
console.log('hi~');
}
}
// 2. 使用对象 对象名.属性名
console.log(obj.uname);
// 对象名['属性名']
console.log(obj['age']);
// 3. 调用对象的方法 对象名.方法名()
obj.sayHi();
</script>
</head>
<body>
</body>
</html>
1.3 使用New关键字
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
// 利用 new Object 创建对象
var obj = new Object(); // 创建了一个空的对象
obj.uname = 'Echo';
obj.age = 18;
obj.sex = '男';
obj.sayHi = function() {
console.log('hi~');
}
console.log(obj.uname);
console.log(obj['sex']);
obj.sayHi();
</script>
</head>
<body>
</body>
</html>
1.4 使用构造函数创建
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
// 利用构造函数创建对象 构造函数名字首字母要大写
function Star(uname, age, sex) {
this.name = uname;
this.age = age;
this.sex = sex;
this.sing = function(sang) {
console.log(sang);
}
// 构造函数不需要return 就可以返回结果
}
// 调用构造函数 必须使用 new
var ldh = new Star('Echo', 18, '男'); // 调用函数返回的是一个对象
console.log(typeof ldh);
console.log(ldh.name);
console.log(ldh['sex']);
ldh.sing('乌云然');
</script>
</head>
<body>
</body>
</html>
1.5 遍历对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
// 创建一个对象
var obj = {
name: 'Echo',
age: 18,
sex: '男',
fn: function() {}
}
// 遍历对象
// for in
for (var k in obj) {
console.log(k); // k 变量 输出 得到的是 属性名
console.log(obj[k]); // obj[k] 得到是 属性值
}
</script>
</head>
<body>
</body>
</html>