JavaScript

【JavaScript】URLの解析

ブラウザでのURLの解析方法はNode.jsの「WHATWG URL」と同じである。
このURLを解析するコードをNode.js v18.15.0で動かすとブラウザと同じ結果になることを確認した。

続きを読む

【JavaScript】argumentsオブジェクトを配列(Array)に変換する

argumentsはlengthプロパティを持っている。
しかし、配列ではなく配列風オブジェクトである。
最近のコーティングではfor文の代わりにforEach文を使うが、argumentsにforEach文を使うにはargumentsを配列に変換する必要がある。
Array.prototype.slice.call(配列風オブジェクト)で配列風オブジェクトを配列に変換する。
argumentsはArray.prototype.slice.call(配列風オブジェクト)で配列に変換後にforeachメソッドを使う。
Array.prototype.slice.call(配列風オブジェクト)を省略して書くと[].slice.call(配列風オブジェクト)となる。

JavaScriptの仕様ではArray.prototype.slice.call(配列風オブジェクト)による順序の保証は明示されていない。ただし、多くの環境や実装では、sliceメソッドが配列風オブジェクトの要素を順番にコピーするため、順序が保証されることが一般的である。

続きを読む

【JavaScript】正規表現の否定先読みの実践サンプル

「\n<br>」と「アルファベット26文字」で構成された文字列の中で変数wordに入った文字列(アルファベット26文字で構成)と一致した場合は「<span class=’abc’>文字列(アルファベット26文字で構成)<\/span>」に置換する。
これは正規表現の否定先読み(Negative lookahead)を利用すると実現可能。

続きを読む

【JavaScript】アスキーの特殊文字を全て表す正規表現

Webアプリケーションでアスキーの特殊文字32文字を入力したら、「特殊文字は入力不可」と表示させる。
このようなことをしたい場合は、32個のアスキー特殊文字を表す正規表現オブジェクトを生成する必要がある。
この32文字の特殊文字を表す正規表現を1文字づつ書くと長くなる。
しかし、32個のアスキー特殊文字を正規表現クラス[]を用いて文字範囲を指定して短く書くことができる。
!から/まで文字の範囲を指定する。
:から@まで文字の範囲を指定する。
[から`まで文字の範囲を指定する。
{から˜まで文字の範囲を指定する。
これにより短い正規表現で表せる。
[!-\/:-@[-`{-~]

続きを読む

【JavaScript】即時関数とthis

IIFEは定義されるとすぐに実行される。
即時関数の中のthisにはグローバルオブジェクトがセットされることに注意する。
次にような挙動になる。
bind、apply、callを使ってthisの値をコントロールする。

続きを読む

【JavaScript】クロージャ(closure)はプライベートな変数や関数を作る

クロージャ(closure)についての解説の続き。

前回書いた記事
【JavaScript】クロージャ(closure) (attacktube.com)
【JavaScript】クロージャ(closure)とonclickメソッド (attacktube.com)

クロージャ(closure)はプライベートな変数や関数を作ることに利用できる。
プライベートな変数とメソッドを定義したコードを次に示す。



const myspace = {};

//myspace.sampleは即時関数であり定義して即座に実行される。
//クロージャ(closure)はプライベートな変数や関数を作る。
myspace.sample = function() {

    //strはmyspace.sampleの中からだけアクセス可能
    const str = "hello world";
    const that = {};
    const my = {};

    //my.Test関数はmyspace.sampleの中からだけアクセス可能
    my.Test = function() {
        console.log(str);
    };

    //that.Init関数はmyspace.sampleの外からアクセス可能
    that.Init = function(num) {
        console.log(num + "年");
        my.Test();
    };

    return that;

};


myspace.sample().Init(2023);

続きを読む

【JavaScript】function文(The function Statement)とfunction式(The function Expression)

Javascriptにはfunction文(The function Statement)とfunction式(The function Expression)が存在する。
function文とfunction式は別物である。
function文は省略記法であり、functionオブジェクトをvar文で変数に格納することを意味している。


//function文(The function Statement)
function foo() {}

//これは、以下のfunction式(The function Expression)を用いた記述と同じ意味になる。
var foo = function() {};
続きを読む