当前位置：首页 > news >正文

js 对象

news 来源：原创 2024/5/4 17:33:12

JavaScript 的设计是一个简单的基于对象的范式。一个对象就是一系列属性的集合，一个属性包含一个名和一个值。一个属性的值可以是函数，这种情况下属性也被称为方法。除了浏览器里面预定义的那些对象之外，你也可以定义你自己的对象。

定义对象

JavaScript 拥有一系列预定义的对象。另外，你可以创建你自己的对象。从 JavaScript 1.2 之后，你可以通过对象初始化器（Object Initializer）创建对象。或者你可以创建一个构造函数并使用该函数和 new 操作符初始化对象。

通过对象初始化器创建对象的语法如下：

var obj = { property_1:   value_1,   // property_# 可以是一个标识符
            2:            value_2,   // 或一个数字
           ["property" +3]: value_3,  //  或一个可计算的 key 名
            // ...,
            "property n": value_n }; // 或一个字符串

作为另一种方式，你可以通过两步来创建对象：

1、通过创建一个构造函数来定义对象的类型。首字母大写是非常普遍而且很恰当的惯用法。
2、通过 new 创建对象实例。

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}
var mycar = new Car("Eagle", "Talon TSi", 1993);

上面提到的都是属性值不是函数的情况，如果一个对象的属性包含函数，应该怎么定义这个函数呢？定义方法就像定义普通的函数，除了它们必须被赋给对象的某个属性。

objectName.methodname = function_name;

var myObj = {
  myMethod: function(params) {
    // ...do something
  }

  // 或者 这样写也可以
  myOtherMethod(params) {
    // ...do something else
  }
};

也可以在对象的构造函数中包含方法定义来为某个对象类型定义方法。注意使用 this 指代方法所属的对象。

function displayCar() {
  var result = `A Beautiful ${this.year} ${this.make} ${this.model}`;
  pretty_print(result);
}
function Car(make, model, year, owner) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.owner = owner;
  this.displayCar = displayCar;
}

访问对象

在 JavaScript 1.0 中，你可以通过名称或序号访问一个属性。但是在 JavaScript 1.1 及之后版本中，如果你最初使用名称定义了一个属性，则你必须通过名称来访问它；而如果你最初使用序号来定义一个属性，则你必须通过索引来访问它。

// 访问对象属性方式一
obj.name
// 访问对象属性方式二
obj['name']
// 访问对象属性方式三
// 将对象属性赋值给一个变量，使用变量方式访问
var key = 'name'
obj[key]

JavaScript 有一个特殊的关键字 this，它可以在方法中使用以指代当前对象。例如，假设你有一个名为 validate 的函数，它根据给出的最大与最小值检查某个对象的 value 属性：

function validate(obj, lowval, hival) {
  if ((obj.value < lowval) || (obj.value > hival)) {
    alert("Invalid Value!");
  }
}

然后，你可以在每个元素的 onchange 事件处理器中调用 validate，并通过 this 传入相应元素，代码如下：

<input type="text" name="age" size="3" onChange="validate(this, 18, 99)">

修改对象

可以通过 prototype属性为之前定义的对象类型增加属性。这为该类型的所有对象，而不是仅仅一个对象增加了一个属性。下面的代码为所有类型为 car 的对象增加了 color 属性，然后为对象 car1 的 color 属性赋值：

Car.prototype.color = null;
car1.color = "black";

可以通过访问对象属性的形式为属性赋值来修改属性或者增加属性。

// 添加一个属性方式一
obj.nickName = "小明"
// 添加一个属性方式二
obj["nickName"] = "小明"
console.log(obj)
// {name: '李明', age: 19, gender: 'man', city: '山东', hobby: '游泳', nickName: "小明"}

可以用 delete 操作符删除一个不是继承而来的属性。下面的例子说明如何删除一个属性：

//Creates a new object, myobj, with two properties, a and b.
var myobj = new Object;
myobj.a = 5;
myobj.b = 12;

//Removes the a property, leaving myobj with only the b property.
delete myobj.a;