导航
×
   ❮   
HTML CSS JavaScript PHP Go Sass W3C Colors ECMS

JS 教程

JS 简介 JS 如何使用 JS 输出 JS 语法 JS 语句 JS 注释 JS 变量 JS 运算符 JS 条件语句 JS 循环 JS 字符串 JS 数字 JS 函数 JS 对象 JS 日期 JS 数组 JS 类型化数组 JS 集合 JS Map 映射 JS Math JS 正则表达式 JS 数据类型 JS 错误 JS 事件 JS 编程 JS 关键字参考 JS 保留关键字参考 JS 运算符参考 JS 运算符优先级 JS UTF-8 字符 JS UTF-8 符号 JS UTF-8 表情符号 JS 版本

JS 高级教程

JS 对象 JS 函数 JS 类 JS 迭代 JS Promises JS 模块

JavaScript 对象构造器


实例

function Person(first, last, age, eye) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eye;
}
亲自试一试 »

用大写首字母对构造器函数命名是个好习惯。


对象类型(蓝图)(类)

前一章的实例是有限制的。它们只创建单一对象。

有时我们需要创建相同"类型"的许多对象的"蓝图"。

创建一种"对象类型"的方法,是使用对象构造器函数

在上面的例子中,function Person() 就是对象构造器函数。

通过 new 关键词调用构造器函数可以创建相同类型的对象:

var myFather = new Person("John", "Doe", 50, "blue");
var myMother = new Person("Sally", "Rally", 48, "green");
亲自试一试 »

this 关键词

在 JavaScript 中,被称为 this 的事物是代码的"拥有者"。

this 的值,在对象中使用时,就是对象本身。

在构造器函数中,this 是没有值的。它是新对象的替代物。 当一个新对象被创建时,this 的值会成为这个新对象。

请注意 this 并不是变量。它是关键词。您无法改变 this 的值。


为对象添加属性

为已有的对象添加新属性很简单:

实例

myFather.nationality = "English";
亲自试一试 »

新属性被添加到 myFather。不是 myMother,也不是任何其他 person 对象。


为对象添加方法

为已有的对象添加新方法很简单:

实例

myFather.name = function () {
  return this.firstName + " " + this.lastName;
};
亲自试一试 »

新方法被添加到 myFather。不是 myMother,也不是任何其他 person 对象。


为构造器添加属性

与向已有对象添加新属性不同,您无法为对象构造器添加新属性:

实例

 Person.nationality = "English";
亲自试一试 »

如需向构造器添加一个新属性,您必须添加到构造器函数:

实例

function Person(first, last, age, eyecolor) {
   this.firstName = first;
   this.lastName = last;
   this.age = age;
  this.eyeColor = eyecolor;
  this.nationality = "English";
}
亲自试一试 »

这样对象属性就可以拥有默认值。


为构造器添加方法

您的构造器函数也可以定义方法:

实例

function Person(first, last, age, eyecolor) {
   this.firstName = first;
   this.lastName = last;
   this.age = age;
   this.eyeColor = eyecolor;
  this.name = function() {return this.firstName + " " + this.lastName;};
}
亲自试一试 »

与向已有对象添加新方法不同,您无法为对象构造器添加新方法。

必须在构造器函数内部向一个对象添加方法:

实例

function Person(firstName, lastName, age, eyeColor) {
  this.firstName = firstName;  
   this.lastName = lastName;
   this.age = age;
  this.eyeColor = eyeColor;
  this.changeName = function (name) {
     this.lastName = name;
  };
}

changeName() 函数把 name 赋值给 person 的 lastName 属性。

现在您可以试一试:

myMother.changeName("Doe");
亲自试一试 »

通过用 myMother 替代 this,JavaScript 可以获知目前处理的哪个 person。


内建 JavaScript 构造器

JavaScript 提供用于原始对象的构造器:

实例

var x1 = new Object();    // 一个新的 Object 对象
var x2 = new String();    // 一个新的 String 对象
var x3 = new Number();    // 一个新的 Number 对象
var x4 = new Boolean();   // 一个新的 Boolean 对象
var x5 = new Array();     // 一个新的数组对象
var x6 = new RegExp();    // 一个新的 RegExp 对象
var x7 = new Function();  // 一个新的函数对象
var x8 = new Date();      // 一个新的日期对象
亲自试一试 »

Math() 对象不再此列。Math 是全局对象。new 关键词不可用于 Math。


您知道吗?

正如以上所见,JavaScript 提供原始数据类型字符串、数字和布尔的对象版本。但是并无理由创建复杂的对象。原始值快得多!

请使用对象字面量 {} 代替 new Object()

请使用字符串字面量 "" 代替 new String()

请使用数值字面量代替 Number()

请使用布尔字面量代替 new Boolean()

请使用数组字面量 [] 代替 new Array()

请使用模式字面量代替 new RexExp()

请使用函数表达式 () {} 代替 new Function()

实例

var x1 = {};            // 新对象
var x2 = "";            // 新的原始字符串
var x3 = 0;             // 新的原始数值
var x4 = false;         // 新的原始布尔值
var x5 = [];            // 新的数组对象
var x6 = /()/           // 新的正则表达式对象
var x7 = function(){};  // 新函数对象
亲自试一试 »

字符串对象

通常,字符串被创建为原始值:var firstName = "John"

但是也可以使用 new 关键词创建字符串对象:var firstName = new String("John")

请在 JS 字符串这一章中学习为何不应该把字符串创建为对象。


数字对象

通常,数值被创建为原始值:var x = 456

但是也可以使用 new 关键词创建数字对象:var x = new Number(456)

请在 JS 数字这一章中学习为何不应该把数值创建为对象。


布尔对象

通常,逻辑值被创建为原始值:var x = false

但是也可以使用 new 关键词创建逻辑对象:var x = new Boolean(false)

请在 JS 逻辑这一章中学习为何不应该把逻辑值创建为对象。


Copyright ©2020-2026 freew3c.com All Rights Reserved 提供的内容仅用于学习和测试,不保证内容的正确性。