`

JS数组”(array)和“对象”(object)

阅读更多
JS数组”(array)和“对象”(object)

JS技术 2009-12-30 16:15:45 阅读294 评论0   字号:大中小 订阅

        比如有一个数组a=[1,2,3,4],还有一个对象a={0:1,1:2,2:3,3:4},然后你运行alert(a[1]),两种情况下的运行结果是相同的!这就是说,数据集合既可以用数组表示,也可以用对象表示,那么我到底该用哪一种呢?

        数组表示有序数据的集合,而对象表示无序数据的集合。如果数据的顺序很重要,就用数组,否则就用对象。

        当然,数组和对象的另一个区别是,数组中的数据没有“名称”(name),对象中的数据有“名称”(name)。但是问题是,很多编程语言中,都有一种叫做“关联数组”(associative array)的东西。这种数组中的数据是有名称的。

比如在javascript中,可以这样定义一个对象:

             var a={"城市":"北京","面积":16800,"人口":1600};

但是,也可以定义成一个关联数组:
          a["城市"]="北京";

          a["面积"]=16800;

           a["人口"]=1600;


          在Javascript语言中,关联数组就是对象,对象就是关联数组。这一点与php语言完全不同,在php中,关联数组也是数组。

比如运行下面这段javascript:

  
 var a=[1,2,3,4];

    a['foo']='Hello World';

    alert(a.length);


最后的结果是4,也就是说,数组a的元素个数是4个。

但是,运行同样内容的php代码就不一样了:

 
  $a=array(1,2,3,4);

    $a["foo"]="Hello world";

    echo count($a);


最后的结果是5,也就是说,数组a的元素个数是5个。

遍历方法:
一:
var news = { id:'101', title:'这是标题', content:'这里是内容'}
      for(var n in news){
          document.write(n+'---'+news[n]+'<br>')
      }

二:
var news = {
0:{id:'101', title:'这是标题111', content:'这里是内容111'},
1:{id:'101', title:'这是标题222', content:'这里是内容222'},
2:{id:'101', title:'这是标题333', content:'这里是内容333'}
}
      for(var n in news){
          document.write(n+'---'+news[n].title+'<br>')
      }
/////调用值的方法 news.id 或 news['id']


字符转成对象
s   =   '{"address":"","email":"123@123.com","name":"test5","id":"6"};';  
  eval('o='+s);  
  alert(o.name);  
或:
data=eval('(' +s+ ')');


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

 对象是一种复合数据类型.
  创建对象最简单的方法是你的javascript代码中包含对象直接量,也可以通过运算符new创建。
var empty = {}; // An object with no properties
var point = { x:0, y:0 };
var circle = { x:point.x, y:point.y+1, radius:2 };
var homer = {
    "name": "Homer Simpson",
    "age": 34,
    "married": true,
    "occupation": "plant operator",
    'email': homer@example.com
};
var a = new Array(); // Create an empty array
var d = new Date(); // Create an object representing the current date and time
var r = new RegExp("javascript", "i"); // Create a pattern-matching object

  创建对象后,我们可以通过"."运算符,在对象中创建新属性、引用已有属性、设置属性值等。
  
  var book = new Object();     //创建对象
    book.title="JavaScript: The Definitive Guide";
    book.chapter1=new Object();   //作为对象属性的,嵌套对象
    book.chapter1.title = "Introduction to JavaScript";
    book.chapter1.pages = 11;
    book.chapter2 = { title: "Lexical Structure", pages: 6 };
                alert("Outline: " + book.title + "\n\t" +
      "Chapter 1 " + book.chapter1.title + "\n\t" +
      "Chapter 2 " + book.chapter2.title);                
// 从对象中读取一些属性.

在上例中,需注意,可以通过把一个值赋给对象的一个新属性来创建它.
  在JavaScript语句中提到过用for/in语句可以遍历对象的属性和方法。
  用in运算符检查属性是否存在.如:
if ("x" in o) o.x = 1;//如果存在就设置其属性值为1.
如果这样写:o.x=undefined //属性x是存在的,但是没有值.我常常会这样写:if (o.x !== undefined) o.x = 1;
另外,!= =常代替!=.!= =和= = = 区别在于undefined和null,不用区分时可以省略,如:if (o.doSomething) o.doSomething();
  删除属性:delete book.chapter2;
  作为关联数组的对象:object.property 和object["property"]是等价的.
  通用对象的属性和方法
   constructor属性:var d = new Date();d.constructor == Date; // true
   由于构造函数定义了一个对象的类,所以属性constructor在有助于确定给定对象的类型.如,可以使用如下代码来确定一个未知对象的类型:if ((typeof o == "object") && (o.constructor == Date)),也可以用instanceof运算符:if ((typeof o == "object") && (o instanceof Date))
  toString()方法:返回一个字符串,该字符串代表了调用它的对象的类型或值.当javascript需要将一个对象转换成字符串时就调用这个对象的toString()方法.例如当用"+"连接一个字符和一个对象时,或者把一个对象传递给alert()或document.write()方法时,就会调用toString().
  默认的toString()方法提供的信息并不多.例如下面的代码只能得到字符串"[object Object]":var s = { x:1, y:1 }.toString();所以许多类都定义了自己的toString()方法,例如,当一个数组被转换成一个字符串时,就得到一个数组元素列表,其中每个元素都被转换成了字符串,当一个函数被转换成字符串时,就会获得该函数的源代码.第九章将详细讲述.
  toLocaleString()方法:返回该对象局部化的字符串表示.Oject类定义的默认toLocaleString()方法自身不做任何局部化,返回的结果与toString() 方法返回的完全相同,但是Object 类的子类则可能定义自己的toLocaleString()方法.
  valueOf()方法:与toString()相似,当javascript需要将一个对象转换成字符串之外的原始类型(通常是数字)时,就需要调用它.
  hasOwnProperty方法:如果对象局部定义一个非继承的属性,属性名是由一个字符串实际参数指定的,那么该方法将返回true,否则,它将返回false.如:
var o = {};
o.hasOwnProperty("undef");     // false: 没有定义该属性
o.hasOwnProperty("toString"); // false: toString是一个继承属性
Math.hasOwnProperty("cos");    // true: Math对象有cos属性

  propertyIsEnumerable()方法:如果对象定义了一个属性,属性名是由一个字符串实际参数指定的,而且该属性可以用for/in循环枚举出来,那么该方法返回true,否则,返回false.例如:
var o = { x:1 };
o.propertyIsEnumerable("x");        // true: property exists and is enumerable
o.propertyIsEnumerable("y");        // false: property doesn't exist
o.propertyIsEnumerable("valueOf"); // false: property is inherited

  isPrototypeOf()方法:如果调用对象是实际参数指定的对象的原型对象,该方法返回true,否则返回false.该方法的用途和对象的constructor属性相似.例如:
var o = {}
Object.prototype.isPrototypeOf(o);        // true: o.constructor == Object
Object.isPrototypeOf(o);                  // false
o.isPrototypeOf(Object.prototype);        // false
Function.prototype.isPrototypeOf(Object); // true: Object.constructor==Function

  数组方法:
     join():可以把一个数组的所有元素都转换成字符串,然后再把它们连接起来,你可以指定一个可选字符串来分隔结果字符串中的元素.如果没有指定分隔字符串,那么可以使用逗号分隔元素.
  reverse():将颠倒数组元素的顺序并返回颠倒后的数组.它在原数组上执行这一操作,也就是说,它并不 创建一个重排了元素的新数组,而是在已经存在的数组中对数组元素进行重排.
  sort():是在原数组上对数组元素进行排序,返回排序后的数组.如果调用sort()时不传递给它参数,那么它将按照字母顺序对数组元素进行排序(如果必要的话,可以暂时将元素转成字符串以执行比较操作)
  concat():能创建并返回一个数组.这个数组包含了调用concat()的原始数组的元素,其后跟随的是concat()的参数.如果其中有些参数是数组,那么它就将被展开,其元素将被添加到返回的数组中.但是要注意,concat()并不能递归地展开一个元素为数组.
  slice():返回的是指定数组是一个片段.
  splice():插入或删除数组元素的通用方法.它在原数组上修改数组.
  push()和pop():使我们可以像使用栈那样来使用数组.方法push()可以将一个或多个新元素附加到数组的尾部.然后返回数组的新长度.方法pop()恰恰相反.
  unshift()和shift():与push()和pop() 非常相似,只不过它们是在数组的头部进行元素的插入和删除,而不是在尾部进行元素的插入和删除.
  toString()和toLocaleString():注意,在输出的结果中,数组值的周围没有方括号或者其他定界符.
  数组附加:indexof()和lastIndexof(),forEach(),map(),filter()

///////////////////

对象实例:

<script>
var news ={
 1:{id:101,title:'这是标题1',content:'这里是内容1'},
 2:{id:102,title:'这是标题2',content:'这里是内容2'},
 3:{id:103,title:'这是标题3',content:'这里是内容3'},
 4:{id:104,title:'这是标题4',content:'这里是内容4'},
 jingdian:{101:'AAA',102:'BBB',103:'CCC',104:'DDD'}
}
var jingdian ={
 101:{1101:'天',1102:'地',1103:'东'},
 102:{2101:'天2',2102:'地2',2103:'东2'},
 103:{3101:'天3',3102:'地3',3103:'东3'}
}

for (var n in news){
 if(n!='jingdian'){
  document.write(n+"--"+news[n].id+"--"+news[n].title+'----'+news[n].content+'======'+get_jingdian(news[n].id)+'=========<br>');
 }
}
document.write('<hr>');
document.write(news[1]['title']+'--');
document.write(news[1].title);
document.write('<hr>');

for (var J in news['jingdian']){
 document.write(news['jingdian'][J]+'<br>');
 
}
document.write('<hr>');

function get_jingdian(id){
 //document.write(id);
 //alert('id:'+id);
 var str='';
 for (var j in jingdian){
  if(j==id){
   //alert(j+'----'+id);
   for (j2 in jingdian[id]){
    str+='<a href='+j2+'>'+jingdian[id][j2]+'('+j2+')</a> ';
   }
  }
 }


return str;
}


</script>
分享到:
评论

相关推荐

    js获取对象,数组所有属性键值(key)和对应值(value)的方法示例

    本文实例讲述了js获取对象,数组所有属性键值(key)和对应值(value)的方法。分享给大家供大家参考,具体如下: [removed] var values=function(object) { var values = []; for (var property in object) values....

    详谈js中数组(array)和对象(object)的区别

    •object 类型: ◦ 创建方式: /*new 操作符后面Object构造函数*/ var person = new Object(); person.name = "lpove";...◦ 比如有一个数组a=[1,2,3,4],还有一个对象a={0:1,1:2,2:3,3:4},然后你运行a

    JavaScript 对象与数组参考大全

    以及与其相关的属性方法,以及事件处理程序,还注明了该对象或数组的父对象用户同样可能需要参考Online Companion中的超级文本Object Hierarchy页面(http://www.netscapepress.com/support/javascript/10-9.htm),以便...

    javascript判断一个变量是数组还是对象

    我们能够使用typeof判断变量的身份,判断字符串得到string,数字和NaN得到number,函数会得到function等,但是判断数组,对象和null时都会得到object,详细请看js数据类型,这就是typeof的局限性,并不能准确的判断...

    Javascript中判断变量是数组还是对象(array还是object)

    怎样判断一个JavaScript变量是array还是obiect? 答案: 1、如果你只是用typeof来检查该变量,不论是array还是object,都将返回‘objec’。 此问题的一个可行的答案是是检查该变量是不是object,并且检查该变量是否...

    JavaScript 判断判断某个对象是Object还是一个Array

    在开发中,我们经常需要判断某个对象是否为数组类型,在Js中检测对象类型的常见方法都有哪些呢?

    assign-all:数组中所有对象的Object.assign

    数组中所有对象的Object.assign 安装 使用安装assign-all : npm install --save assign-all 用法 模块使用 var assignAll = require ( 'assign-all' ) ; assignAll ( [ { foo : 1 } , { foo : 2 } , { bar : '...

    判断一个变量是数组Array类型的方法

    JavaScript中如何判断一个变量是数组Array类型呢?我最近研究了一下,并分享给大家,希望能对大家有所帮助。 JavaScript中检测对象的方法 1.typeof操作符 这种方法对于一些常用的类型来说那算是毫无压力,比如...

    JavaScript数组类型Array相关的属性与方法详解

    在ECMAScript中除了object类型之外,Array数组用的是最常用的类型。ECMAScript数组可以在每一项存储任何类型的值,无需指定数组的长度,还可以随着数据的增长来增加数组长度,这些是和其他语言的数组不同的。 1.数组...

    js-array-into-object:将数组转换为对象(奇数项是键,偶数项是值)

    数组到对象 将数组转换为对象-其中奇数是键,偶数是值。 使困惑? let a2o = require ( 'array-into-object' )a2o ( [ 1 , 2 , 3 , 4 ] ) // {1: 2, 3: 4}

    JavaScript从数组的indexOf()深入之Object的Property机制

    js中,可以说万物皆对象(object),一个数组也是一个对象(array)。 很多对象都有很多很方便的方法 比如数组的push,concat,slice等等,但是如果一些对象,它没有实现这些方法,我们还是想使用这些功能。那该怎么办...

    浅析JavaScript中的array数组类型系统

    前面的话 数组是一组按序排列的值,相对地,...除了对象之外,数组Array类型可能是javascript中最常用的类型了。而且,javascript中的数组与其他多数语言中的数组有着相当大的区别。本文将介绍javascript中的数组Ar

    JS赋值、浅拷贝和深拷贝(数组和对象的深浅拷贝)实例详解

    本文实例讲述了JS赋值、浅拷贝和深拷贝(数组和对象的深浅拷贝)。分享给大家供大家参考,具体如下: 深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。  浅拷贝 只是拷贝了基本类型的数据,而引用类型...

    Js数组排序函数sort()介绍

    JavaScript实现多维数组、对象数组排序,其实用的就是原生的sort()方法,用于对数组的元素进行排序。 sort() 方法用于对数组的元素进行排序。语法如下: arrayObject.sort(sortby) 返回值为对数组的引用。请注意,...

    php多层数组与对象的转换实例代码

    简单的(array)和(object)只能处理单层的数据,对于多层的数组和对象转换则无能为力。 通过json_decode(json_encode($object)可以将对象一次性转换为数组,但是object中遇到非utf-8编码的非ascii字符则会出现问题,...

    js比较两个单独的数组或对象是否相等的实例代码

    所以当你比较数组和对象时,都是false;除非你是克隆的原份数据 即: var a = { name: "李四" }; var b = a; 大家通常称对象为引用类型,以此来和基本类型进行区分; 而对象值都是引用,所以的对象的比较也叫引用的比较,当...

    JS遍历数组和对象的区别及递归遍历对象、数组、属性的方法详解

    废话不多说了,直奔主题,你,具体代码如下所示: [removed] //----------------for用来遍历数组对象-- ... //为所有的对象添加clone方法,即给内置原型(object,Array,function)增加原型属性,该方法很强大,也很危险

    JS在Array数组中按指定位置删除或添加元素对象方法示例

    arrayObject.splice(index, howmany, item1, ..., itemX) 参数 描述 index 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。 howmany 必需。要删除的项目数量。如果设置为 0,则不会删除...

    js-array-object-exercises

    JavaScript数组和对象 入门 分叉并克隆此存储库 使用为每个练习提供的文件。 这将使跟踪解决方案更加容易 编写JavaScript代码以获取每个问题提示的数据(包含在js文件中) 通过输入node nameOfFile.js运行每个文件 ...

Global site tag (gtag.js) - Google Analytics