关于JavaScript对象类型之Array及Object

关于JavaScript对象类型之Array及Object

在JavaScript中，Array和Object都是非常重要的对象类型。本文将详细讲解这两种类型的相关知识。

Array

数组是一种可以存储多个值的自定义数据类型。在JavaScript中，数组可以包含任意类型的数据，包括字符串、数值、布尔值、对象、甚至是另一个数组。

创建数组

创建数组的方法有很多种，常见的有直接赋值、使用new关键字以及使用Array构造函数。

// 直接赋值
var arr1 = ['a', 'b', 'c'];

// 使用new关键字
var arr2 = new Array('a', 'b', 'c');

// 使用Array构造函数
var arr3 = Array('a', 'b', 'c');

访问数组元素

数组的每一个元素都有一个索引，可以使用数组索引来访问数组元素。需要注意的是，数组索引从0开始。

var arr = ['apple', 'banana', 'orange'];

console.log(arr[0]); // 'apple'
console.log(arr[1]); // 'banana'
console.log(arr[2]); // 'orange'

常用方法

JavaScript数组提供了很多有用的方法，下面介绍几个常用的方法。

push()

push()方法向数组的末尾添加一个或多个元素，并返回新的长度。

var arr = ['a', 'b', 'c'];

var len = arr.push('d', 'e');

console.log(arr); // [ 'a', 'b', 'c', 'd', 'e' ]
console.log(len); // 5

pop()

pop()方法从数组末尾删除一个元素，并返回被删除的元素。

var arr = ['a', 'b', 'c'];

var lastItem = arr.pop();

console.log(arr); // [ 'a', 'b' ]
console.log(lastItem); // 'c'

join()

join()方法将数组中所有元素转换为字符串，并用指定的分隔符将这些字符串连接起来。

var arr = ['a', 'b', 'c'];

var str = arr.join('-');

console.log(str); // 'a-b-c'

Object

对象是一种无序的复合数据类型，可以用来表示一组相关的数据和功能。在JavaScript中，对象由一组键值对组成。键名可以是任意字符串，值可以是任意类型的数据。

创建对象

JavaScript中有多种创建对象的方式，常见的有对象字面量、使用new关键字以及使用Object构造函数。

// 对象字面量
var obj1 = {
  name: '张三',
  age: 20,
  gender: '男'
};

// 使用new关键字
var obj2 = new Object();
obj2.name = '李四';
obj2.age = 22;
obj2.gender = '女';

// 使用Object构造函数
var obj3 = Object({
  name: '王五',
  age: 24,
  gender: '男'
});

访问对象属性

对象属性可以通过.或者[]来访问。.后面跟着属性名，[]内可以是任意表达式，返回值为属性值。

var obj = {
  name: '张三',
  age: 20,
  gender: '男'
};

console.log(obj.name); // '张三'
console.log(obj['age']); // 20

常用方法

JavaScript对象提供了很多有用的方法，下面介绍几个常用的方法。

hasOwnProperty()

hasOwnProperty()方法用来判断对象是否包含指定的属性。

var obj = {
  name: '张三',
  age: 20,
  gender: '男'
};

console.log(obj.hasOwnProperty('name')); // true
console.log(obj.hasOwnProperty('address')); // false

keys()

keys()方法用来返回对象的所有属性名组成的数组。

var obj = {
  name: '张三',
  age: 20,
  gender: '男'
};

var keys = Object.keys(obj);

console.log(keys); // [ 'name', 'age', 'gender' ]

示例说明

示例1

var arr = ['apple', 'banana', 'orange'];
for (var i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

输出结果为:

apple
banana
orange

本示例演示了如何使用for循环遍历数组。

示例2

var obj = {
  name: '张三',
  age: 20,
  gender: '男'
};

for (var key in obj) {
  console.log(key + ': ' + obj[key]);
}

输出结果为:

name: 张三
age: 20
gender: 男

本示例演示了如何使用for...in循环遍历对象的属性。