JavaScript 对象创建详解:内置对象、JSON 格式与构造函数

作者:青柠

时间:2026-10-25

浏览:536

本文详细介绍 JavaScript 中对象的创建方式,涵盖 Array、Date 等内置对象的使用。重点讲解通过 new 关键字和 JSON 格式创建对象的语法,以及利用构造函数实例化对象的方法。通过代码示例解析对象属性与方法的定义,帮助开发者理解 JavaScript 对象的字典结构特性。

文章目录
1、javascript中的内置对象

JavaScript 内置对象概述

在 JavaScript 中,除了开发者自定义的对象外,语言本身提供了一系列内置对象,例如我们熟知的以下类型:


•Array(数组)


•Date(日期)


•Math(数学计算)


•String(字符串)


•RegExp(正则表达式)


•……

每个内置对象都拥有特定的属性和方法,例如我们经常调用的:


属性访问:stringObject.length; arrayObject.length;……


方法调用:stringObject.indexOf(); stringObject.splite(); stringObject.substr(); arrayObject.concat(); arrayObject.push(); arrayObject.join();……


2、如何自定义对象,及添加属性和方法

使用 new 关键字与 JSON 格式创建对象

a. 使用关键字 new 进行创建


代码如下:

 
var newObject = new Object(); //创建一个新类
newObject.name = "new object"; //添加一个name的属性
newObject.say = function() { //添加say()方法
alert(this.name); //output new object
} 

对于上述创建方式,我们可以利用 JSON(JavaScript Object Notation)的语法进行简化,代码如下:


代码如下:

 
var newObject = {
name: "new object";
say: function () {
alert(this.name);
} 
}; 

我们利用 JSON 的数据格式来构建一个结构更复杂的对象:


代码如下:

 
var company = {
name: "tuanzz",
product: "groupon",
address: {province: "Hubei", city: "wuhan"},
person:[
{name: "zhangchen",age: "23"},
{name: "luomi", age: "23"},
], 
readme: function() {
alert("My name is "+this.person[0].name+" and "+this.person[0].age+" years old");
} 
}; 
company.readme(); //output My name is zhangchen and 23 years old;

可以看出,使用 JSON 格式创建对象不仅代码更加简洁优雅。


JSON 形式由大括号“{}”包裹项目列表,各项目间以逗号“,”分隔,项目内部通过冒号“:”区分属性名和属性值。这体现了典型的字典表示形式,也再次印证了 JavaScript 中的对象本质上是字典结构。无论对象多么复杂,均可通过一句 JSON 代码完成创建与赋值。


通过构造函数实例化对象

b、通过构造函数来创建对象


代码如下:

 
function objectFun(name) {
this.name = name;
this.say = function() {
alert(this.name);
} 
} 
var newObject = new objectFun("zhangchen");
newObject.say(); //output zhangchen

首先定义一个 objectFun() 函数,在其中声明属性和方法。在 JavaScript 中,函数本身也是对象,因此我们可以将 objectFun 视为一个类,随后通过 new 关键字实例化出一个对象。生成的 newObject 对象将继承父类中的属性和方法。


我们可以使用以下代码来验证函数确实是一个对象:


代码如下:

 
//普通函数
function say(s) {
alert(s);
} 
say("hi");
//给函数对象赋属性,函数就是对象
say.test = "it can work?";
alert(say.test); //output it can work?

如何理解上述对象创建方法?参考以下代码:


代码如下:

 
function objectFun(name) {
this.name = name;
this.say = function() {
alert(this.name);
} 
} 
var newObject = new Object(); //创建一个空对象
objectFun.call(newObject, "zhangchen"); //将newObject作为this参数调用objectFun函数
newObject.say("zhangchen");//output zhangchen

首先创建一个 newObject 对象,并将其作为 this 参数传递给 objectFun 函数进行调用。经过上述分析,我们完全可以将 objectFun 直接作为构造函数使用。


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

余下内容大家可参考李战写的悟透JavaScript

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章