JAvascriptの配列オブジェクトとjson学習ノート
9946 ワード
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の配列
配列の作成
===================================================================
2.Javascriptにおける単純オブジェクトの作成と属性操作
======================================================================
3.JSONデータフォーマット
======================================================================
4.オブジェクト向け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>