コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > 本文

JavaScript_javascript スキルでよく使用されるローカル オブジェクトの概要

WBOY
リリース： 2016-05-16 15:07:48
オリジナル
1182 人が閲覧しました

1. JavaScript はオブジェクト指向プログラミング言語です

カプセル化: 関連情報 (データまたはメソッド) をオブジェクトに保存する機能

集約: 1 つのオブジェクトを別のオブジェクト内に格納する機能

継承: クラスのプロパティとメソッドを別のクラス (または複数のクラス) から取得する機能。

ポリモーフィズム: 複数の形式で実行できる関数またはメソッドを作成する機能

2. 配列オブジェクト

値の範囲を保存するには、個別の変数名を使用します。

2.1 配列オブジェクトの作成

var aValues = new Array();
var aValues = new Array(25);
var aColors = new Array("red","green","blue");
alert(aColors[1]);//输出green
aColors[0] = "white"; //修改第一个元素的值
var aColors = new Array();
aColors[0] = "red";
aColors[1] = "green";
aColors[2] = "blue";
ログイン後にコピー

2.2 リテラルを使用して配列を作成する

var aColors = ["red","green","blue"];
aColors[3]="black";
ログイン後にコピー

2.3 配列の長さ

var aColors = new Array("red","green","blue“);
alert(aColors.length);//输出3 
var aColors = new Array("red","green","blue“);
alert(aColors.length);//输出3
aColors[20]="black";
alert(aColors.length);//输出21
alert(aColors[3]);//输出undefined
ログイン後にコピー

2.4 配列トラバーサル

var subjects=["html/css/js","Web form","ajax","N-Tiers","oracle"];
for(var i=0;i<subjects.length;i++){
alert(subjects[i]);
} 
var subjects=["html/css/js","Web form","ajax","N-Tiers","oracle"];
for(var index in subjects){
alert(subjects[index]);
}
ログイン後にコピー

2.5 配列の属性とメソッド

length は、配列内の要素の数を設定または返します。

join() は、指定された区切り文字を使用して配列のすべての要素を文字列に連結します。

reverse() は、配列内の要素の順序を逆にします。

sort() は配列の要素を並べ替えます

arrayObject.sort(sortby)

パラメータはオプションです。並べ替えルールを指定します。関数である必要があります。

戻り値は配列への参照です。配列は元の配列に基づいてソートされ、コピーは作成されないことに注意してください。

カスタマイズされた並べ替えルール

他の基準で並べ替えたい場合は、2 つの値を比較し、2 つの値の相対的な順序を示す数値を返す比較関数を提供する必要があります。

比較関数には 2 つのパラメーター a と b が必要で、その戻り値は次のとおりです。a が b より小さい場合、a はソートされた配列内で b より前に表示され、0 より小さい値を返します。 a が b と等しい場合、0 を返します。 a が b より大きい場合、0 より大きい値を返します。

concat(配列 配列)

2 つ以上の配列を連結して結果を返します。

配列スライス(開始番号,終了番号)

既存の配列から選択された要素を返します

varmessages4 =messages3.slice(0, 5);

splice() は要素を削除し、新しい要素を配列に追加します。

messages4.splice(0, 2, "dddd"); //0は削除を開始する要素の位置を示し、2は削除の長さを示し、追加される要素はddddで、削除位置に
を追加します

push() は、1 つ以上の要素を配列の末尾に追加し、新しい長さを返します。

pop() は配列の最後の要素を削除して返します

unshift() は、配列の先頭に 1 つ以上の要素を追加し、新しい長さを返します。

shift() は配列の最初の要素を削除して返します

2.6 配列の応用

var messages = new Array("","","");
messages[0] = "beijing";
messages[1] = "shanghai";
messages[2] = "zhejiang";
messages[3] = "hunan";
for ( var index in messages) {
document.writeln("遍历数组");
document.write(messages[index]);
document.write("<br>");
}
var s = messages.join(',');
document.writeln("join数组");
document.write(s);
document.write("<br>");
messages.reverse();
for ( var index in messages) {
document.writeln("倒序后");
document.write(messages[index]);
document.write("<br>");
}
messages.sort();
for ( var index in messages) {
document.writeln("排序后");
document.write(messages[index]);
document.write("<hr>");
}
var messages2 = ["a","c","b"];
var messages3 = messages.concat(messages2);
for ( var index in messages3) {
document.writeln("合并后");
document.write(messages3[index]);
document.write("<hr>");
}
var messages4 = messages3.slice(0, 5);
for ( var index in messages4) {
document.writeln("选择slice(0,5)后");
document.write(messages4[index]);
document.write("<hr>");
}
ログイン後にコピー

上記のコードの出力結果は次のとおりです:

配列北京を走査

配列上海を走査する

配列 zhejiang を走査する

配列 hunan を走査します

配列北京、上海、浙江、湖南を結合

逆順湖南後

逆順浙江後

逆順上海後

逆順後の北京

北京を並べ替えた後

湖南の選別後

上海の仕分け後

浙江省の仕分け後

合併後の北京

湖南市合併後

上海合併後

浙江省合併後

マージ後

マージ後

マージ後 b

スライス(0,5)を選択した後、北京

スライス(0,5)湖南を選択した後

slice(0,5) 上海を選択した後

slice(0,5) 浙江を選択した後

slice(0,5) a を選択した後

3. 日付オブジェクト

Date オブジェクトは、日付と時刻を取得して処理するために使用されます。

3.1 日付の定義

var myDate=new Date() ;
var myDate=new Date(2009 , 7 , 20); //2009-08-20 
var myDate=new Date(2009 , 7 , 20 , 16, 40 ,58, 999); //依次表示年月日时分秒毫秒
ログイン後にコピー

3.2日期对象的方法

3.2.1toXXX方法组

toString() 把 Date 对象转换为字符串。

toTimeString()

把 Date 对象的时间部分转换为字符串。

toDateString()

把 Date 对象的日期部分转换为字符串。

toGMTString() 根据格林尼治时间，把 Date 对象转换为字符串。

toUTCString() 根据世界时，把 Date 对象转换为字符串。

toLocaleString()

把 Date 对象转换为本地时间格式字符串。

toLocaleTimeString()

把 Date 对象的时间部分转换为本地时间格式字符串

toLocaleDateString()

把 Date 对象的日期部分转换为本地时间格式字符串

3.2.2getXXX方法组

getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)

getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)

