Javascript 关联数组简介

关联数组是一组键值对和用户根据需要修改的动态对象。当用户为数据类型为 Array 的键赋值时,它会转换为一个对象,并失去以前数据类型的属性和方法。关联数组使用字符串而不是数字作为索引。在这里,我们需要了解 Javascript 不支持关联数组,但是由于 javascript 中的所有数组都是对象,并且 javascript 的对象语法有助于模仿关联数组。

句法:

<name of the array> = {key1:’value1’, key2:’value2’, key3:’valu3’…..}

例子:

employee = {101:’Karthick’, 102:’Saideep’, 103:’Anusha’}

上面的例子有助于创建一个带有 3 个键和 3 个值的数组员工,键可以是标识符、数字或字符串。

JavaScript 关联数组示例

在这里我们可以看到为什么不能像普通数组一样在 javascript 中创建关联数组,相反,我们可以使用 javascript 对象创建它。

示例#1

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
var array = { "alpha": 1, "beta": 2, "gama": 3 };
var x = array["beta"];
document.write(x);
</script>
</body>
</html>

输出:

javascript 1 中的关联数组

示例#2

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
var x = new Object();
x["alpha"] = 1;
x["beta"] = 2;
x["gama"] = 3;
for(var i in x)
{
document.write(i + "=" +x[i] + '<br>');
}
</script>
</body>
</html>

输出:

javascript 2 中的关联数组

示例 #3

在关联数组中循环。

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
var array = {
"Karthick": "Deloitte",
"Saideep": "Infosys",
"Anusha": "Capgemini",
"Vasu": "Cognizant"
};
for (var key in array) {
if (array.hasOwnProperty(key)) {
document.write(key + "<br>");
}
}
</script>
</body>
</html>

输出:

循环

除了循环关联数组,我们还可以使用 Object.keys() 显示数组元素。

示例 #4

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
var array = {
"Karthick": "Deloitte",
"Saideep": "Infosys",
"Anusha": "Capgemini",
"Vasu": "Cognizant
};
var keys = Object.keys(array);
document.write(keys);
</script>
</body>
</html>

输出:

javascript 4 中的关联数组

我们不能像创建普通数组一样创建 javascript 关联数组,用户需要使用空对象或空关联数组。

示例#5

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
//Normal array
var nArray= new Array();
nArray[0] = ".yahoo";
nArray[1] = ".fed";
nArray[2] = ".in";
document.write("Length of nArray: " + nArray.length);
document.write('</br>');
//Associative array
var aArray = new Array();
aArray['yahooo'] = ".yahoo";
aArray['fedex'] = ".fed";
aArray['india'] = ".in";
document.write("Length of aArray: " + aArray.length);
document.write('</br>');
document.writeln("yahoo domain: " + aArray['yahooo']);
document.write('</br>');
document.writeln("yahoo domain: " + aArray.yahooo);
</script>
</body>
</html>

输出:

javascript 5 中的关联数组

示例 #6

使用 javascript 对象的创意关联数组。

代码:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
var myObject = {};
myObject.yahooo = ".yahoo";
myObject.fedex= ".fed";
myObject.india= ".in";
document.writeln(myObject.length);  // undefined
document.write('</br>');
document.write("yahoo domain: " + myObject['yahooo']);
document.write('</br>');
document.write("yahoo domain: " + myObject.yahooo);
</script>
</body>
</html>

输出:

有创造力的

我们可以使用点属性符号来访问数组元素、删除对象值以及分配值。

对于删除关联数组的属性,我们有 'delete' 语句。

示例 #7

代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript object deleting</title>
</head>
<body>
<pre>
<script type="text/javascript">
var myObject = {};
myObject.yahooo = ".yahoo";
myObject.fedex= ".fed";
myObject.india= ".in";
document.writeln("fedex domain: " + myObject['fedex']);
document.writeln("fedex domain: " + myObject.fedex);
delete myObject.fedex;
document.writeln("fedex domain: " + myObject.fedex);
</script>
</pre>
</body>
</html>

输出:

javascript op 7 中的关联数组

当我们处理对象时,我们可以找出长度。

示例 #8

代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript object key length</title>
</head>
<body>
<pre>
<script type="text/javascript">
var myObject = {};
myObject.yahooo = ".yahoo";
myObject.fedex= ".fed";
myObject.india= ".in";
document.write( Object.keys(myObject) );
document.write('</br>');
document.writeln( Object.keys(myObject).length );
</script>
</pre>
</body>
</html>

输出:

javascript op 8 中的关联数组

关联数组是动态对象,当用户为数组类型的键赋值时,它转化为对象并失去数组类型的所有属性和方法,并且长度属性与转化后的数组无关。

通过这个关联数组,用户可以保存更多数据,因为我们有一个字符串作为存储关联数据的数组元素的键。这个优点是因为使用对象来访问数组元素

结论

让我们用一个很好的笔记结束这篇文章,因为我们已经了解了什么是 Javascript 中的关联数组,关联数组的创建及其工作原理,用户如何访问关联数组的数组元素以及一些解释的示例以上在此背景下。此外,用户可以向关联数组对象添加属性。

猜你喜欢

转载自blog.csdn.net/allway2/article/details/121356958