JavaScript对象

简介: JavaScript对象

今天我们来讲一下对象:


在 JavaScript 中, 对象是一组无序的相关属性和方法的集合 ,所有的事物都是对象,例如人、

桌子、椅子、花、草、猫、狗等。

对象是由属性和方法组成的:

属性:事物的特征,在对象中用属性来表示(常用名词)

方法:事物的行为,在对象中常用方法来表示(常用动词)

让我们知道为什么要需要对象呢?

保存一个值时,可以使用变量,保存多个值(一组值)时,可以使用数组,如果保存一个的

完整信息呢?

为了更好地存储一组数据,对象应用而生;对象中为每项数据设置了属性名称,可以访问数

据更语义化,数据结构清晰,表意明显,方便开发者使用

创建对象有三种创建方式:


1.利用字面量创建对象:

对象的字面量就是花括号 { } 里面包含了表达这个具体事物(对象)的属性和方法; { } 里面

采取 键值对 的形式表示

键 :相当于属性名

值 :相当于属性值,可以是任意类型的值(数字类型、字符串类型、布尔类型,函数类型等)

对象的使用:

对象的属性 :对象中 存储具体数据 的 “ 键值对 ” 中的键称为对象的属性,即对象中存储具体数

据的项。

对象的方法 :对象中 存储函数 的 “ 键值对 ” 中的 “ 键 ” 称为对象的方法,即对象中存储函数的项。

访问对象的属性:对象里面的属性调用: 对象 . 属性名 ;对象里面属性的另一种调用方式: 对

象 [' 属性名 '] ,注意方括号里面的属性必须加上引号。

调用对象的方法: 对象 . 方法名 () ;

let obj = {
"name":"小桔子",
"sex":"公猫",
"color":"gray",
"weight":"5kg"
}

2. 利用 new Object 创建对象:

// 通过内置构造函数 Object 创建对象,此时 obj 变量已经保存了创建出来的空对象
let obj = new Object();
 
 
// 通过对象操作属性和方法的方式,来为对象增加属性和方法
obj.name = '小桔子'; // 添加属性 name 为 小桔子
obj.sex = '公猫'; // 添加属性 sex 为 公猫
obj.color = 'gray'; // 添加属性 color 为 gray
obj.speed = function() { // 添加行为 speed 为 ...
alert("我每小时能跑 50 千米哦!!!");
}
obj.speed(); // 调用对象的方法 第二种写法 obj['speed']();
obj.color = 'blue'; // 修改对象属性 color 为 blue
// Object() 第一个字母大写;
// new Object() 需要 new 关键字,使用的格式:对象.属性 = 值


3.利用构造函数创建对象:


构造函数 : 是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值 , 它总与

new 运算符一起使用,我们可以把对象中一些公共的属性和方法抽出来,然后封装到这个函数里

function 构造函数名(形参 1,形参 2,形参 3...) {
this.属性名 1 = 参数 1;
this.属性名 2 = 参数 2;
this.属性名 3 = 参数 3;
this.方法名 1 = 方法体 1;
}
 
 
 
let obj = new 构造函数名(实参 1,实参 2,实参 3);
// 以上代码中,obj 即接收到构造函数创建出来的对象。
注意事项:
1.构造函数约定首字母大写
2.函数内的属性和方法前面需要添加 this,表示当前对象的属性和方法
3.构造函数中不需要 retrun 返回结果
4.我们创建对象的时候,必须用 new 来调用构造函数

关于对象的今天就给大家讲到这里了,希望给大家带来帮助


相关文章
|
20小时前
|
JavaScript 前端开发
js用Date对象处理时间
以上就是JavaScript中Date对象处理时间的一些基本方法。
5 0
|
20小时前
|
JavaScript 前端开发
在JavaScript中,函数原型(Function Prototype)是一个特殊的对象
【5月更文挑战第11天】JavaScript中的函数原型是一个特殊对象,它为所有函数实例提供共享的方法和属性。每个函数在创建时都有一个`prototype`属性,指向原型对象。利用原型,我们可以向所有实例添加方法和属性,实现继承。例如,我们定义一个`Person`函数,向其原型添加`greet`方法,然后创建实例`john`和`jane`,它们都能调用这个方法。尽管可以直接在原型上添加方法,但推荐在构造函数内部定义以封装数据和逻辑。
10 2
|
20小时前
|
JavaScript 前端开发
JavaScript 提供了多种方法来操作 DOM(文档对象模型)
【5月更文挑战第11天】JavaScript 用于DOM操作的方法包括获取元素(getElementById, getElementsByClassName等)、修改内容(innerHTML, innerText, textContent)、改变属性、添加/删除元素(appendChild, removeChild)和调整样式。此外,addEventListener用于监听事件。注意要考虑兼容性和性能当使用这些技术。
6 2
|
20小时前
|
存储 JavaScript 前端开发
JavaScript对象方法详解
JavaScript对象方法详解
16 1
|
20小时前
|
JavaScript
js多维数组去重并使具有相同属性的对象数量相加
js多维数组去重并使具有相同属性的对象数量相加
11 1
|
20小时前
|
前端开发 JavaScript 数据安全/隐私保护
前端javascript的DOM对象操作技巧,全场景解析(二)
前端javascript的DOM对象操作技巧,全场景解析(二)
|
20小时前
|
移动开发 缓存 JavaScript
前端javascript的DOM对象操作技巧,全场景解析(一)
前端javascript的DOM对象操作技巧,全场景解析(一)
|
20小时前
|
缓存 编解码 自然语言处理
前端javascript的BOM对象知识精讲
前端javascript的BOM对象知识精讲
|
20小时前
|
JavaScript 前端开发
JavaScript 日期对象
JavaScript 日期对象
|
20小时前
|
JavaScript 前端开发
JavaScript的math对象
JavaScript的math对象