Search

三項演算子(条件演算子)

unknown

(式1) ? (式2) : (式3)

式1TRUEなら式2FALSEなら式3を実行します。

<script type="text/javascript">
    var a=true;
    /* 三項演算子使用 */
    document.write((a==true) ? "true" : "false"); /* true */

    /* 三項演算子を使用しない場合
    if(a==true){
        document.write("true");
    }else{
        document.write("false");
    }
    */
</script>

2つの式を順番に実行
コンマ演算子

unknown

複数の式を続けて実行したい場合は、式をカンマ区切りで指定します。 指定した式を左から順に実行し、右側の式の結果を返します。このコンマ演算子はfor文のループなどでよく使用します。

<script type="text/javascript">
    var j=0;
    for(var i=0; i<=4; i++, j++){
        document.write((i+j)+","); /* 実行結果: 0,2,4,6,8, */
    }
</script>

オブジェクトを破棄
delete演算子

unknown

delete expression

delete演算子は、「オブジェクトのプロパティ」または「配列の要素」を破棄し、未定義にします。

引数expressionには、プロパティ、配列の要素を指定します。 このexpressionの結果がオブジェクトで、expressionが存在するプロパティであり、更にオブジェクトがそのプロパティの削除を禁止している場合はFALSEを返します。 それ以外の場合にTRUEを返します。

<script type="text/javascript">
    var fruits=new Object();
    fruits["a"]="apple";
    fruits["b"]="banana";
    fruits["g"]="grape";

    for(var key in fruits){
        document.write("<strong>"+key+"<\/strong> is in fruits, with value <strong>"+fruits[key]+"<\/strong><br \/>");
    }
    /* オブジェクト fruits からプロパティ b を削除 */
    delete fruits.b;

    document.write("---プロパティ b 削除後---<br \/>");
    for(var key in fruits){
        document.write("<strong>"+key+"<\/strong> is in fruits, with value <strong>"+fruits[key]+"<\/strong><br \/>");
    }
</script>

ただし、以下の例のようにオブジェクトを破棄しても、配列の要素のスペース自体は確保されるため、配列の長さは変わりません。

<script type="text/javascript">
    var ary=new Array(1,2,3);
    document.write("破棄前:aryの長さ="+ary.length+" ary="+ary+"<br \/>");
    for(i=0; i<ary.length; i++){
        /* 配列の要素を破棄 */
        delete ary[i];
        document.write("ary["+i+"]="+ary[i]+"<br \/>"); /* undefined */
    }
    /* 配列の要素を破棄しても、配列の長さは変わりません */
    document.write("破棄後:aryの長さ="+ary.length+" ary="+ary+"<br \/>");
</script>

in演算子
in演算子

unknown

property in object

オブジェクトに指定したプロパティがあるか調べます。 プロパティがオブジェクトである場合にTRUE、そうでない場合にFALSEを返します。

<script type="text/javascript">
    var fruit = new Array(3);
    fruit['a']='apple';
    fruit['b']='banana';
    fruit['g']='grape';

    for(key in fruit){
        document.write(key+"=>"+fruit[key]+"<br \/>");
    }
</script>

作成された関数のインスタンスを確認
instanceof演算子

unknown

object instanceof class

オブジェクトが、特定のクラスまたは作成した関数のインスタンスかどうかを調べます。

引数objectが引数classまたは作成した関数のインスタンスである場合にTRUEを返します。
引数objectが指定されたクラスのインスタンスでない場合、またはobjectNULLの場合にFALSEを返します。

<script type="text/javascript">
    /* 
    instancsof演算子を使用して
    作成された関数のインスタンスを確認
    */
    function square(x){
       return x*x;
    }
    function bracket(s){
       return("[" + s + "]");
    }
    var f=new square;
    document.write(f instanceof square);  /* true */
    document.write(f instanceof bracket); /* false */
</script>

新しいオブジェクトを作成
new演算子

unknown

new constructor[( [arguments] )]

new演算子は、新しくオブジェクトを作成するのに使用します。 作成したオブジェクトのコンストラクタに対するオブジェクトへの参照をthisポインタで呼び出すことができます。 コンストラクタは渡された引数にしたがって、オブジェクトを初期化します。

第1引数constructorには、オブジェクトのコンストラクタを指定します。第2引数argumentsを省略した場合は、括弧()を省略してもかまいません。 オプションの第2引数argumentsには、新しいオブジェクトのコンストラクタに渡す任意の引数を指定します。

<script type="text/javascript">
    /* 日付オブジェクトの生成 */
    var now=new Date();

    /* 配列オブジェクトの生成 */
    var ary=new Array();
</script>

現在のオブジェクトを返す
thisステートメント

unknown

this.property

引数propertyには、現在のオブジェクトのプロパティの識別子を指定します。 通常、キーワードthisは、現在のオブジェクトを参照するための、コンストラクタとして使用されます。

<script type="text/javascript">
    function person(firstname,lastname,age){
        this.firstname=firstname;
        this.lastname=lastname;
        this.age=age;
    }

    var pj=new person("peach","john",20);
    document.write("type : "+pj.firstname+"<br \/>");
    document.write("type : "+pj.lastname+"<br \/>");
    document.write("type : "+pj.age+"<br \/>");
    </script>

    <hr />

    <script type="text/javascript">
    <!--
    function Image(width,height,src){
        this.type="image object"
        this.width=width;
        this.height=height;
        this.src=src;
    }
    var obj=new Image("/content/img/bg/bg_anq.gif","43","58");
    document.write("type : "+obj.type+"<br \/>");
    document.write("width : "+obj.width+"<br \/>");
    document.write("height : "+obj.height+"<br \/>");
    document.write("src : "+obj.src+"<br \/>");
</script>

式のデータ型を調べる
typeof演算子

unknown

typeof[(]expression[)];

引数expressionに指定した式のデータ型を文字列で返します。 この演算子が返す文字列は、numberstringbooleanobjectfunctiondateundefinedunknownのいずれかです。 構文の括弧()は省略してもかまいません。

<script type="text/javascript">
    var num=100; document.write(typeof num); /* number */

    var str="abc"; document.write(typeof str); /* string */

    var kara=""; document.write(typeof kara); /* string */

    var bool=true; document.write(typeof bool); /* boolean */

    function func(x){ return x*x; } document.write(typeof func); /* function */

    var ary=new Array(1,2,3); document.write(typeof ary); /* object */

    var now=new Date(); document.write(typeof now); /* object */

    var _null=null; document.write(typeof _null); /* object */

    var hoge; document.write(typeof hoge); /* undefined */

    document.write(typeof xxx); /* undefined */
</script>

何も値を返さない命令
void演算子

unknown

void ( expression )

void演算子は、式を評価しundefinedを返します(つまり値を返しません)。 式の評価が必要で、スクリプトをノ残り部分でその結果が参照される必要がない場合に有用です。

このvoid演算子は、a要素にhref属性とonClickイベントを同時に指定した時にhref属性を無効にするためによく使用します。

リンクを無効(何もしない)にする時、「href="#"」と指定してもかまいませんが、クリックすると画面がページの先頭に移動してしまいます。 しかし、href="javascript:void(0);"を指定することでクリックしても画面が動かなくなります

<a href="#">クリックすると画面がページの先頭に移動してしまいます</a><br>
<a href="javascript:void(0);">クリックしても画面が動きません</a>

関連コンテンツ

Q. このサイトの情報はお役に立ちましたでしょうか?

投票する 投票結果を見る

管理人に【web拍手】を送るweb拍手(1行メッセージも送れます♪)

pagetop

polarized women