このページは、JavaScriptのメソッド解説記事を一覧でまとめました。
各メソッドに簡単なサンプルプログラムも載せています。
ご参考になれば幸いです。
(使い方が複数あるメソッドは、最もシンプルなものを載せています)
a
aの章では
- alertメソッド
- appendChildメソッド
をまとめています。
alertメソッド
alertメソッドとは、引数に指定した文字列を
とアラートを表示させるメソッド。
1 |
alert('Hello World') |
appendChildメソッド
appendChildメソッドとは、呼び出している要素を親として、引数に指定した要素を親要素の子要素のリストの最後に追加して、追加した子要素を返すメソッド。
1 2 |
var result = 【親要素】.appendChild(【子要素】) // 変数resultには、追加した【子要素】が返され【親要素】の子要素のリストの最後に【子要素】が追加される |
c
cの章では
- charAtメソッド
- classNameメソッド
- confirmメソッド
- createElementメソッド
をまとめています。
charAtメソッド
charAtメソッドとは、呼び出した文字列から引数で指定したインデックスの文字を返すメソッド。
1 2 3 |
var sample = 'sample' var result = sample.charAt(2) // 変数resultには「m」という文字が返される |
classNameメソッド
classNameメソッドとは、HTML要素のclass属性に対して
- 取得
- 変更
- 追加
ができるメソッド。
1 2 |
var sample = 【HTML要素】.className // sampleに指定したHTML要素のclassを取得することができる |
confirmメソッド
confirmメソッドとは、引数に指定した文字列を
というように、ブラウザに確認ダイアログとして表示させるメソッド。
1 |
confirm('Hello World'); |
createElementメソッド
createElementメソッドとは、引数に指定したHTML要素を新規作成し、作成した要素を返すメソッド。
1 2 |
var result = document.createElement('div') // 変数resultには、createElementメソッドで新規作成されたdiv要素が返される |
g
gの章では
- getElementByIdメソッド
をまとめています。
getElementByIdメソッド
getElementByIdメソッドとは、引数に指定されたidと一致する要素のElementオブジェクトを返すメソッド。
1 2 |
var result = document.getElementById('sample') // 変数resultに、指定した「sample」というidの要素が存在していればそのElementオブジェクトを、なければnullを返す |
j
jの章では
- joinメソッド
をまとめています。
joinメソッド
joinメソッドとは、呼び出した配列の要素をすべて連結した文字列を作成して返すメソッド。
1 2 3 |
var sample = ['aa', 'bb', 'cc'] var result = sample.join() // 変数resultには「aa,bb,cc」という文字列が返される |
m
mの章では
- Math.ceilメソッド
- Math.floorメソッド
- Math.randomメソッド
- Math.roundメソッド
をまとめています。
Math.ceilメソッド
Math.ceilメソッドとは、引数の数の小数点以下を切り上げした数を返すメソッド。
1 2 |
var result = Math.ceil(5.1) // 変数resultには「6」が返される |
Math.floorメソッド
Math.floorメソッドとは、引数の数の小数点以下を切り捨てした数を返すメソッド。
1 2 |
var result = Math.floor(7.9) // 変数resultには「7」が返される |
Math.randomメソッド
Math.randomメソッドとは、0以上1未満の乱数を生成して返すメソッド。
1 |
var result = Math.random() |
変数resultには
- 0.43524960814804525
- 0.34739421521127967
- 0.16544713945965017
というような値が返される
Math.roundメソッド
Math.roundメソッドとは、引数の数の小数点以下を四捨五入した数を返すメソッド。
1 2 |
var result = Math.round(6.5) // 変数resultには「7」が返される |
n
nの章では
- Number.isIntegerメソッド
をまとめています。
Number.isIntegerメソッド
Number.isIntegerメソッドとは、引数の値が整数であればtrue、そうでなければfalseを返すメソッド。
1 2 |
var result = Number.isInteger(3) // 変数resultには「true」が返される |
p
pの章では
- popメソッド
- pushメソッド
をまとめています。
popメソッド
popメソッドとは、配列の末尾から要素を削除し、削除した要素を返すメソッド。
1 2 3 |
var sample = [1, 2, 3, 4] var result = sample.pop() // 変数resultには4が返され、配列sampleは[1, 2, 3]になる |
pushメソッド
pushメソッドとは、呼び出した配列の末尾に引数の要素を追加し、追加後の配列の要素数を返すメソッド。
1 2 3 |
var sample = [1, 2, 3, 4] var result = sample.push(0) // 変数resultには「5」が返され、配列sampleは[1, 2, 3, 4, 0]になる |
r
rの章では
- repeatメソッド
- reverseメソッド
をまとめています。
repeatメソッド
repeatメソッドとは、呼び出している文字列を引数で指定している数だけ繰り返した文字列を返すメソッド。
1 2 3 |
var sample = 'ab' var result = sample.repeat(2) // 変数resultには「abab」という文字列が返される |
reverseメソッド
reverseメソッドとは、呼び出した配列を逆順にするメソッド。
1 2 3 |
var sample = ['aa', 'bb', 'cc'] sample.reverse() // 実行後配列sampleは['cc', 'bb', 'aa']という配列になっている |
s
sの章では
- shiftメソッド
- splitメソッド
をまとめています。
shiftメソッド
shiftメソッドとは、配列の先頭から要素を削除し、削除した要素を返すメソッド。
1 2 3 |
var sample = [1, 2, 3, 4] var result = sample.shift() // 変数resultには1が返され、配列sampleは[2, 3, 4]になる |
splitメソッド
splitメソッドとは、文字列を指定した区切り文字で分割して配列を作成して返すメソッド。
1 2 3 |
var sample = 'aaa/bbb/ccc' var result = sample.split('/') // 変数resultには['aaa', 'bbb', 'ccc']という配列が返される |
t
tの章では
- toLowerCaseメソッド
- toUpperCaseメソッド
をまとめています。
toLowerCaseメソッド
toLowerCaseメソッドとは、呼び出している文字列内にある大文字を小文字に変換した文字列を返すメソッド。
1 2 3 |
var sample = 'AB' var result = sample.toLowerCase() // 変数resultには「ab」という文字列が返される |
toUpperCaseメソッド
toUpperCaseメソッドとは、呼び出している文字列内にある小文字を大文字に変換した文字列を返すメソッド。
1 2 3 |
var sample = 'ab' var result = sample.toUpperCase() // 変数resultには「AB」という文字列が返される |
u
uの章では
- unshiftメソッド
をまとめています。
unshiftメソッド
unshiftメソッドとは、呼び出した配列の先頭に引数の要素を追加し、追加後の配列の要素数を返すメソッド。
1 2 3 |
var sample = [1, 2, 3, 4] var result = sample.unshift(0) // 変数resultには「5」が返され、配列sampleは[0, 1, 2, 3, 4]になる |