getMonth() 从 Date 对象返回月份 (0 ~ 11)

getFullYear() 从 Date 对象以四位数字返回年份

getYear() 从 Date 对象以两位或四位数字返回年份。

getHours() 返回 Date 对象的小时 (0 ~ 23)

getMinutes() 返回 Date 对象的分钟 (0 ~ 59)

getSeconds() 返回 Date 对象的秒数 (0 ~ 59))

getMilliseconds()

返回 Date 对象的毫秒(0 ~ 999)

getTime() 返回 1970 年 1 月 1 日至今的毫秒数

3.2.3setXXX方法组

setDate() 设置 Date 对象中月的某一天 (1 ~ 31))

setMonth() 设置 Date 对象中月份 (0 ~ 11))

setFullYear() 设置 Date 对象中的年份（四位数字）

setYear() 设置 Date 对象中的年份（两位或四位数字）。

setHours() 设置 Date 对象中的小时 (0 ~ 23)

setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)

setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)

setMilliseconds()

设置 Date 对象中的毫秒 (0 ~ 999)

setTime() 通过向时间原点添加或减去指定毫秒数来计算日期和时间

四、String对象

String对象表示Unicode字符的序列。

String 对象的 length 属性声明了该字符串中的字符数。

String 类定义了大量操作字符串的方法。

4.1属性

length 字符串的长度

4.2与字符串格式控制相关的方法

big()、small() 用大号字体、小字号体显示字符串。

bold() 使用粗体显示字符串。

italics() 使用斜体显示字符串。

strike() 使用删除线来显示字符串。

fontcolor() 使用指定的颜色来显示字符串。

fontsize() 使用指定的尺寸来显示字符串。

sub()、sup() 把字符串显示为下标、上标。

toLowerCase()、toUpperCase()

把字符串转换为小写、大写。

fixed() 以打字机文本显示字符串。

link() 将字符串显示为链接。

anchor() 创建 HTML 锚。

4.3与字符串内容操作相关的方法

charAt() 返回在指定位置的字符。

