JS对象：创建、使用方法比较

本文链接：https://blog.csdn.net/qq_42676176/article/details/125181131

对象

一组无序相关属性和方法的集合

一、创建、使用的若干方法

工厂方式

失败点：函数使用obj.–》

构造函数会重复生成函数

function showColor() {
  alert(this.color);
}

function createCar(sColor,iDoors,iMpg) {
  var oTempCar = new Object;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  oTempCar.showColor = showColor;
  return oTempCar;
}

var oCar1 = createCar("red",4,23);
var oCar2 = createCar("blue",3,25);

oCar1.showColor();		//输出 "red"
oCar2.showColor();

构造函数方式

失败点：函数使用this–》

构造函数会重复生成函数

function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.showColor = function() {
    alert(this.color);
  };
}

var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);

原型方式

失败点：属性使用原型–》

不能传参，属性指向的是对象非函数，一个实例修改属性会影响其他实例

function Car() {
}

Car.prototype.color = "blue";
Car.prototype.doors = 4;
Car.prototype.mpg = 25;
Car.prototype.drivers = new Array("Mike","John");
Car.prototype.showColor = function() {
  alert(this.color);
};

var oCar1 = new Car();
var oCar2 = new Car();

oCar1.drivers.push("Bill");

alert(oCar1.drivers);	//输出 "Mike,John,Bill"
alert(oCar2.drivers);	//输出 "Mike,John,Bill"

联合混合构造

（不像传统对象

function Car(sColor,iDoors,iMpg) {
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.drivers = new Array("Mike","John");
}

Car.prototype.showColor = function() {
  alert(this.color);
};

var oCar1 = new Car("red",4,23);
var oCar2 = new Car("blue",3,25);

oCar1.drivers.push("Bill");

alert(oCar1.drivers);	//输出 "Mike,John,Bill"
alert(oCar2.drivers);	//输出 "Mike,John"


-----------------------------------------------



function Book(title, pages, isbn) { // {1}  this.title = title;  this.pages = pages;  this.isbn = isbn;}Book.prototype.printTitle = function() {  console.log(this.title);};

作者：图灵教育
链接：https://leetcode.cn/leetbook/read/javascript-data-structures-and-algorithms/pnhrxi/
来源：力扣（LeetCode）
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

动态原型

class Car {
  public String color = "blue";
  public int doors = 4;
  public int mpg = 25;

  public Car(String color, int doors, int mpg) {//构造函数
    this.color = color;
    this.doors = doors;
    this.mpg = mpg;
  }
  
  public void showColor() {
    System.out.println(color);
  }
}

ES2015语法简化

class Book { // {2}
  constructor(title, pages, isbn) {
    this.title = title;
    this.pages = pages;
    this.isbn = isbn;
  }
  printIsbn() {
    console.log(this.isbn);
  }
}
/*
\只需要使用 class 关键字，声明一个有 constructor 函数和诸如 printIsbn 等其他函数的类。ES2015 的类是基于原型语法的语法糖。
*/

作者：图灵教育
链接：https://leetcode.cn/leetbook/read/javascript-data-structures-and-algorithms/pnhrxi/
来源：力扣（LeetCode）
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

二、相关概念

1.字面量

怎么这么像json数据格式

创建

对象字面量：就是花括号 { } 里面包含了表达这个具体事物（对象）的属性和方法。
{ } 里面采取键值对的形式表示
键：相当于属性名
值：相当于属性值，可以是任意类型的值（数字类型、字符串类型、布尔类型，函数类型等）

var star = {
    name : 'pink',
    age : 18,
    sex : '男',
    sayHi : function(){
        alert('大家好啊~');
    }
};

使用

属性：star.name star['name']

对象里面的属性调用 : 对象.属性名，这个小点 . 就理解为“ 的 ”
对象里面属性的另一种调用方式 : 对象[‘属性名’]，注意方括号里面的属性必须加引号
对象里面的方法调用：对象.方法名() ，注意这个方法名字后面一定加括号

2.Object

Object() ：第一个字母大写
new Object() ：需要 new 关键字
使用的格式：对象.属性 = 值;

var andy = new Obect();
andy.name = 'pink';
andy.age = 18;
andy.sex = '男';
andy.prototype.sayHi = function(){
    alert('大家好啊~');
}

3.构造函数

是一种特殊的函数，主要用来初始化对象，即为对象成员变量赋初始值，它总与 new 运算符一起使用。我们可以把对象中一些公共的属性和方法抽取出来，然后封装到这个函数里面。

注意
1. 构造函数约定首字母大写。
2. 函数内的属性和方法前面需要添加 this ，表示当前对象的属性和方法。
3. 构造函数中不需要 return 返回结果。
4. 当我们创建对象的时候，必须用 new 来调用构造函数。

function Person(name, age, sex) {
     this.name = name;
     this.age = age;
     this.sex = sex;
     this.sayHi = function() {
      alert('我的名字叫：' + this.name + '，年龄：' + this.age + '，性别：' + this.sex);
    }
}
var bigbai = new Person('大白', 100, '男');
var smallbai = new Person('小白', 21, '男');
console.log(bigbai.name);
console.log(smallbai.name);

构造函数，如 Stars()，抽象了对象的公共部分，封装到了函数里面，它泛指某一大类（class）
创建对象，如 new Stars()，特指某一个，通过 new 关键字创建对象的过程我们也称为对象实例化

new

new 在执行时会做四件事情：

在内存中创建一个新的空对象。
让 this 指向这个新的对象。
执行构造函数里面的代码，给这个新对象添加属性和方法。
返回这个新对象（所以构造函数里面不需要return）。

遍历数组或对象属性

案例

for (var k in obj) {
    console.log(k);      // 这里的 k 是属性名
    console.log(obj[k]); // 这里的 obj[k] 是属性值
}

语法

for (变量 in 对象名字) {
    // 在此执行代码
}

复杂

如数组、对象这类变量实际指向内容的存储地址的（而非内容的），全局复杂变量在函数中改变变量值会影响在全局的值。而string ，number，boolean，undefined，null。

执行时：先声明