skillup

技術ブログ

JavaScript

JavaScript 変数、配列、オブジェクト、スコープ、関数、オブジェクトの基本について

投稿日:2016年4月26日 更新日:

日頃業務で使っているJavaScriptについて。自分的なメモです。

変数定義

var hoge;
var つけないと一気にグローバル変数になるので注意。逆にそれを意図して定数としてつかうのもあり。

配列の定義

[]でくくります。
各要素の定義は通常通りarr[1]=”hoge”といった定義の仕方・アクセスでOK

展開

が一般的

オブジェクトの定義

いわゆるハッシュ的なデータの格納はこれです。

展開

が一般的です。

※JavaScriptの場合、オブジェクトの値はリテラルや配列、オブジェクトはもちんのこと。関数が入ります。これがなかなかムズイ・・・
JavaScript基礎文法最速マスター

関数

JavaScriptで何といっても難しいのは関数の扱いでしょう。

まあ定義は上記の通り普通なのですが、JavaScriptの面白いところとして、変数に代入したり、オプジェクトのプロパティとして扱うことができます。

上記のように変数に代入し、関数名がないものを無名関数と呼びます。

スコープ

スコープは関数と関連が深いのでここであつかいます。まずJavaScriptのスコープは宣言した関数内全体になります。

関数の外で定義すれば関数の中からも呼び出せます。逆に中で定義したら外からは呼べません。

即時関数

JavaScriptでは定義と実行を同時に行える記述法があります。
関数の定義と呼び出しは通常

のように書きますが、
↓とかいても同じ結果になります。

定義と同時によんでおり、即実行されます。このような使い方を即時関数といいます。

どんな時に使うかというと本来の関数の定義→即実行というよりはスコープの制限のために使うことが多いです。

単純なサンプルを見てもわからないことが多く、初心者殺しのネタだと思われます。

無名関数、即時関数について
【JavaScript】無名関数と即時関数?関数パターンを理解してメンテナブルなソースに!
[JavaScript] 猿でもわかるクロージャ超入門 3 無名関数

jQuery

JavaSciprtというと一般的にはHTMLやCSSの装飾を動的に行うときに使われることが多いでしょう。

その場合、ほとんどの人がjQueryから使うことになると思います。

jQueryの構文では

みたいな書き方をします。

また$マークにはjQueryのオブジェクトという意味が入っています。詳しくは下記リンクを参照してみましょう。

【jQuery】$(ドルマーク)の意味

-JavaScript

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

プルダウン連動のJS+動的要素のイベント追記(ライブラリのイベント)

JSがらみでちょっとした小ネタを。 Contents1 プルダウン連動2 動的要素へのイベント追加(ライブラリのイベントなど) プルダウン連動 大カテゴリ→小カテゴリなどとあった場合に、新規だけではな …

no image

switch(true)イディオム

switch文は通常、文字や数字で分岐をさせることが多いですが、実は条件式を入れることも可能です。 私の場合、正規表現を動的に変えたいケースがあり、検索したところ似たケースがありました。 【JavaS …

no image

ejsのテンプレート

普段生のHTMLを書く機会はほとんどなく、画面側の仕事でもフレームワークを使うことがほとんどなので搭載されているテンプレートを使っています。 で、生のHTML/CSSの本を読んでいてejsなるテンプレ …

no image

vueのコンポーネント化

vueの記事をポツポツ上げてきましたが、コンポーネント化した書き方に関して。 既存のvueの記事 Vue.jsについて vueの環境構築 今まではCDNで読み込んだり、HTMLの中に直接vueを入れて …

no image

JavaScriptのコールバック関数について

JavaScriptでのコールバック関数について。 たまにでてきますが、これまた慣れないと手間取ります。 コールバック関数に関してまとめると以下のような感じでしょうか。 ある関数(func1)の引数と …