🐡

JavaScriptの関数定義でちょっと驚いたこと

2022/08/25に公開

もしかするとよく知られたことなのかもしれないですが、
JavaScriptの関数定義に関して驚いたことがいくつかあったのでメモ。

同じ名前の関数を再定義できる

JavaScriptでは、
以下のように同じ名前で引数も全く同じ関数を複数定義してもエラーになりません。

function test() {
  return console.log('1')
}

function test() {
  return console.log('2')
}

test() // '2'

ただし、arrow functionを使いconstで定義した場合はもちろんエラーになります。

const test = () => {
  return console.log(1)
}

const test = () => {
  return console.log(2)
}

test() // Uncaught SyntaxError: Identifier 'test' has already been declared

同じ名前の引数を定義できる

以下のように、同一関数内で同じ名前の引数を複数定義してもエラーになりません。

function test(a,a,a) {
  return console.log(a)
}

test(1,2,3) // 3

arrow functionの場合はエラーになります。

const test = (a,a,a) => {
  return console.log('test')
}

test(1,2,3) // Uncaught SyntaxError: Duplicate parameter name not allowed in this context

TypeScriptならすべてコンパイルエラーを吐いてくれる

TypeScriptで同じ名前の関数を複数定義、同一関数内に同名の引数を複数定義した場合
エディタで然るべき設定をしておけばすべてエディタ上でエラーを吐いてくれます。

普段、TypeScriptを書いているので
JavaScriptの場合このような実装がエラーにならないことを初めて知りました。

Discussion