一、什么是对象
（一）概念
- 😃 就是一个数据的集合(
复杂数据)- 😁 对象属于复杂数据类型(
引用数据类型)
（二）知识点的补充
- JS 的数据类型
1. 基本数据 2. 复杂数据（引用数据类型）- 引用数据类型
object（对象）function（函数） array（数组）
（三）对象的理解
var obj = {
name:'张三',
age:18
}
console.log(obj);
说明：
- 😪 内部存放键值对 (还有人叫
key/value;属性名: 属性值)- 🥰
逗号间隔- 😣 冒号左边:
健; 冒号右边:值;
注意：
- 🥰 { } 对象内部存储的是
数据- 😣 if ( ) {
分支语句的代码}- 😁 for ( ) {
循环体}- 🥰 function ( ) {
函数体}- 😁 { 数据(
内部的数据 大部分为基本数据类型) }
二、对象的创建
1、字面量的形式
var obj = {
name: '张三',
age: 18
}
console.log(obj)
2、内置构造函数
var obj1 = new Object(); // 创建一个空对象
console.log(obj1);
三、对象对于key的要求
- 😍 推荐使用，符合变量
命名规范和规则的- 😁 可以使用数字作为
key- 😣 可以使用
特殊符号
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
四、对象的操作(增删改查)
（一）点语法
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
1、查找：(对象.key)
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
console.log(obj.name);
2、修改：(对象.key = 新值)
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
obj.name = '李四';
console.log(obj);
3、新增：(对象.新key = 值)
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
obj.addr = '贵阳';
console.log(obj);
4、删除(delete obj.key)
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
delete obj.name;
console.log('删除之后的对象：',obj);
（二）中括号语法(数组语法)
1、查找：(对象[‘key’])
var obj = {
name: '张三',
age: 18,
123: 123,
'@': '特殊符号1',
'$': '特殊符号2'
}
console.log(obj);
console.log(['name']);
2、修改：(对象[‘key’] = 新值)
var obj = {
name: '张三',
age: 18,
123: 123,
'@': '特殊符号1',
'$': '特殊符号2'
}
console.log(obj);
obj['name'] = '李四';
console.log(obj);
3、增加：(对象[‘新key’] = 值)
var obj = {
name: '张三',
age: 18,
123: 123,
'@': '特殊符号1',
'$': '特殊符号2'
}
console.log(obj);
obj['addr'] = '贵阳';
console.log(obj);
4、删除：delete 对象[‘key’]
var obj = {
name: '张三',
age: 18,
123: 123,
'@': '特殊符号1',
'$': '特殊符号2'
}
console.log(obj);
delete obj['name'];
console.log(obj);
（三）两种操作方式的区别
- 🥱对象的key符合
命名规范的时候都可以- 😂出现纯数字为
key或者特殊符号(@# )，我们需要使用中括号语法- 😛当出现变量的时候(
想用变量作为key) ，也需要使用中括号语法
1、点语法的问题
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
console.log(obj.123); //语法不支持，报错
console.log(obj.'@'); //语法不支持，报错
2、使用中括号语法
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
console.log(obj[123]); // 123
console.log(obj['@']); // 特殊符号1
3、定义变量
点语法
- 猜想: 对象.变量 —> 对象.name —> 张三
- 实际: 对象点语法, 会将点后边的key作为字符串去使用, 所以点后边不能书写变量
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
// 定义一个key变量
var key = 'note';
console.log(obj.key); //undefined
方括号语法
- 这种书写方式, 是把变量key解析出实际的值 —> ‘name’
- 所以 obj[key] —> obj[‘name’] —> 张三
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
// 定义一个key变量
var key = 'name';
console.log(obj[key]); //张三
五、遍历对象
- 就是拿到对象的所有
键值对
var obj = {
name:'张三',
age:18,
123:123,
'@':'特殊符号1',
'$':'特殊符号2'
}
console.log(obj);
// for...in 循环
for (var key in obj) {
// console.log(key) // 每一轮循环拿到的都是对象的key
console.log(key, obj[key])
}
