シェアする

  • このエントリーをはてなブックマークに追加

Javascript入門 サンプルプログラム集

スポンサーリンク
ビッグバナー(上2)

このページでは、入門者向けにJavascriptの基本文法やサンプルプログラムを解説しています。

Javascriptとは

JavaScriptとは、プログラミング言語の1つです。
主にウェブブラウザに実装され、動的なWebページの作成や高ユーザインタフェースの作成によく利用されています。

Javascriptの基本文法

Javascriptの基本文法使い方を項目別に以下にまとめました。

はじめに

作成方法:プログラムの作成, 理想的なプログラム
記述場所:headerタグ内, bodyタグ内, inputタグ内, リンク, 外部ファイル
実行:ページ読み込み時に実行
基本:コメント文, アラート画面, アラート画面で改行, alertでエラー特定

変数・配列

概説:変数・定数とは
変数:変数, 数値, 文字列
定数:定数

配列:配列とは, 配列の宣言・初期化・代入, 配列(数値), 配列(文字列)
多次元配列:2次元配列
連想配列:連想配列, 初期化(for文)
配列操作:配列の長さ(要素数), 配列の判定, 文字列に変換①, 文字列に変換②, 配列のpop操作, 配列のpush操作, 順序反転, 先頭要素削除, 先頭要素追加
ソート:文字列ソート, 数値ソート
抽出:指定範囲の要素抽出

四則演算/演算子

四則演算:足し算, 引き算, 掛け算, 割り算, 余り
演算子:算術, 比較, 複合代入, 増分減分, 論理, 条件

文字列処理

基本:エスケープ文字\, 文字列連結, 文字列分割, 文字列→数値, 数値→文字列
文字装飾:文字色, 文字サイズ, 文字大, 文字小, 太文字, 等倍フォント, 斜体, 上付き文字, 下付き文字, 取り消し線, リンク追加
文字抽出:1文字, 任意の文字数, 範囲指定, 文字数取得

構造化プログラミング

概説:構造化プログラミングとは
選択構造:if文, else if文, switch文, switch + break文
反復構造:for文, while文, do while文

関数

関数:関数とは, ローカル変数, グローバル変数
ユーザ関数:ユーザ関数とは, ユーザ関数の引数, ユーザ関数の戻り値
ライブラリ:ライブラリ関数

ウィンドウ操作

確認画面の表示:confirm
入力画面の表示:prompt
指定したURLに飛ぶ:location.href
ページを更新:location.relord
1つ前のページに戻る:history.back
1つ先のページに進む:history.forward
URLを別のウィンドウに表示①:window.open
URLを別のウィンドウに表示②:サイズ位置を指定
URLを別のウィンドウに表示③:各種バーの表示設定
URLを別のウィンドウに表示④:画面中央に表示

オブジェクト指向

オブジェクト指向とは
オブジェクト指向の利点欠点
クラスインスタンスとは:クラス(設計図)、インスタンス(実体完成品)
メソッドプロパティとは:メソッド(操作)、プロパティ(属性)
クラスインスタンス変数とは:クラス全体、インスタンス内のみ
クラスの定義:var Kanmusu = function(){ }
インスタンスの生成:var instance = new MyClass()

【インスタンス変数】
インスタンス変数の生成:this.x = x
インスタンス変数の値を取得:x = instance.x
インスタンス変数の代入アクセス:instance.x = 10;
インスタンス変数の追加:instance.y = 20;
インスタンス生成時に値を渡す(初期化):var instance = new MyClass(10, 20)

【メソッド】
メソッド定義
メソッド定義(プロトタイプ)

【まとめ】
JavaScriptでオブジェクト指向プログラミング

DOM操作

【出力フォーム】
HTMLの出力:document.write
HTMLに文字を挿入:document.textContent
HTMLに文章とタグを挿入:document.innerHTML
HTMLにスクリプトを挿入して実行
【入力フォーム】
テキスト入力フォーム
選択メニュー①:値を取得
選択メニュー②:JS側で選択項目の値をセット

サンプル

和暦→西暦, 西暦→和暦, 西暦⇔和暦

スマホアプリの開発

CordovaでAndroid向けハイブリッドアプリ開発
MonocaクラウドでAndroid向けハイブリッドアプリ開発(準備中)
Visual StudioでAndroid向けハイブリッドアプリ開発(準備中)

応用例

Javascriptで数値計算処理
Javascriptでゲームプログラミング
CSVファイルの読み込み

外部サイト

LiveWeave
GitHub
Javascript入門
Javascript入門 ajaxtower
JavaScritpで数値計算
愚作の箱

他言語の入門記事

Python入門
C言語入門
Java入門
C#入門
Javascript入門
PHP入門
VBAマクロ入門
Processing入門

スポンサーリンク
レクタングル(下2)
レクタングル(下2)