charCodeAt() 返回在指定的位置的字符的 Unicode 编码。

concat() 连接字符串。

fromCharCode()

从字符编码创建一个字符串。

indexOf()、lastIndexOf()

从前向后检索字符串。从后向前搜索字符串。

localeCompare()

用本地特定的顺序来比较两个字符串。

match() 找到一个或多个正在表达式的匹配。

replace()、search()

替换、检索与正则表达式匹配的子串。

slice() 提取字符串的片断。

split() 把字符串分割为字符串数组。

substr() 从起始索引号提取字符串中指定数目的字符。

substring() 提取字符串中两个指定的索引号之间的字符。

4.4应用

var strings = new String("AbcDEfG");
document.write("strings中的字符串值：");
document.write(strings);
document.write('<hr>');
document.write("strings.big()大号字体显示：");
document.write(strings.big());
document.write('<hr>');
document.write("strings.small()小号字体显示：");
document.write(strings.small());
document.write('<hr>');
document.write("strings.bold()粗体显示：");
document.write(strings.bold());
document.write('<hr>');
document.write("strings.italics()斜体显示：");
document.write(strings.italics());
document.write('<hr>');
document.write("strings.strike()删除线显示：");
document.write(strings.strike());
document.write('<hr>');
document.write("strings.fontcolor('green')指定颜色显示：");
document.write(strings.fontcolor('green'));
document.write('<hr>');
document.write("strings.fontsize(10)指定大小显示：");
document.write(strings.fontsize(10));
document.write('<hr>');
document.write("strings.sub()下标显示：");
document.write("123"+ strings.sub());
document.write('<hr>');
document.write("strings.sup()上标显示：");
document.write("123"+strings.sup());
document.write('<hr>');
document.write("strings.toLocaleLowerCase()小写显示：");
document.write(strings.toLocaleLowerCase());
document.write('<hr>');
document.write("strings.toLocaleUpperCase()大写显示：");
document.write(strings.toLocaleUpperCase());
document.write('<hr>');
document.write("strings.fixed()打字机文本显示：");
document.write(strings.fixed());
document.write('<hr>');
document.write("strings.link()链接显示：");
document.write(strings.link());
document.write('<hr>');
document.write("strings.anchor()创建HTML锚显示：");
document.write(strings.anchor());
document.write('<hr>');
document.write("strings.charAt(2)返回指定位置的字符：");
document.write(strings.charAt(2));
document.write('<hr>');
document.write("strings.charCodeAt(2)返回指定位置的字符的unicode编码：");
document.write(strings.charCodeAt(2));
document.write('<hr>');
document.write("strings.concat('higkL')连接字符串：");
document.write(strings.concat("higkL"));
document.write('<hr>');
document.write("String.fromCharCode(98)静态方法从字符编码创建一个字符串：");
document.write(String.fromCharCode(98));
document.write('<hr>');
document.write("strings.indexOf('G', 1)从指定1处开始从前向后检索字符，返回一个位置值：");
document.write(strings.indexOf('G', 1));
document.write('<hr>');
document.write("strings.lastIndexOf('G', 1)从指定1处开始从后向前检索字符，找不到指定字符位置返回-1.返回一个位置值：");
document.write(strings.lastIndexOf('G', 1));
document.write('<hr>');
document.write("strings.localeCompare('ABcdEfG')：'ABcdEfG'从第0个位置开始比较'AbcDEfG'，如果两个字符串完全相同返回0，被比较的字符串ASSIC码值要小，则返回-1，大则返回1。用本地特定的顺序来比较两个字符串:");
document.write(strings.localeCompare("ABcdEfG"));
document.write('<hr>');
document.write("strings.match('[a-z]{2}')：'AbcDEfG'，返回值为bc，表示匹配到了。匹配不到返回null。找到一个或多个正则表达式的匹配:");
document.write(strings.match('[a-z]{2}'));
document.write('<hr>');
document.write("strings.search('[a-z]')：'AbcDEfG'，返回值为下标1，表示检索到了。匹配不到返回-1。找到一个或多个正则表达式的匹配:");
document.write(strings.search('[a-z]'));
document.write('<hr>');
document.write('strings.slice(2, 3)参数1表示开始位置，参数2表示结束位置，不包括该位置。提取字符串：');
document.write(strings.slice(2, 3));
document.write('<hr>');
document.write('strings.substring(2, 3)参数1表示开始位置，参数2表示结束位置，不包括该位置。提取字符串：');
document.write(strings.substring(2, 3));
document.write('<hr>');
以上代码输出为
strings中的字符串值：AbcDEfG
strings.big()大号字体显示：AbcDEfG
strings.small()小号字体显示：AbcDEfG
strings.bold()粗体显示：AbcDEfG
strings.italics()斜体显示：AbcDEfG
strings.strike()删除线显示：AbcDEfG
strings.fontcolor('green')指定颜色显示：AbcDEfG
strings.fontsize(10)指定大小显示：AbcDEfG
strings.sub()下标显示：123AbcDEfG
strings.sup()上标显示：123AbcDEfG
strings.toLocaleLowerCase()小写显示：abcdefg
strings.toLocaleUpperCase()大写显示：ABCDEFG
strings.fixed()打字机文本显示：AbcDEfG
strings.link()链接显示：AbcDEfG
strings.anchor()创建HTML锚显示：AbcDEfG
strings.charAt(2)返回指定位置的字符：c
strings.charCodeAt(2)返回指定位置的字符的unicode编码：99
strings.concat('higkL')连接字符串：AbcDEfGhigkL
String.fromCharCode(98)静态方法从字符编码创建一个字符串：b
strings.indexOf('G', 1)从指定1处开始从前向后检索字符，返回一个位置值：6
strings.lastIndexOf('G', 1)从指定1处开始从后向前检索字符，找不到指定字符位置返回-1.返回一个位置值：-1
strings.localeCompare('ABcdEfG')：'ABcdEfG'从第0个位置开始比较'AbcDEfG'，如果两个字符串完全相同返回0，被比较的字符串ASSIC码值要小，则返回-1，大则返回1。用本地特定的顺序来比较两个字符串:-1
strings.match('[a-z]{2}')：'AbcDEfG'，返回值为bc，表示匹配到了。匹配不到返回null。找到一个或多个正则表达式的匹配:bc
strings.search('[a-z]')：'AbcDEfG'，返回值为下标1，表示检索到了。匹配不到返回-1。找到一个或多个正则表达式的匹配:1
strings.slice(2, 3)参数1表示开始位置，参数2表示结束位置，不包括该位置。提取字符串：c
strings.substring(2, 3)参数1表示开始位置，参数2表示结束位置，不包括该位置。提取字符串：c
ログイン後にコピー

