DAY_4-回顾，对象，数组基本概念——1
Posted 勇敢*牛牛
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了DAY_4-回顾，对象，数组基本概念——1相关的知识，希望对你有一定的参考价值。
刻在骨子里的记忆
浏览器 把内存分为2块
栈内存=>简单的数据类型
堆内存=>复杂的数据类型+》数据存储在堆里面，数据地址存储在栈的变量里面
函数的定义阶段
- 在堆内存中开辟一段空间
- 把函数体的所有code当做String存储在堆空间中
- 而把这个空间地址赋值给栈中的变量
调用阶段
- 判断变量名是否存在：如果不存在就是
xx is not define - 如果在，就在栈内存中查找地址，如果不是一个函数存储空间报错
:xxx not a function - 在调用栈中开辟一段新的代码执行空间
- 在此代码空间中先进行形参赋值
- 再次代码空间中进 预解析
- 相当于把堆空间的内容复制一份在栈空间中执行一遍（执行的时候开始解析变量）
- 当代码执行完毕后，该执行空间销毁
1. 分支语句 - 循环
1-1. while
while (条件) 代码段
1-2. do while
do 代码段 while (条件)
1-3. for
for (初始化; 条件判断; 改变变量) 代码段
2. 流程控制语句
2-1. break
=> 当循环内遇到 break 的时候, 会直接终止当前循环
2-2. continue
=> 当循环内遇到 continue 的时候, 会结束循环的本次
2-3. 标记语法
=> 给循环添加一个标记, 在 break 和 continue 的时候
=> 可以决定 结束还是终止 哪一个 循环
3. 函数
3-1. 什么是函数
=> 是一个 js 内的复杂数据类型
=> 是一个承载一段代码的 "盒子"
3-2. 函数的两个阶段
=> 函数定义阶段
-> 声明式函数: function 函数名()
-> 函数表达式: var 函数名 = function ()
=> 函数调用阶段
-> 函数名()
-> 注意: 声明式函数可以先调用可以后调用, 函数表达式只能后调用(因为声明式函数会进行预解析)
3-3. 函数的参数
=> 形参
-> 书写在函数定义阶段的小括号内
-> 就是定义在函数内的私有变量
-> 可以书写多个, 多个之间使用 逗号(,) 分隔
-> 形参的值由函数调用时的实参决定
=> 实参
-> 书写在函数调用阶段的小括号内
-> 就是按照顺序依次给形参进行赋值
=> arguments
-> 函数内所有实参的集合
-> length 属性
+ 语法: arguments.length
+ 得到: 该 arguments 的长度, 多少个实参
-> 索引 属性
+ 索引: 从 0 开始, 依次 +1
+ 语法: arguments[索引]
-> 遍历
+ 使用循环遍历 arguments
+ 示例
for (var i = 0; i < arguments.length; i++)
// i 就是 arguments 内每一个的索引
// arguments[i] 就是每一个数据
3-4. 函数的 return
=> return 后面的内容就是该函数的返回值, 也就是执行完毕函数以后得到的结果
=> return 可以打断函数, 当函数内遇到 return 的时候, 直接结束函数
4. 预解析
+ 在代码执行之前, 对代码进行通读并解释
+ 解析两个内容
=> var 关键字
-> 对 var 声明的变量进行定义, 但是不赋值
=> 声明式函数
-> 对 声明式函数进行 函数名的定义, 并且直接赋值为一个函数
+ 预解析的重名问题
=> 当预解析阶段, 遇到函数和变量重名, 以函数为准
+ 函数体内的预解析, 会在函数执行的时候进行
5. 函数的两个过程
5-1. 函数的定义阶段
1. 在堆内存中开辟一段存储空间
2. 把函数体内的代码当做字符串一模一样的存储在空间内(不解析变量, 不执行代码)
3. 把堆内存中的空间地址赋值给栈内存中的变量
5-2. 函数调用阶段
1. 按照变量内存储的地址找到对应的函数空间
2. 在调用栈内开辟一段新的代码执行空间
3. 在代码执行空间内进行 形参赋值
4. 在代码执行空间内进行 预解析
5. 在代码执行空间内进行 代码的执行
6. 代码执行空间销毁
6. 作用域
+ 决定了一个变量(变量和函数)的使用范围
+ 作用域分类
=> 全局作用域: 一个页面就是一个全局作用域(window)
=> 私有作用域: 只有函数生成私有作用域
+ 作用域的三个机制
=> 变量定义机制
-> 你定义在哪一个作用域下的变量, 就是哪一个作用域的私有变量
-> 只能在当前作用域及后代作用域内使用
-> 不能再父级作用域内使用
=> 变量访问机制
-> 当你需要访问一个变量的值的时候
-> 首先在自己作用域内查找, 如果有直接使用, 停止查找
-> 如果没有, 去到父级作用域查找, 如果有直接使用, 停止查找
-> 如果还没有, 就去到在父级作用域查找
-> 以此类推, 直到全局作用域(window) 都没有, 那么报错: xxx is not defined
=> 变量赋值机制
-> 当你需要给一个变量进行赋值操作的时候
-> 首先在自己作用域内查找, 如果有直接赋值, 停止查找
-> 如果没有, 去到父级作用域查找, 如果有直接赋值, 停止查找
-> 如果还没有, 就去到在父级作用域查找
-> 以此类推, 直到全局作用域(window) 都没有
-> 把这个变量定义为全局变量在进行赋值
对象数据类型
认识对象数据类型 - Object
+ 一种存储数据的结构
+ 是一个复杂数据类型
+ 私人: 是一个 "盒子", 承载数据的 "盒子"
+ 是一个 键值对 的集合
创建对象数据类型
1. 字面量方式创建
=> 创建空对象: var obj =
=> 创建带有内容的对象: var obj = 键值对
-> 键值对 键:值
-> 多个键值对之间使用 逗号(,) 分隔
2. 内置构造函数方式创建
=> 创建空对象: var obj = new Object()
对象内的 key
+ 可以随便命名, 建议你遵守变量命名规则和规范
+ 如果你使用 数字字母下划线美元符 以外的内容来命名 key
+ 在书写和将来使用的时候, 需要把 key 用引号包裹(纯数字不需要)
对象内的 value
+ 可以是任何数据类型
1. 字面量方式创建
1-1. 创建空对象
var o1 =
console.log(o1)
1-2. 创建带有内容的对象
var o2 =
aaa: 100,
name: 'Jack',
age: 18,
'user-name': '',
'@#$%^&': 200,
1: 365
console.log(o2)
2. 内置构造函数方式创建
2-1. 创建空对象
var o3 = new Object()
console.log(o3)
存储任何类型的数据
var obj =
name: 'Jack',
age: 18,
gender: '男',
info:
weight: 180,
height: 180
,
play: function () console.log('玩游戏')
console.log(obj)
对象数据类型的基本操作(增删改查/CRUD)
- 增: 向对象内添加一个新成员
- 删: 删除对象内某一个成员
- 改: 修改对象内某一个成员
- 查: 获取到对象内某一个成员内的值
点语法
+ 增
=> 语法: 对象名.键名 = 值
+ 删
=> 语法: delete 对象名.键名
+ 改
=> 语法: 对象名.键名 = 值
=> 对象内的 key 不能重名
=> 原先对象内有就是修改, 原先对象内没有就是增加
+ 查
=> 语法: 对象名.键名
=> 如果对象内有这个键名, 就是该键名对应的数据
=> 如果对象内没有这个键名, 那么就是 undefined
// 1. 增加
// 添加了一个叫做 name 的 key, 值是 'Jack'
obj.name = 'Jack'
obj.age = 18
obj.gender = '男'
console.log('增加之后 : ', obj)
// 2. 删除
// 删除 obj 对象内一个叫做 age 的键
delete obj.age
console.log('删除之后 : ', obj)
// 3. 修改
// 因为 obj 内本身存在 name 数据, 此时就是修改
obj.name = 'Rose'
console.log('修改之后 : ', obj)
// 4. 查
console.log(obj.name)
console.log(obj.gender)
console.log(obj.age)
数组关联语法
+ 增
=> 语法: 对象名['键名'] = 值
+ 删
=> 语法: delete 对象名['键名']
+ 改
=> 语法: 对象名['键名'] = 值
+ 查
=> 语法: 对象名['键名']
准备一个对象
var obj =
console.log('原始对象 : ', obj)
// 1. 增加
obj['name'] = 'Rose'
obj.age = 18
obj['gender'] = '女'
console.log('增加之后 : ', obj)
// 2. 删除
delete obj['name']
console.log('删除之后 : ', obj)
// 3. 修改
obj['age'] = 20
console.log('修改之后 : ', obj)
// 4. 查
console.log(obj['age'])
console.log(obj['gender'])
两套操作语法的区别
- 如果操作的 key 是符合变量命名规则的 key, 没有区别
- 如果操作带有特殊符号或者纯数字的 key, 只能用数组关联语法
- 如果你操作的 key 和 变量有关, 只能使用数组关联语法
// 注意:数组关联语法
console.log('======================================');
var obj_1 =
name:'勇敢牛牛',
age:'22',
info : id:'123',weight:'67',
play:function()
console.log('哈哈哈');
,
console.log(obj_1);
obj_1['ues-name'] = '叭叭叭'
delete obj_1['age']
console.log('Play:',obj_1['play']);
// 注意：运行数组关联式的方法
obj_1['play']()
var message = 'name'
console.log('name:',obj_1[message]);
console.log(obj_1);
console.log('======================================');
对象数据类型的比较
复杂数据类型, 比较的是 地址
var o1 =
var o2 =
console.log(o1)
console.log(o2)
console.log(o1 == o2)
+ 使用 for in 循环遍历
+ 作用: 主要就是用来遍历对象
+ 语法: for (var k in 对象) 重复的代码
=> 会根据对象内有 多少个成员 执行多少次
=> 随着循环, k 分别是对象内的每一个 key(键名), 是一个字符串类型
=> 随着循环, 对象名[k] 就分别是对象内每一个 value(值)
认识数组数据类型 - Array
认识数组数据类型 - Array
+ 是一个数据的集合, 是一个复杂数据类型
+ 是一个有序的数据集合
=> 按照索引进行数据排列
=> 索引: 从 0 开始, 依次 +1
创建数组数据类型
1. 字面量方式创建
1-1. 创建空数组: var arr = []
1-2. 创建带有数据的数组: var arr = [ 数据1, 数据2, 数据3, ... ]
2. 内置构造函数方式创建
2-1. 创建空数组: var arr = new Array()
2-2. 创建带有数据的数组: var arr = new Array( 数据1, 数据2, 数据3, ... )
2-3. 创建指定长度的数组: var arr = new Array(数字)
-> 数字不是填充在数组中的数据, 而是数组的长度
-> 所有位置使用 empty 填充
以上是关于DAY_4-回顾，对象，数组基本概念——1的主要内容，如果未能解决你的问题，请参考以下文章