现代Javascript教程 - 学习笔记03 - 对象

Tomorrowed
106 阅读3分钟

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第3天，点击查看活动详情。

开始记录对象的学习内容！内容很多，分开写！一个一个啃！

最近上班,对于对象的理解 - form表单，都使用对象的属性，进行存储，通过axios统一返回给接口！

学习链接

简介

对象 - 用来存储键值对

对象创建

  • new Object(); // “构造函数” 的语法 - new
  • {}; // “字面量” 的语法 - 直接写内容 - 常用！

对象读取 - 通过 . 的方式 - obj.name - 点后面的是key

对象获取 - 方括号 - [] - 方括号可以获取对象，字符，数组。。。

  • 对象中放的是obj[key]
  • 这里中括号可以是变量 - 程序运行时计算得到！
  • . 的方式就不能使用变量了

对象的值可以是任意类型 - 键只能是字符串 - 今天看了map章节看到的！

对象的计算属性。。。

  • 指的是用中括号里的内容当作键，动态获取。。
  • 上面的是取值的时候，这里是创建的时候。。。

对象属性的简写

  • 如果属性和值相等 - 可以只写一个 - vue中有用到！

属性存在的测试

  • 通过in操作符，不存在返回undefined，存在返回true。
  • 这个in还可以联想到用for in 来遍历对象。
  • in 的左边必须是属性！！！通场带双引号！注意key，只能字符串，map才可以其他当作key

image.png

对象遍历

  • for in，适用对象，Js引擎做了优化
  • for of，适用数组，如果用for in，遍历数组，在类数组中，会出现问题，访问到其他内容

对象排序

  • 这没怎么试过。。
  • 未解。。遇到再看看。。

对象删除

  • delete obj.prop
  • 作用数组的话，空间还是保留的，没有删除！

其他对象

  • Array - 数组是基于对象实现的！看看那些api和取值的方法
  • Data
  • Error等。。。

对象的一些题目

  • 对象属性求和 - for in 遍历，中括号【】访问值，然后累加
  • 将数值属性值都乘2 - 遍历的时候，typeof判断访问的是否是数字类型

对象引用和复制

学完这里，就可以引出下一部分，垃圾回收！

对象和原始类型的根本区别 - 引用！对象存的是一个地址！

赋值了对象的变量存储的不是对象本身，而是该对象“在内存中的地址” —— 换句话说就是对该对象的“引用”。

let user = { name: "John" }; 
let admin = user; // 复制引用

image.png

直接赋值，他们访问到的是同一地方！如果修改，两个都会变。。

image.png

克隆和合并 - 适用api - Object.assign

  • 浅拷贝 - 只是赋值。原始数据修改，都修改，修改内部对象内容，也修改！
  • 深拷贝 - 如果里面有对象，对象内容，不会一起修改！

如何进行深拷贝，这是个面试题呀！ - 想想工作中哪里用的到！做备份？？？ image.png

垃圾回收

JavaScript 中主要的内存管理概念是 可达性。

可以访问到！- 不会被回收！

垃圾回收 - 释放空间！

image.png

如何释放空间，，文章看来的都是对象的释放。

let obj = {........};

obj = null - 这个引用就没了，达到释放效果

如果还有其他对象，也能访问到，它就不消失，需要所有都访问不到，才能回收！
其他能访问到它的，都设为 null。。。。

垃圾回收的步骤！

  • 总：垃圾收集器，遍历所有根，标记它们 - 遍历 + 标记
  • 遍历 并 标记所有的引用！
  • 遍历标记的对象 并标记它们的引用，直到所有对象都被标记，
  • 没有被标记的就会被删除！

优化建议 - 我是啥建议也没有。。。

image.png

总结

今天主要学习了，对象的基础知识，如何拷贝，以及了解垃圾回收。也补充了一些后面章节的内容。还在入门阶段呀！加油！

努力的意义就是，以后的日子里，放眼望去，全部都是自己喜欢的人和事

avatar
文章
阅读
粉丝