五、Math物件

Math物件是一個數學工具，包含許多表示數學常數的靜態唯讀屬性和執行數學運算的靜態方法。

E 常數 e，自然對數的底數 (約等於2.718)

LN2 回傳 2 的自然對數(約等於0.693)

LN10 回傳 10 的自然對數(約等於2.302)

LOG2E 傳回以 2 為底的 e 的對數 (約等於 1.414)

LOG10E 傳回以 10 為底的 e 的對數 (約等於0.434)

PI 回傳圓周率 (約等於3.14159)

SQRT1_2 回傳 2 的平方根除 1 (約等於 0.707)

SQRT2 回傳 2 的平方根 (約等於 1.414)

abs(x) 傳回數的絕對值

cos(x)、acos(x)

傳回數的正弦、反餘弦值

sin(x) 、asin(x)

傳回數的正弦、反正弦值

tan(x)、atan(x)

傳回角的正切、回傳 -PI/2 與 PI/2之間弧度數的反正切值

atan2(y,x) 回傳從 x 軸到點 (x,y) 的角度

ceil(x)、floor(x)

對一個數字進行上舍入。對一個數進行下捨入。

exp(x)、log(x) 傳回 e 的指數。傳回數的自然對數（底為e）

max(x,y)、min(x,y)

傳回 x 和 y 中的最高值

pow(x,y) 傳回 x 的 y 次方

random() 傳回 0 ~ 1 之​​間的隨機數

round(x) 把一個數四捨五入為最接近的整數

sqrt(x) 傳回數的平方根

六、Global物件

全域物件是預先定義的對象，作為 JavaScript 的全域函數和全域屬性的佔位符。

