对象
对象概念
①对象（object）：JavaScript里的一种数据类型
②可以理解为是一种无序的数据集合
③用来描述某个事物，例如描述一个人
-
人有姓名、年龄、性别等信息、还有吃饭睡觉打代码等功能
-
如果用多个变量保存则比较散，用对象比较统一
④比如描述 班主任 信息：
-
静态特征 (姓名, 年龄, 身高, 性别, 爱好) => 可以使用数字, 字符串, 数组, 布尔类型等表示
-
动态行为 (点名, 唱, 跳, rap) => 使用函数表示
对象使用
①声明对象
let 对象名 = {}
//声明一个person的对象
let person = {}
②对象有属性和方法组成
-
属性：信息或叫特征（名词）。 比如 手机尺寸、颜色、重量等…
-
方法：功能或叫行为（动词）。 比如 手机打电话、发短信、玩游戏…
let 对象名 ={
属性名 ：属性值,
方法名 ：函数
}
③属性
数据描述性的信息称为属性，如人的姓名、身高、年龄、性别等，一般是名词性的。
- 属性都是成 对出现的，包括属性名和值，它们之间使用英文 : 分隔
- 多个属性之间使用英文 , 分隔
- 属性就是依附在对象上的变量（外面是变量，对象内是属性）
- 属性名可以使用 "" 或 ''，一般情况下省略，除非名称遇到特殊符号如空格、中横线等
<script>
let person = {
userName : 'leilei',
age : 18,
sex : '女',
hobby : 'eat',
}
console.log(typeof person);
console.log(person);
</script>
④属性访问
声明对象，并添加了若干属性后，可以使用 . 或 [ ] 获得对象中属性对应的值，我称之为属性访问。
简单理解就是获得对象里面的属性值。
<script>
let goods = {
goodsName : '小米',
goodsPrice : 1999,
goodsSize : '小屏幕',
};
//表达一
console.log(goods.goodsName);
console.log(goods.goodsPrice);
console.log(goods.goodsSize);
//表达二
document.write(`手机名称${goods['goodsName']},价格${goods['goodsPrice']},型号${goods['goodsSize']}`)
</script>
⑤对象中的方法
数据行为性的信息称为方法，如跑步、唱歌等，一般是动词性的，其本质是函数。
- 方法是由方法名和函数两部分构成，它们之间使用 : 分隔
- 多个属性之间使用英文 , 分隔
- 方法是依附在对象中的函数
- 方法名可以使用 "" 或 ''，一般情况下省略，除非名称遇到特殊符号如空格、中横线等
let person = {
name : 'leilei',
sayHi : function (lala) {
document.write(lala);
return '打声招呼吧'
}
}
⑥对象中的方法访问
声明对象，并添加了若干方法后，可以使用 . 调用对象中函数，我称之为方法调用
注意：千万别忘了给方法名后面加小括号
<script>
let person = {
name: 'leilei',
sayHi: function (lala) {
document.write(lala);
return '打声招呼吧'
}
}
//对象名.方法名
person.sayHi('你好<br>');
person.sayHi('hello');
let result = person.sayHi('hi~~');
console.log(result);
</script>
操作对象
①查询对象
- 对象.属性 或者 对象[‘属性’]
<script>
let person = {
username : '海贼王',
color : 'yellow',
};
//两种查看方式
console.log(person.username); //常用
console.log(person['username']);//少用
</script>
- 对象.方法()
<script>
let person = {
name : 'leilei',
sayHi : function (lala) {
document.write(lala);
}
}
person.
person.sayHi('你好<br>');//查对象方法
person.sayHi('hello');
</script>
②重新赋值
- 对象.属性 = 值
- 对象.方法 = function() {}
<script>
let person = {
username : '阿猫',
};
//修改(若该属性已有值,则会替换原来的属性)
person.username = '咩咩'
console.log(person);
</script>
③对象添加新的数据
注：无论是属性或是方法，同一个对象中出现名称一样的，后面的会覆盖前面的
- 对象名.新属性名 = 新值
<script>
let person = {
username : '阿猫',
};
//增加一个新的属性
person.userName = '阿狗';
console.log(person);
//新增方法也是可以的
// let person = {};
//新增一个方法 匿名函数 固定写法
person.sayHi = function() {
document.write('这个是我们新增的sayHi 方法');
};
person.sayHi();//调用方法
</script>
④删除对象中属性
- delete 对象名.属性名
<script>
// 声明一个对象
let person={
username:"海贼王"
};
// 不想看了 给删除掉
delete person.username; // 删除对象中的 username属性
console.log(person.username); // undefined
</script>
遍历对象
定义：
- 对象没有像数组一样的length属性,所以无法确定长度
- 对象里面是无序的键值对, 没有规律. 不像数组里面有规律的下标
- 语句：for in
<script>
let person = {
name : 'leilei',
age : 12,
weight : 95,
};
//遍历对象 for in
for (let k in person) {
// console.log(person.k); //错误写法，会找对象中 属性名为 "k"
//console.log(person['k']);//错误写法，会找对象中 属性名为 "k"
console.log(person[k]);//正确：k不加引号
}
</script>
注意：
一般不用这种方式遍历数组、主要是用来遍历对象
一定记住： k 是获得对象的属性名， 对象名**[k]** 是获得 属性值
内置对象
①内置对象Mach
-
Math对象是JavaScript提供的一个“数学高手”对象
-
提供了一系列做数学运算的方法
-
方法有：
random：生成0-1之间的随机数（包含0不包括1）
ceil：向上取整
floor：向下取整
round：四舍五入
max：找最大数
min：找最小数
pow：幂运算
abs：绝对值
<script>
//生成0-1的随机数 （包含0不包括1）
console.log(Math.random());
//向上取整
console.log(Math.ceil(0.01));//1
//向下取整
console.log(Math.floor(6.6));//6
//四舍五入
console.log(Math.round(8.5));//9
//找最大数
console.log(Math.max(6, 8, 66, 53, 22, 9));//66
//找最小数
console.log(Math.min(6, 8, 66, 53, 22, 9));
//幂运算
console.log(Math.pow(3, 3));//3的立方
console.log(Math.pow(3, 2));//3的平方
//绝对值
console.log(Math.abs(-3));//3
//如何生成0-10的随机数呢？
console.log(Math.round(Math.random() * 10 ));
//如何生成5-10的随机数？
console.log(Math.round(Math.random() * 5 + 5));
//如何生成N-M之间的随机数
console.log(Math.ceil(Math.random() * (M - N) + N)) ;
</script>
拓展
术语解释
| 术语 | 解释 | 举例 |
|---|---|---|
| 关键字 | 在JavaScript中有特殊意义的词汇 | let、var、function、if、else、switch、case、break |
| 保留字 | 在目前的JavaScript中没意义，但未来可能会具有特殊意义的词汇 | int、short、long、char |
| 标识（标识符） | 变量名、函数名的另一种叫法 | 无 |
| 表达式 | 能产生值的代码，一般配合运算符出现 | 10 + 3、age >= 18 |
| 语句 | 一句代码也称之为一条语句，一般按用途还会分类：输出语句、声明语句、分支语句 | 无 |
拓展：数据类型(栈、堆)
-
简单类型又叫做基本数据类型或者值类型，复杂类型又叫做引用类型。
-
值类型：简单数据类型/基本数据类型，在存储时变量中存储的是值本身，因此叫做值类型
string ，number，boolean，undefined，null
-
引用类型：复杂数据类型，在存储时变量中存储的仅仅是地址（引用），因此叫做引用数据类型
-
通过 new 关键字创建的对象（系统对象、自定义对象），如 Object、Array、Date等
堆栈空间分配区别：
①栈（操作系统）：由操作系统自动分配释放存放函数的参数值、局部变量的值等。其操作方式类似于数据结构中的栈；
简单数据类型存放到栈里面：string ，number，boolean，undefined，null
②堆（操作系统）：存储复杂类型(对象)，一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收。
引用类型变量（栈空间）里存放的是地址，真正的对象实例存放在堆空间中：Object、Array、Dat
<script>
/*
栈
1 适合存放具体具体大小的数据， 这一些数据一般变化不会太大
let num =100;
let show=true;
let msg="你好";
堆
1 适合存放可能会经常改变大小的数据，这一些数据变化比较大
let person={}
person.name="悟空" // 增加数据的属性
delete person.name // 删除了数据的属性
let arr=[];
for 100次 arr.push(index) // 数组 被修改的比较多了
arr.splice(3,1)// 修改元素了
只要我们开始声明一个变量 ，内存中就开始开辟了空间
let a=100 ;// 有a在， 开辟空间 来存放变量 （写代码 故意写了很多个 let 。。。。 浪费内存 性能下去）
两个都是存放数据的地方
*/
let num = 100; // 基本数据类型 放心的是复制吧 新旧两个数据 互不影响
let num2 = num;
num2 = 10000;
console.log(num); // 100 互不影响
let person={username:"悟空"};// 引用数据类型
let person2=person; // 引用地址的传递 复制而已 新旧数据 本质是一样的 会收到影响
person2.username="八戒";
console.log(person);// 也是八戒 新旧数据 本质是一样的
</script>
补充（switch-case 和do-while）
条件语句switch-case
①switch-case 功能和 if else-if else 一模一样
②switch-case-break-defaul
- switch(day) 想要对 day做判断
- case 1 ： day ===1 满足条件
- break 打断当前的case
- default 如果以上的 case 都不满足，最终 执行default里面的代码
<script>
//跟if else 的用法一致
let day = 2;
switch (day) {//要判断谁
case 1://与if(day === 1)一样
console.log('吃蛋糕');//执行1的业务逻辑
break;
case 2:
console.log('吃草莓');
break;
case 1:
console.log('吃芒果');
break;
default:
//以上都不满足就执行代码
console.log('不吃了');
break;
}
</script>
do-while循环
①循环 3种写法
- for 循环
- while 循环
- do while 循环 很少 先执行一次 do里面的代码，然后再去执行while里面的程序 哪怕 while里面的条件不成立 也会先执行一次do中的代码
<script>
let index = 0;
do {
console.log('执行了do 里面的代码',index);
index++
} while (false);
</script>
