JS数组”(array)和“对象”(object)
比如有一个数组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};
但是,也可以定义成一个关联数组:
1. a["城市"]="北京";
2.
3. a["面积"]=16800;
4.
5. "人口"]=1600;
在Javascript语言中,关联数组就是对象,对象就是关联数组。这一点与php语言完全不同,在php中,关联数组也是数组。
比如运行下面这段javascript:
1. var a=[1,2,3,4];
2.
3. 'foo']='Hello World';
4.
5. alert(a.length);
最后的结果是4,也就是说,数组a的元素个数是4个。
但是,运行同样内容的php代码就不一样了:
1. $a=array(1,2,3,4);
2.
3. "foo"]="Hello world";
4.
5. echo count($a);
最后的结果是5,也就是说,数组a的元素个数是5个。
遍历方法:
一:
1. var news = { id:'101', title:'这是标题', content:'这里是内容'}
2. for(var n in news){
3. '---'+news[n]+'<br>')
4. }
二:
1. var news = {
2. 0:{id:'101', title:'这是标题111', content:'这里是内容111'},
3. 1:{id:'101', title:'这是标题222', content:'这里是内容222'},
4. 2:{id:'101', title:'这是标题333', content:'这里是内容333'}
5. }
6. for(var n in news){
7. '---'+news[n].title+'<br>')
8. }
9. /调用值的方法 news.id 或 news['id']
字符转成对象
1. s = '{"address":"","email":"123@123.com","name":"test5","id":"6"};';
2. 'o='+s);
3. alert(o.name);
4. 或:
5. data=eval('(' +s+ ')');
-------------------------------------------------------------
对象是一种复合数据类型.
创建对象最简单的方法是你的javascript代码中包含对象直接量,也可以通过运算符new创建。
1. var empty = {}; // An object with no properties
2. var point = { x:0, y:0
3. var circle = { x:point.x, y:point.y+1, radius:2
4. var homer = {
5. "name": "Homer Simpson",
6. "age": 34,
7. "married": true,
8. "occupation": "plant operator",
9. 'email': homer@example.com
10. };
11. var a = new Array(); // Create an empty array
12. var d = new Date(); // Create an object representing the current date and time
13. var r = new RegExp("javascript", "i"); // Create a pattern-matching object
创建对象后,我们可以通过"."运算符,在对象中创建新属性、引用已有属性、设置属性值等。
1. var book = new Object(); //创建对象
2. "JavaScript: The Definitive Guide";
3. new Object(); //作为对象属性的,嵌套对象
4. "Introduction to JavaScript";
5. 11;
6. "Lexical Structure", pages: 6
7. "Outline: " + book.title + "\n\t"
8. "Chapter 1 " + book.chapter1.title + "\n\t"
9. "Chapter 2 "
10. 从对象中读取一些属性.
在上例中,需注意,可以通过把一个值赋给对象的一个新属性来创建它.
在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.如:
1. var o = {};
2. o.hasOwnProperty("undef"); // false: 没有定义该属性
3. o.hasOwnProperty("toString"); // false: toString是一个继承属性
4. Math.hasOwnProperty("cos"); // true: Math对象有cos属性
propertyIsEnumerable()方法:如果对象定义了一个属性,属性名是由一个字符串实际参数指定的,而且该属性可以用for/in循环枚举出来,那么该方法返回true,否则,返回false.例如:
1. var o = { x:1
2. o.propertyIsEnumerable("x"); // true: property exists and is enumerable
3. o.propertyIsEnumerable("y"); // false: property doesn't exist
4. o.propertyIsEnumerable("valueOf"); // false: property is inherited
isPrototypeOf()方法:如果调用对象是实际参数指定的对象的原型对象,该方法返回true,否则返回false.该方法的用途和对象的constructor属性相似.例如:
1. var o = {}
2. Object.prototype.isPrototypeOf(o); // true: o.constructor == Object
3. Object.isPrototypeOf(o); // false
4. o.isPrototypeOf(Object.prototype); // false
5. 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()
///
对象实例:
1. <script>
2. var news ={
3. 1:{id:101,title:'这是标题1',content:'这里是内容1'},
4. 2:{id:102,title:'这是标题2',content:'这里是内容2'},
5. 3:{id:103,title:'这是标题3',content:'这里是内容3'},
6. 4:{id:104,title:'这是标题4',content:'这里是内容4'},
7. 101:'AAA',102:'BBB',103:'CCC',104:'DDD'}
8. }
9. var jingdian ={
10. 101:{1101:'天',1102:'地',1103:'东'},
11. 102:{2101:'天2',2102:'地2',2103:'东2'},
12. 103:{3101:'天3',3102:'地3',3103:'东3'}
13. }
14.
15. for
16. if(n!='jingdian'){
17. "--"+news[n].id+"--"+news[n].title+'----'+news[n].content+'======'+get_jingdian(news[n].id)+'=========<br>');
18. }
19. }
20. document.write('<hr>');
21. document.write(news[1]['title']+'--');
22. document.write(news[1].title);
23. document.write('<hr>');
24.
25. for (var J in news['jingdian']){
26. 'jingdian'][J]+'<br>');
27.
28. }
29. document.write('<hr>');
30.
31. function get_jingdian(id){
32. //document.write(id);
33. //alert('id:'+id);
34. '';
35. for
36. if(j==id){
37. //alert(j+'----'+id);
38. for
39. '<a href='+j2+'>'+jingdian[id][j2]+'('+j2+')</a> ';
40. }
41. }
42. }
43.
44.
45. return
46. }
47.
48.
49. </script>