html 内に javascript を記述していたら Uncaught SyntaxError: Illegal return statement というエラーが起きた時の対応

最終更新日:

下記のように html に直接 javascript を書いていたら、
Uncaught SyntaxError: Illegal return statement というエラーが起きた。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>closure</title>
</head>
<body>
	show developer console
	<script type="text/javascript">
		// Uncaught SyntaxError: Illegal return statement
		return
	</script>
</body>
</html>

これは何かと言うと、本来 return できない位置に return してますよ。
というエラーらしい。

確かに html の途中で return するのは意味がわからないと思った。
普通に関数の中に return する場合は大丈夫。

読み込みと一緒に何か処理したくて、
途中 return やら break やらを挟みたい時は即時関数を使えば解決する。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>closure</title>
</head>
<body>
	show developer console
	<script type="text/javascript">
		(function(){
			console.log('即時関数... Immediately Invoked Function Expression')
			return
		})()
	</script>
</body>
</html>

もしくは、
普通に関数を呼び出す。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>closure</title>
</head>
<body>
	show developer console
	<script type="text/javascript">

		function init() {
			console.log("hoge")
			return
		}

		init()

	</script>
</body>
</html>