Javascript学習まとめ-対象向け-(五)
12843 ワード
1.対象に向ける
JavaScriptは対象に向けたスクリプト言語で、開発者は開発時にオブジェクトを探して、デフォルトでは内蔵のオブジェクトを提供します.開発者のニーズに応じて、自分でオブジェクトを定義することもできます.
1.1. 基本データタイプ包装類
基本タイプの値を操作しやすくするために、ECMAScriptは3つの特別な引用タイプを提供しています.Boolean、Number、String.これらは参照の種類です.基本データタイプを読み込むと、バックグラウンドは対応する基本パッケージタイプのオブジェクトを作成しますので、基本データタイプを操作する時に、直接にいくつかの方法を呼び出すことができます.
1.1.1. String
一般的な方法:
アンチョー()生産アンカーポイント
Blink() 要素にblinkラベルを追加します.
charAt() 索引の位置を指定する文字を返します.
charCodeAt()は指定された位置の文字のユニックコードを表す整数を返します.
Concat() この値は、2つ以上の提供された文字列の接続を含む文字列の値を返します.
Fontカラー COLOR属性を持つHTMLタグをStringオブジェクトのテキストの両端に配置します.
indexOf() Stringオブジェクト内で最初にサブ文字列が現れた文字の位置を返します.
italics() Stringオブジェクトのテキストの両端にHTMLマークを置きます.
Link() HREF属性のあるHTMLアンカーをStringオブジェクトのテキストの両端に置いてください.
Replace() 正規表現によるテキスト置換後の文字列のコピーを返します.
Split() カット
Substr() 切り取り棒
toUpperCase() 大文字に変換
LowerCase() 小文字をまわす
構造関数
属性:
1.2. Mathクラス
Mathツールクラスの方法
max()
min()
ラドム()
...もっと文書を見てください
set Interval(コード、ミリ秒数)は、指定されたミリ秒値を経過するごとに指定されたコードを実行します.
set Timeout(コード、ミリ秒数) 指定したミリ秒値を経て指定されたコードを実行します.(一回だけ実行します.).
文書を見てDateを学ぶ他の方法
配列の定義:
配列を作成する基本的な方法は2つあります.
第一はArayを使用したコンストラクタです.
長さを指定しない
長さを指定
要素を指定
要素を指定
3文字列を含む配列を作成します.
JS配列はダイナミックに成長することができます.
Arayでの方法:
sort()
現在の配列を並べ替えて、順序付けされたこのArayオブジェクトを返します.
新しいオブジェクトは作成されません.指定された配列で直接並べ替えられます.
逆転()
現在の配列を反転して並べ替え、要素順序が反転されたArayオブジェクトを返します.
新しいオブジェクトは作成されません.指定された配列で直接並べ替えられます.
push([item 1[item 2..[itemen]])
これらの要素を新しい要素の出現順に追加します.
パラメータの一つが配列である場合、配列は単一の要素として配列に追加されます.
ポップ()
配列の最後の要素を削除し、要素を返します.
配列が空の場合、undefinedが返されます.
shift()
配列の最初の要素を削除し、要素を返します.
配列が空の場合、undefinedが返されます.
unshift([item 1[,item 2[..[,itemen]]]])
指定された要素を配列の開始位置に挿入し、行列を返します.
splice(start,deleteCount,[item 1[,item 2[...[,itemen]]])])
start位置から指定された個数の要素を削除し、新しい要素を挿入して修正します. concat([item 1[,item 2[..[,itemen]]]))
新しい配列を返します.この新しい配列は2つ以上の配列からなります.元の配列は不変です
追加するアイテムは、左から右に順番に配列に追加されます.
配列のいずれかが、array 1の末尾にコンテンツを追加します.
この項目が配列でない場合、配列の最後に単一の配列要素として追加されます.
slice(start,[end])
指定された要素を含む配列を返します.
は、インデックスがstartに等しい、endより小さい部分を返します.
元の配列は不変です
ジョイン(separator)
すべての要素を指定の区切り記号で区切って文字列を作って、この文字列の値を返します.
配列内の要素が定義されていない場合やnullとして空の文字列として処理されます.
1.5.1. 無参画構造関数
立体関数モードを使用してオブジェクトを作成します.
まずカスタムクラスとは、クラス名と同じ関数を定義することです.
newキーワードを使って定義されたクラスを呼び出します.
(任意の関数は、newオペレータによって呼び出しさえすれば、構築関数として機能します.)
説明:
属性と方法をthisに割り当てるには、オブジェクトの属性を表します.
new Objectを書くな.
return文は書かないでください.
JSはnew Person()で次のようなことをします.
1,新しいオブジェクトを作成します.
2,thisは新しいオブジェクトを指します.
3,構造方法のコードを実行します.
4,新しいオブジェクトを返します.
オブジェクトを作成する文字列の量:
「prototype」の字面翻訳は「原型」であり、javascriptが継承を実現する主な手段である.大まかに言えば、プロトタイプはjavascriptの関数の一つであり、その値は一つのオブジェクトです.
Prottypeの注意事項: prototypeは関数の必須属性である(文面的には「属性の保持」という言い方がある) prototypeの値は一つのオブジェクト です.は、関数のprototype属性の値を任意に変更することができる. オブジェクトは、このオブジェクトの構造関数のプロトタイプのメンバー属性と方法を自動的に持ちます. 必要:
配列のツールクラスをカスタマイズします.
JavaScriptは対象に向けたスクリプト言語で、開発者は開発時にオブジェクトを探して、デフォルトでは内蔵のオブジェクトを提供します.開発者のニーズに応じて、自分でオブジェクトを定義することもできます.
1.1. 基本データタイプ包装類
基本タイプの値を操作しやすくするために、ECMAScriptは3つの特別な引用タイプを提供しています.Boolean、Number、String.これらは参照の種類です.基本データタイプを読み込むと、バックグラウンドは対応する基本パッケージタイプのオブジェクトを作成しますので、基本データタイプを操作する時に、直接にいくつかの方法を呼び出すことができます.
1.1.1. String
// String
var b = new String("java");
var c = new String("java");
document.write(b + "," + c);
document.write(b == c);
//false
//
document.write(b.valueOf() == c.valueOf());
//
var a = "helloworld";
document.write(a.length);
一般的な方法:
アンチョー()生産アンカーポイント
Blink() 要素にblinkラベルを追加します.
charAt() 索引の位置を指定する文字を返します.
charCodeAt()は指定された位置の文字のユニックコードを表す整数を返します.
Concat() この値は、2つ以上の提供された文字列の接続を含む文字列の値を返します.
Fontカラー COLOR属性を持つHTMLタグをStringオブジェクトのテキストの両端に配置します.
indexOf() Stringオブジェクト内で最初にサブ文字列が現れた文字の位置を返します.
italics() Stringオブジェクトのテキストの両端にHTMLマークを置きます.
Link() HREF属性のあるHTMLアンカーをStringオブジェクトのテキストの両端に置いてください.
Replace() 正規表現によるテキスト置換後の文字列のコピーを返します.
Split() カット
Substr() 切り取り棒
toUpperCase() 大文字に変換
LowerCase() 小文字をまわす
//
document.write(" ".anchor("ch1"));
document.write(" ".blink());
// 。
document.write(" ".charAt(0));
document.write("a".charCodeAt(0));
document.write(" ".concat("abc"));
document.write(" ".fontcolor("#ff0000"));
document.write(" ".indexOf(" "));
document.write(" ".italics());
document.write(" ".link());
document.write("helloworld".replace(/l/g, "L"));
document.write("
");
var names = "jack-lili-lucy".split("-");
for (var temp in names) {
document.write(names[temp] + "
");
}
document.write("
");
document.write("helloworld".substr(1, 2)); //el
document.write("helloworld".substring(1, 2));//e
document.write("helloworld".toUpperCase());
document.write(new String("java").toString() == new String("java").toString());
1.1.2. Number構造関数
// number
var a = 12;
var b = new Number(12);
document.write(a + ":" + b);
// true
document.write(a == b);
// false
document.write(a === b);
//false
document.write(new Number(12) == new Number(12));
//false
document.write(new Number(12) === new Number(12));
// false
document.write(new Number(12).valueOf() == new Number(12).valueOf());
//true
document.write(new Number(12).valueOf() === new Number(12).valueOf());
属性:
document.write(" " + Number.MAX_VALUE + "");
document.write(" " + Number.MIN_VALUE + "");
方法//
document.write(new Number(12).toString(10) + "
");
document.write(new Number(12).toString(2) + "
");
document.write(new Number(12).toString(8) + "
");
document.write(new Number(12).toString(16) + "
");
document.write(new Number(12.12345) + "
");
document.write(new Number(12.12345).toFixed() + "
");
document.write(new Number(12.12345).toFixed(2) + "
");
document.write(new Number(12.12345).toFixed(3) + "
");
備考:toFixed()は小数点以下の桁数を指定します.1.2. Mathクラス
Mathツールクラスの方法
max()
min()
ラドム()
...もっと文書を見てください
document.write(Math.ceil(12.34) + "
");
//13
document.write(Math.floor(12.34) + "
");
//12
document.write(Math.round(12.54) + "
");
//13
document.write(Math.round(12.35) + "
");
//12
document.write(Math.random() + "
");
//0~1
document.write(Math.max(12, 100, -1, 200, 320, 500) + "");
document.write(Math.min(12, 100, -1, 200, 320, 500) + "");
1.3. デートオブジェクトset Interval(コード、ミリ秒数)は、指定されたミリ秒値を経過するごとに指定されたコードを実行します.
set Timeout(コード、ミリ秒数) 指定したミリ秒値を経て指定されたコードを実行します.(一回だけ実行します.).
文書を見てDateを学ぶ他の方法
function showDate() {
//
var date = new Date();
//
var str = date.getFullYear() + " " + (date.getMonth() + 1) + " " + date.getDate() + " " + " " + date.getDay() + " " + date.getHours() + " " + date.getMinutes() + " " + date.getMinutes() + " " + date.getSeconds() + " "
// span
var span = document.getElementById("mydate");
// span
span.innerHTML = str.fontcolor("red");
//
window.setTimeout("showDate()", 1000);
}
//
showDate();
1.4. 行列配列の定義:
配列を作成する基本的な方法は2つあります.
第一はArayを使用したコンストラクタです.
長さを指定しない
var arrs=new Array();
配列の保存数を指定すると、配列の長さがコンストラクションで伝達されます.長さを指定
var arrs=new Array(20);
この配列は20の要素があり、各項目のデフォルト値はundefinedです.要素を指定
var arrs=new Array("hello"); .
第二の方式要素を指定
3文字列を含む配列を作成します.
var arrs=["aa","bb","cc"];
空の配列を作成 var arrs=[];
var values=[1,2];
配列初期化 var arrs=["aa","bb","cc"];
color[2]="xx";// 3
color[3]="zz";// 4
配列巡回: for(var i = 0; i < arr.length; i++){
alert(arr[i]);
}
または for( var i in arr ){
// i , 0 , 。
// , , 。
alert(arr[i]);
}
注意:JS配列はダイナミックに成長することができます.
// , :
var arr = new Array();
arr[0] = "aa";2
arr[1] = "bb";
arr[6] = 'xx';
document.write(arr + "
");
//
for (var i = 0; i < arr.length; i++) {
document.write(arr[i]+"
");
}
// :
var arr = ["aa", "bb"];
document.write(arr[200]);
// undefined
よくある方法Arayでの方法:
sort()
現在の配列を並べ替えて、順序付けされたこのArayオブジェクトを返します.
新しいオブジェクトは作成されません.指定された配列で直接並べ替えられます.
逆転()
現在の配列を反転して並べ替え、要素順序が反転されたArayオブジェクトを返します.
新しいオブジェクトは作成されません.指定された配列で直接並べ替えられます.
push([item 1[item 2..[itemen]])
これらの要素を新しい要素の出現順に追加します.
パラメータの一つが配列である場合、配列は単一の要素として配列に追加されます.
ポップ()
配列の最後の要素を削除し、要素を返します.
配列が空の場合、undefinedが返されます.
shift()
配列の最初の要素を削除し、要素を返します.
配列が空の場合、undefinedが返されます.
unshift([item 1[,item 2[..[,itemen]]]])
指定された要素を配列の開始位置に挿入し、行列を返します.
splice(start,deleteCount,[item 1[,item 2[...[,itemen]]])])
start位置から指定された個数の要素を削除し、新しい要素を挿入して修正します. concat([item 1[,item 2[..[,itemen]]]))
新しい配列を返します.この新しい配列は2つ以上の配列からなります.元の配列は不変です
追加するアイテムは、左から右に順番に配列に追加されます.
配列のいずれかが、array 1の末尾にコンテンツを追加します.
この項目が配列でない場合、配列の最後に単一の配列要素として追加されます.
slice(start,[end])
指定された要素を含む配列を返します.
は、インデックスがstartに等しい、endより小さい部分を返します.
元の配列は不変です
ジョイン(separator)
すべての要素を指定の区切り記号で区切って文字列を作って、この文字列の値を返します.
配列内の要素が定義されていない場合やnullとして空の文字列として処理されます.
var a = [1, 2, 3];
// , 。
document.write(a.concat([100, 30]) + "
");
document.write(a.concat([100, 30], [60, 90]) + "
");
// 。 。
var b = a.join("$");
document.write(b + "
");
document.write( typeof b + "
");
//string
//
document.write(a.pop() + "
");
// , 。
document.write(a.push(99, 78) + "
");
// , 。
document.write(a.toString() + "
");
//
var c = a.valueOf();
document.write( typeof c + "
");
並べ替え:var a = [100, 9, 20, 3, 7, 96];
document.write(a + "
");
// ,
a.sort();
document.write(a + "
");
//
a.sort(compareTo);
document.write(a + "
");
function compareTo(a, b) {
return a - b;
}
1.5. オブジェクトをカスタマイズ1.5.1. 無参画構造関数
/*
*
*
* */
function Person() {
window.document.write("constructor()
");
}
var person = new Person();
//
person.name = "jack";
person.age = 23;
//
person.work = function() {
window.document.write("person working...
");
};
//
window.document.write(person.constructor + "
");
window.document.write(person.name + "," + person.age + "
");
person.work();
1.5.2. パラメータ構造関数があります.function Person(name, age) {
this.name = name;
this.age = age;
this.work = function() {
alert(this.name + ":" + this.age);
}
}
var person = new Person("jack", 28);
person.work();
1.5.3. Object方式/*
* Object
*
* */
var person = new Object();
person.name = "jack";
person.age = 28;
person.sayHello = function() {
document.write(this.name + ":" + this.age);
}
person.sayHello();
この例は、personというオブジェクトを作成し、2つの属性(name age)と方法(sayHello)を追加しました.立体関数モードを使用してオブジェクトを作成します.
まずカスタムクラスとは、クラス名と同じ関数を定義することです.
newキーワードを使って定義されたクラスを呼び出します.
(任意の関数は、newオペレータによって呼び出しさえすれば、構築関数として機能します.)
説明:
属性と方法をthisに割り当てるには、オブジェクトの属性を表します.
new Objectを書くな.
return文は書かないでください.
JSはnew Person()で次のようなことをします.
1,新しいオブジェクトを作成します.
2,thisは新しいオブジェクトを指します.
3,構造方法のコードを実行します.
4,新しいオブジェクトを返します.
オブジェクトを作成する文字列の量:
var person={
name:" ",
age:88,
eat:function(){
alert("eating...");
}
};
alert(person.name+person.age);
person.eat();
1.6.prototype「prototype」の字面翻訳は「原型」であり、javascriptが継承を実現する主な手段である.大まかに言えば、プロトタイプはjavascriptの関数の一つであり、その値は一つのオブジェクトです.
Prottypeの注意事項:
配列のツールクラスをカスタマイズします.
function arrTool(){}
var ArrayTool = new arrTool();
ArrayTool.getMax = function(arr)
{
var max = 0;
for(var x=1; xarr[max])
max = x;
}
return arr[max];
};
ArrayTool.getMin = function(arr)
{
var min = arr[0];
for(var x=1; xarr[max])
max = x;
}
return arr[max];
}
*/
ArrayTool.binarySearch = function(arr,key)
{
var min,max,mid;
min = 0;
max = arr.length-1;
while(min<=max)
{
mid = (min+max)>>1;
if(key>arr[mid])
min = mid + 1;
else if(key>1;
if(key>arr[mid])
min = mid + 1;
else if(key
配列のツールメソッドをjavascript内蔵オブジェクトArayに追加します. Array.prototype.getIndex = function(element)
{
for(var x=0; x
文字列に新しい方法を追加します.// JavaScript Document
// string 。
// 。
String.prototype.trim = function()
{
var start,end;
start = 0;
end = this.length-1;
while(start<=end && this.charAt(start)==" ")
start++;
while(start<=end && this.charAt(end)==' ')
end--;
return this.substring(start,end+1);
}
// 。
String.prototype.toCharArray = function()
{
var arr = new Array(this.length);
for(var x=0; x