第三节:数据类型——Object对象

Object对象:由属性构成的无序集合;

1、对象与原始类型的区别:

  • 对象有属性;对象对应的值可以是原始数据类型也可以是对象,对象的属性和对应的值这种表示方式称之为键值对,属性名又称之为键名,值称之为键值;键值可以是原始数据类型也可以是对象,也可能是一个方法;
  • 对象有方法;方法其实就是对象的特殊属性(由function对应的一个方法);
  • 对象可以改变(对象的属性可以进行改变)

2、对象的分类(可能有不同的分法)

  • 内部对象,JS有17个内部对象,内部对象又可以分为错误对象(代表各种错误和报错)、常用对象(布尔类型、字符串、数字类型、数组、时间、函数Functon、Object、正则表达式)、内置对象(Math、global、json)
  • 数组对象(常用有:windows和document)
  • 自定义对象
Object(true);//Boolean {true} ,返回一个对象,[[PrimitiveValue]]: true
Object(123);//Number {123} 与布尔值一样
Object('abc');//String {'abc'} 0: "a" 1: "b"  2: "c"  length: 3,字符串不太一样,会有多个属性(0,1,2,长度,原始值)
Object(null); //{}  空对象
Object(undefined); //{} 空对象

3、对象转原始类型

//无论对象是什么转布尔都返回true
Boolean({});//true
Boolean({a:1,b:2});//true
//常见的面试的坑
Boolean(new Boolean(false));//true,使用new操作符来创建一个布尔类型**对象**,传进来一个false,又通过Boolean函数将对象转换为布尔类型
//解析:new Boolean(false)是布尔值的包装对象    typeof (new Boolean(false))  // 'object'  ,所以 转换为boolean是true,而不是false
//原始数据类型是没有方法的,  但是我们却可以有如下用法 
true.toString()   //'true'
//这是因为,在对原始类型使用方法时,会自动通过Boolean()构造一个临时对象,访问的方法均来自这个临时对象,同样的数字和字符串对应有Number()和String() 所以都可以调用方法如(toString());而 undefined 和 null 没有对应的包装对象,所以访问他们的属性会报错
var a='abc';
var b = 123;
var c = false;
var d = null;
var e = undefined;
a.toString();//'abc'
b.toString();//'123'
c.toString();//'false'
d.toString();//报错 Cannot read properties of null (reading 'toString')
e.toString();//报错 Cannot read properties of undefined (reading 'toString')
[{a:1},{a:2},{a:3},{a:4}].toString();//'[object Object],[object Object],[object Object],[object Object]'
new Date().toString();//'Tue Oct 26 2021 17:06:30 GMT+0800 (中国标准时间)'
//toString() 方法可把一个 Number 对象转换为一个字符串,并返回结果

JS内部对象转换为字符串的实现方法:首先调用toString()方法,如果得到字符串则直接返回,如果不能得到字符串会再调用valueOf()方法
JS内部对象转换为数字的实现方法:首先调用valueOf()方法,再调用toString()方法

参考:布尔类型,布尔值只有6个值会转为false,其余都是true

4、创建对象的几种方式

//1、对象直接量创建对象
var person = {name:'json',age:18, work:'doctor'};
console.log(person);//{name: 'json', age: 18, work: 'doctor'}
//2、使用new操作符
var obj = new Object();
obj.name='Tom';
obj.age=20;
console.log(obj);//{name: 'Tom', age: 20}
//3、Object.create() 方式创建
var a = { rep: 'apple' }
var b = Object.create(a)
console.log(b)  // {}
console.log(b.__proto__) // {rep: "apple"}
console.log(b.rep) // {rep: "apple"}

new Object() 和 Object.create() 的区别
new Object() 通过构造函数来创建对象, 添加的属性是在自身实例下。
Object.create() es6创建对象的另一种方式,可以理解为继承一个对象, 添加的属性是在原型下

// new Object() 方式创建
var a = {  rep : 'apple' }
var b = new Object(a)
console.log(b) // {rep: "apple"}
console.log(b.__proto__) // {}
console.log(b.rep) // {rep: "apple"}
// Object.create() 方式创建,Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__,语法:Object.create(proto,[propertiesObject])
//proto  新创建对象的原型对象
//propertiesObject   可选。需要传入一个对象
var a = { rep: 'apple' }
var b = Object.create(a)
console.log(b)  // {}
console.log(b.__proto__) // {rep: "apple"}
console.log(b.rep) // {rep: "apple"}
//传入第二个参数,参数写法参照下面代码
var a={rep:'apple'};
var b = Object.create(a,{
  'property1': {
    value: true,
    writable: true
  },
  'property2': {
    value: 'Hello',
    writable: false
  }});
  console.log(b)//{property1: true, property2: 'Hello'}

5、查找对象的属性

  • 使用点
  • 使用中括号

JS解释器的运行原理:JS解释器碰到点或者中括号前面是不是 null 或undefined,如果是则报错;如果不是则判断点和中括号前面是不是一个对象,如果不是会先转化为对象(这就是为什么基础属于类型也可以使用toString()或者valueOf()方法),转化为对象之后,如果是点则直接把对应的名字返回回来,如果是括号首先将括号的内容进行计算,然后转换为字符串返回回来(例如数组的中括号查找),当属性名称不存在则返回undefined。

var a = 'abc';
a.toString();//'abc'
var person = {name:'json',age:18, work:'doctor'};
person.name;//'json'
person.aa; //undefined
//数组的中括号查找
var arr = ['aa','bb','cc','dd','ee','ff','gg'];
arr[0]; //'aa' ,中括号中为数字,会先将数字转化为字符串,所以下标为字符串也可以查找到对应的值
arr['0'];//'aa', 中括号中为字符串
arr[10]; //undefined,属性10不存在,返回undefined

备注:本内容学习总结来源于喜马拉雅冰山工作室沙翼老师主讲的(陪你读书(JavaScript WEB前端))

你可能感兴趣的:(js学习整理,javascript)