透過使用全域對象，可以存取所有其他所有預先定義的對象、函數和屬性。
全域物件不是任何物件的屬性，所以它沒有名稱。它既沒有建構函數，也無法實例化一個新的全域對象，它的所有成員都是靜態的。

6.1全域屬性

Infinity 代表正的無窮大的數值。

NaN 指示某個值是不是數字值。

undefined 指示未定義的值。

6.2全域函數

decodeURI() 解碼某個編碼的 URI。

decodeURIComponent()

解碼一個編碼的 URI 組件。

encodeURI() 把字串編碼為 URI。

encodeURIComponent()

把字串編碼為 URI 元件。
eval() 計算字串，並把它當作腳本程式碼來執行。

isFinite() 檢查某個數值是否為有窮大的數。

isNaN() 檢查某個數值是否為數字。

isNaN() 函數通常用來偵測 parseFloat() 和 parseInt() 的結果，以判斷它們表示的是否是合法的數字。當然也可以用 isNaN() 函數來偵測算數錯誤，例如用 0 作除數的情況。

parseFloat() 解析一個字串並傳回一個浮點數。

parseInt() 解析一個字串並傳回一個整數。

七、小結

JavaScript是一門物件導向的語言，具有自訂物件的能力。同時，它可以基於已有對象編程，包含ECMAScript的本地對象，作為宿主的瀏覽器運行環境提供一組瀏覽器對象和網頁提供的對象。

本地物件是一組由ECMAScript提供的參考類型，它何ECMAScript都會實現的一些對象，與特定的腳本宿主無關。
數組物件實際上是長度動態的集合，它包含了長度屬性和排序，反轉，拼接等方法。

日期物件表示某個特定的時刻。可透過它的建構函式取得瀏覽器本機的系統時間，或指定特定的日期時間，它包含一組get方法可用於取得日期物件中的某部分信息，也可用它的一組get方法改變日期對象的某些方法，或透過它的一組to方法來獲得日期物件的字串形式。

字串物件表示0個或多個Unicode字元的序列。它包含了length屬性，另有一組用於格式變換的方法和對其中的字元進行操作的方法。

全域物件包含一系列全域的屬性和全域的函數，這些屬性和函數可不經引用任何物件直接使用。

數學物件包含一組靜態只讀屬性用於表示一些數學常數，另包含一組靜態方法用於實現常用的數學運算。

有關JavaScript常用本地物件小結小編就跟大家介紹這麼多，希望對大家有幫助！

関連ラベル：
javascript常用对象 javascript对象
ソース：php.cn
前の記事：Jquery は cookie を操作して username_jquery を記憶します 次の記事：JavaScript アバター アップロード プラグイン ソース コードの共有_JavaScript スキル
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
d3.js でズームインすると散布図のポイントの値が維持されない d3.js を使用するのは初めてなので、ご容赦ください。 vue.js ファイルに純粋な JavaScript として実装しました。ズーム機能を使用して散布図を作成しようとしていま...
から 2024-04-06 18:16:26
0
1
403
Android 上の React-Native でステータス更新が機能しない スワイプ可能な水平ギャラリーに画像のペアを含むコードがいくつかあります。両方の画像の上部をクリックすると、画像がオフに切り替わるはずです。そのため、私が行ったのは、isImage2...
から 2024-04-06 16:54:10
0
1
410
無効な React 子要素 (見つかった: キー {clientVersion} を持つオブジェクト)。子要素のコレクションをレンダリングする場合は、代わりに配列を使用してください 複数ステップのフォームを持っているのですが、送信しようとするとこのエラーが表示されます。ただし、createOrganization スケジュールを単純な形式で使用すると、機能しま...
から 2024-04-06 16:25:39
0
1
346
ページのメインディスプレイに画像を表示するにはどうすればよいですか? 私がやりたいのは、NASAAPI を使用して写真を受信することです。これらの写真は、マイページのサムネイルとメインディスプレイに表示されます。コードがサムネイルから画像を取得してペ...
から 2024-04-06 15:33:12
0
1
433
vue vee-validate は日付ピッカーの選択の問題をキャプチャします datepicker フィールドの v-model バインディングが正しく機能しません。選択を行うと、画面上でライブ更新されますが、値は formValues リアクティブ オブジ...
から 2024-04-06 11:38:56
0
1
510
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート