javascript中的数组对象以及json学习笔记

1.Javascript中的数组
  数组的创建
  数组下标操作
  数组的方法
 
  concat join slice 不修改原数组
 
  push pop unshift shift reverse sort splice 修改原数组

2.Javascript中简单对象的创建与属性操作
  简单对象的创建
  简单对象属性的添加
  简单对象属性的访问
通过对象直接量的方式定义包含属性的对象

3.JSON数据格式
  JSON(Javascript Object Notation)是一种轻量级的数据交换格式。
  纯文本，Javascript原生支持
  与XML相比：
     优势实在Javascript当中解析快，操作方便，不需要使用DOM。
     缺点是在服务器端，生成正确的JSON格式数据与生成XML格式数据相比，服务器端语言的辅助包成熟度较低。
 
 
4.面向对象的Javascript
类的定义
公用属性和方法的定义
原型对象







===================================================

1.Javascript中的数组

数组的创建

 <script type="text/javascript">
 
 		function arrayTest(){
 			//使用new Array()
 			var array1 = new Array();
 			//使用[]操作符
 			var array2 = [];
 			
 			//创建的同时定义数组中的元素
 			//使用new Array()方式
 		  var array3 = new Array(1,2,3);
 		  //使用[]操作符
 		  var array4 = [1,2,3];
 		  
 		  //创建多维数组
 		  //使用new Array()方式
 		  var array5 = new Array(1,new Array(2,3),4);
 		    
 		  //使用[]操作符
 		  var array6 = [1,[2,3],4];
 		  
 		  //数组的下标操作
 		  //获取数组中的某元素的值
 		  alert(array3[1]);
 		  //设置数组中某个下标对应的元素值
 		  array4[2] = 111;
 		  //访问对维数组中的元素
 		  alert(array5[1][0]);
 		  //javascript中的数组时可以动态改变大小的，因此可以直接给一个不存在的下标设置元素值
 		  array[99] = 100;
 		  
 		  //数组中的方法
 		  //concat,这个方法可以用来做数组的连接或者说合并,原数组内容不会变更,将返回一个新的数组
 		  var array41 = array.concat(101,102,103);
 		  var array42 = array.concat([104,105]);
 		  var array43 = array.concat(array4);
 		  
 		  //join,这个方法可以将数组当中的元素，按照指定的分隔符连接成字符串输出，原数组的内容不会变
 		  var strarray431 = array43.join("");//1211112111
 		  var strarray432 = array43.join("+");//1+2+111+1+2+111
 		  
 		  
 		  //slice,这个放好可以返回当前数组的子数组，原始数组的内容不会改变
 		  var slicearray1 = array43.slice(0,3);//从0下标开始,到3下标之前的元素返回新的数组[1,2,111]
 		  var slicearray2 = array43.slice(4);//从4下标开始,到数组尾部的所有元素都返回成新的数组[2,111]
 		  //从当前数组的倒数第二个元素开始,当前数组倒数第一个元素之前的所有内容返回一个新的数组[2]
 		  var slicearray3 = array43.slice(-2,-1);
 		  
 		  
 		  //push,pop,在数组尾端追加(push)或弹出(pop)元素,将会修改原数组的内容
 		  array43.push(200);
 		  array43.push(201,202);
 		  array43.push([201,202]);
 		  array43.push(array41);
 		  var arraypop = array43.pop();
 		  var arraypop = array43.pop();
 		  
 		  
 		  //unshift,shift,在数组的开头进行追加(unshift)和弹出(shift)的操作,将会修改原数组的内容
 		  array43.unshift(300);
 		  array43.unshift(301,302);
 		  array43.unshift([303,304]);
 		  var arrayshift = array43.shift();
 		  var arrayshift2 = array43.shift();
 		  
 		  //reverse,这个方法可以翻转数组中的元素，修改原数组的内容
 		  array43.reverse();
 		  
 		  //sort,这个方法可以对数组中的元素进行排序，修改原数组的内容
 		  array43.sort();//无参,是按照字母顺序对数组中的元素进行了升序的排列
 		  array43.sort(function(a,b){
 		  	return a-b;
 		  });//就是按照数值大小，进行一个升序的排列。如果返回的是负值，则a会出现在b的前面
 		  
 		  array43.sort(function(a,b){
 		  	return b-a;
 		  });//就是按照数值大小，进行一个降序的排列。
 		  
 		  //splice,可以删除数值中的一部分元素，并且把删除的内容进行返回，原数组的内容会发生变更，还可以在制定位置添加元素
 		  //第一个参数,删除元素开始的下标位置
 		  //删除元素的个数
 		  array43.splice(index,howMany,element1,elementN);
 		  //用局部变量来接收删除的返回值，会把删除部分的内容进行返回
 		  var splicearray1 = array43.splice(4,2);//从下标为4的元素开始,删除两个元素
 		  var splicearray2 = array43.splice(4); //从下标为4的元素开始,直到数组末尾的所有元素都被删除
 		  
 		  array43.splice(1,0,400,401);//从下标为1的元素之前,0表示不删除，插入400,401
 		  array43.splice(1,0,[500,501]);//从下标为1的元素之前插入500,501
 		  
 		
 		}
 
 </script>

===================================================================



2.Javascript中简单对象的创建与属性操作

<script type="text/javascript">
 
 		function objectTest(){
 			//方式1,通过new Object()
 			var obj1 = new Object();
 			//方式1,通过{}操作符
 			var obj2 = {};
 			
 			//增加属性，使用.操作符
 			//使用new Array()方式
 		  obj1.num = 1;
 		  obj1.str = "String";
 		  obj1.hell = function(){
 		  	alert("hello!");
 		  }
 		  obj2.obj = obj1;
 		  
 		  
 		  //属性的访问，方法1，使用.操作符
 		  alert(obj2.obj.num);
 		  alert(obj2.obj.str);
 		  obj1.hello();
 		  //属性的访问，方法2，使用[]操作符
 		  alert(obj2["obj"]["num"]);
 		  alert(obj2["obj"]["str"]);
 		  obj1["hello"]();
 		 
 		  alert("");
 		  
 		  //对象直接量定义方法，利用{}
 		  var obj3 = {
 		  						num:1,
 		  						str:"String",
 		  						hello；function(){
											alert("hello!"); 		  						
 		  						}		  
 		  };

 		}
 
 </script>

======================================================================
3.JSON数据格式

<script type="text/javascript">
 
 		function jsonTest(){
 			//JSON数据格式定义
 			var json1 = "[1,2,{" + 
 													  "a:123,b:'String',c:[100,101]'" +
 			             "}]";
 			             
 			//javascript的一个内置方法eval(),返回回json这段数据格式所对应的javascript的数组或者对象
 			var jsonArray = eval(json1);
 			
 			var json2 = "{" + 
 												"a:'hello', b:[1,2,3], c:function(){ alert(\"Hi!!!\") }" +
 			             
 			            "}";
 			//错误写法            
 			//var jsonObject = eval(json2);
 			
 			//正确的写法
 			var jsonobj = eval( "(" + json2 + ")" );
 			
 			
 			如果从服务器端返回回来的json数据格式 他最终代表的是一个数组，可以直接用eval的方式对他进行执行，
 			返回javascript里面的一个数组。
 			如果从服务器端返回的json格式对应的是一个对象，我们必须要在他的外层加上括号(),
 			才会返回正确的对象，否则会报错。

 			
 		}
 
 </script>

======================================================================
4.面向对象的Javascript

<script type="text/javascript">
 		//javascript中类的定义，需要靠function来模拟
 		/*
 		function Teacher(){
 		
 		}*/
 		
 		//建议采用下面的形式来定义一个js中的类，可以和普通的function进行区分
 		//建议类名首字母大写，以便更好的和普通的function进行区分
 		var Teacher = function(){
 		
 		}
 		
 		//定义一个Book的类,这个function还承担了模拟构造函数的工作
 		//在使用new操作符创建Book类的对象时，这个function中的代码会被执行
 		//这里面的this代表当前对象
 		/*
 		var Book = function(name){
 					//定义共有的属性
 					this.name = name;
 					//定义共有的方法
 					this.getName = function(){
 						return this.name;
 					};
 					this.setName = function(name){
 						this.name = name;
 					}
 		}*/
 		
 		
 		/*********************************************
 		//一种更为合适的公有属性和方法定义
 		var Book = function(name){
 				//Book.prototype.name=name;
 				//公有属性，在构造方法里面来定义，通过this关键字
 				this.name = name;
 		}
 		//Book.prototype.name="";//优先访问对象上的属性，即这里的this.name,没有才会访问(找)原型对象上的name;
 		//公有的方法，在原型对象上定义
 		Book.prototype.setName = function(name){
 				this.name = name;
 		};
 		
 		Book.prototype.getName = function(){
 				return this.name;
 		};**************************************/
 		
 		
 		
 		//一种更为合适的公有属性和方法定义
 		var Book = function(name){
 				//Book.prototype.name=name;
 				//公有属性，在构造方法里面来定义，通过this关键字
 				this.name = name;
	
 				if(typeof Book._init = "undefined"){
 						//公有的方法，在原型对象上定义
		 				Book.prototype.setName = function(name){
		 					this.name = name;
		 				};
		 		
		 			  Book.prototype.getName = function(){
		 				 return this.name;
		 		    };
 				}
 				Book._init = true;
 		
 		};
 		
 		
 		
 		
 		function ooTest(){
 		   var teacher = new Teacher();
 		   alert(teacher instanceof Teacher);
 		   var book1 = new Book("AJAX");//这个new操作相当于创建了一个简单对象，调用了类的构造方法
 		   var book2 = new Book("AJAX1");
 		   alert(book1.getName());
 		   alert(book2.getName());
 		   
 		   book1.setName("JAVA");
 		   alert(book1.getName());
 		   alert(book2.getName());
 		   
 		   //function上面都有一个原型对象
 		   var proto = Book.prototype;
 		   proto.str = "String";
 		   proto.hello = function(){
 		   		alert("Hello");
 		   };
 		   //原型对象上定义了属性之后，拥有这个原型对象的function，
 		   //它所模拟的类创建出的对象，就可以拥有原型对象上定义的属性
   
 		   
 		   alert();
 		
 		}
 
 </script>

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

<script type="text/javascript">
 		//展示原型对象上定义公有属性的另一个问题
 		var Teacher = function(){	
 		}
 		Teacher.prototype.student=[];
 	
 		Teacher.prototype.addStudent = function(sname){
 				this.student.push(sname);
 		};
 		
 		Teacher.prototype.showStudent = function(){
 				alert(this.student);
 		};
 		
 		
 		function oo4Test(){
 		   var teacher1 = new Teacher();
 		   var teacher2 = new Teacher();
   
 		   teacher1.addStudent("wang");
 		   teacher2.addStudent("lee");
 		   teacher1.showStudent();
 		   teacher2.showStudent();
 		   alert();
 		
 		}
 
 </script>

评论

2 楼 蜀山红日 2012-12-06  

1 楼 80houzhu 2012-02-17  

恩，很好，很好~