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>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值