More than 1 year has passed since last update.

はじめてのJavaScript⑰ 「Functionコンストラクタ」

Last updated at 2021-11-23Posted at 2021-11-02

1. はじめに

本記事では、JavaScriptの
「Functionコンストラクタ」
について記載する。

new式を使用して新規オブジェクト（インスタンス）を作成する関数のこと。

上で書いたような訳の分からない用語が出てきたので、細かく分けて解説していく。

オブジェクトとは
関連のあるデータと機能の集合
のことを指す。

オブジェクト内の細かいパーツのようなもの。
Twitterを例として挙げると、以下のようにTwitterに表示されている画面がオブジェクトだとしたら、投稿者や投稿者の画像、投稿した日付などの細かいパーツはインスタンスと呼ばれるものである。

Twitterの全体がオブジェクト、投稿者名や日付などの細かいパーツがインスタンスである。

構文は以下のようになる。

index.js

let 変数名 = new Function(引数1、引数2、...、関数本体の処理);

※Functionは先頭のみ大文字表記なので要注意！！

new演算子の役割として、

オブジェクト指向なプログラミング言語で出てくる演算子のひとつで、 クラス（設計図）からインスタンス（実体）を作るときに使う演算子

という役割がある。
なお、Functionコンストラクタにnew演算子を付け忘れた場合はエラーが発生してしまうので
付け忘れないようにすること。

例題の内容は、過去に記載した記事より参照→はじめてのJavaScript⑭ 「関数」 5.例題より

例題は「四角形の面積を計算する関数」というテーマで進めていく。

四角形の縦の長さと横の長さを引数に渡すと、四角形の面積(縦×横)を計算して、値を返す関数を作る

作った関数を使って、高さ3m、横幅5mの四角形の面積を求め、コンソールへ出力する

※単位は㎡とする。(単位の出力は不要)

index.js

let getRectangle = new Function('height', 'width', 'return height*width');
console.log(getRectangle(3, 5));

この構文の解釈の仕方としては、前回記事にした関数リテラルと解釈が同じなので割愛する。
何度もいうが、
Functionコンストラクタで記述する際はFunctionの大文字表記を忘れずにやること。

前回同様、縦3と横幅5の面積は15㎡となるはず。

今回も正しく出力できた。