JavaScriptで数値の範囲を指定した個数の区間に分割する方法
問題の概要
0から始まり、ある正の整数 n で終わる区間を考えます。この区間は配列を使って次のように表すことができます。
const interval = [0, n];ただし、範囲が必ず0から始まることは分かっているため、単に上限値だけで表すことも可能です。
const interval = n;求められる処理
ここで、2つの数値を引数として受け取るJavaScript関数を作成します。
- 第1引数: 0から始まり、その数で終わる区間を表します。
- 第2引数: 元の区間をいくつの等間隔の区間に分割するかを指定します(可能な場合)。
具体例
たとえば、入力が「3」と「2」だった場合を考えてみましょう。元の区間は [0, 3] = [0, 1, 2, 3] であり、これを2つの等しい区間に分割する必要があります。
したがって、この入力に対する出力は次のようになります。
const output = [
[0, 1],
[2, 3]
];なお、各区間の上限と下限は常に整数である点に注意してください。
実装コード
この処理を実現するコードは以下の通りです。
例
const getIntervals = (interval, num) => {
const size = Math.floor(interval / num);
const res = [];
for (let i = 0; i <= interval; i += size) {
const a = i == 0 ? i : (i += 1);
const b = i + size > interval ? interval : i + size;
if (a < interval) {
res.push([a, b]);
}
}
return res;
};
console.log(getIntervals(3, 2));コードの解説
このコードでは、まず Math.floor() を使って区間の基本サイズを計算しています。interval を num で割り、小数点以下を切り捨てることで、各区間の幅を求めています。
続いて for ループにより、開始位置 i を size ずつ増やしながら各区間を順番に生成します。変数 a は区間の始点、b は終点を表しており、最後の区間が上限 interval を超えないよう三項演算子で調整されています。また、始点が上限未満の場合のみ結果配列に追加することで、余分な区間の生成を防いでいます。
出力結果
コンソールには次のように出力されます。
[
[0, 1],
[2, 3]
]
-
JavaScriptの範囲オーバーフロー・範囲アンダーフロー(rangeOverflow/rangeUnderflow)プロパティの使い方
rangeOverflow・rangeUnderflowプロパティとはJavaScriptでは、フォーム要素の validity プロパティ(ValidityStateオブジェクト)を利用することで、ユーザーが入力した値が条件を満たしているかどうかを簡単に検証できます。この中には、数値の入力範囲をチェックするための「rangeOverflow」と「rangeUnderflow」という2つのプロパティが用意されています。Range Underflow(範囲アンダーフロー)入力要素の値が、min属性で指定された最小値よりも小さい場合、validity.rangeUnderflow は true を
-
JavaScriptで数字パターンを表示する方法【初心者向けサンプルコード】
本記事では、テキスト入力欄とボタンを備えたJavaScript・HTMLプログラムの作成方法を解説します。ユーザーが入力欄に任意の数値(例:5)を入力してボタンをクリックすると、画面に以下のような数字パターンが表示される仕組みです。(n = 5 の場合の出力例)01 01 02 01 02 03 01 02 03 04 01 02 03 04 05仕組みのポイントこのパターンは二重ループ(ネストしたforループ)を使うことで実現できます。外側のループが「行」を制御し、内側のループがその行に表示する「数字の個数」を制御します。i 行目には 1 から i までの数字が順番に出力されるため、行が進む