(標準組み込みオブジェクト > String/Array/Function > プロパティ)
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/length
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/length
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Function/length
lengthは、主に文字列の長さや配列の要素数を取得することができるプロパティ。
文字列の長さを取得できれば最大文字数を設定して、超えた場合に注意を促すということが簡単に実現する。
さらに、関数の引数を取得するような応用技も可能である。
文字列の「length」使い方
//文字列にそのままlengthを使う
文字列.length
//変数に代入した文字列にlengthを使う
var str = '文字列';
str.length;
数値型(Number)を扱う場合の注意点
数値に「length」は利用できないが、数値に文字列を組み合わせれば利用することができる。
以下の例では、数値データの末尾に文字列という文字を連結している。これにより、数値を含めて全体的に文字列の扱いになる。
var str = 12345 + '文字列';
console.log( str.length ); // 8
配列の「length」使い方
基本的には、配列に対して「length」を実行するだけで利用できる。
取得できる数値は、配列の要素数となっておりどのくらい要素が格納されているのかを確認できる。
var array = ['リンゴ', 'ブドウ', 'メロン', 'イチゴ'];
console.log( array.length ); // 4
要素数をlengthで変更する方法
配列の場合はlengthに値を代入することで、要素数を自由に変更することができる。
var array = ['リンゴ', 'ブドウ', 'メロン', 'イチゴ'];
// 要素数を3に変更する
array.length = 3;
console.log( array ); // ["リンゴ", "ブドウ", "メロン"]
逆に、「length = 5」にして要素数を増やした場合は以下のようになる。
var items = ['リンゴ', 'ブドウ', 'メロン'];
//要素数を5に変更する
items.length = 5;
console.log( items ); // Array(5) ["リンゴ", "ブドウ", "メロン"]
配列の要素数を「5」と設定しており、実行結果を見ると5個の要素に増えているのが分かる。追加された要素は未定義のため「undefined」が格納されていることに注意する。
ちなみに、lengthの値はプラスの値のみ設定可能で、マイナスを設定するとエラーになる。
関数の「length」使い方
関数で「length」を使うと、その関数で定義されている「引数」がいくつあるのかを取得することができる。
これにより、引数の数で条件分岐なども出来るようになる。
function value( item1, item2, item3, item4 ) {
// 何らかの処理
}
console.log( value.length ); // 4
オブジェクトの「length」
オブジェクトに対してlengthを使うと、結果はundefinedになる。つまり、lengthによる要素数を取得することができないため、オブジェクトの要素を配列データとして取得できるObject.keys()を活用する。
以下の例ではオブジェクト「obj」に3つのプロパティを持っているため、「3」と表示される。
var obj = {
name: '太郎',
age: 30,
location: '日本'
}
var value = Object.keys( obj );
console.log( value.length ); // 3