JavaScriptカスタムオブジェクトメソッドの概要

<スクリプト>
        // オブジェクトを作成する var stu = new Object()
        // オブジェクトに属性 stu.name='jibu' を追加します
        stu[9527] = 'jibu' // 特殊な属性名は括弧を使用する // オブジェクトにメソッドを追加する stu.study = function(){
            console.log('学習')
        }
        // オブジェクトのプロパティとメソッドを呼び出す console.log(stu.name,stu['name'])
        //メソッド stu.study() を呼び出す
    </スクリプト>

<スクリプト>
        // 1. オブジェクトを作成するためのコンストラクタを定義する function Student() {
            // オブジェクトプロパティ this.name = 'jibu'
            年齢 = 18
                //オブジェクトメソッド this.study = function() {
                console.log('学習中...')
            }
        }
        // 2. コンストラクターを呼び出してオブジェクトを作成します var stu = new Student()
        console.log(stu.name)
        勉強()

        // パラメータ付きのコンストラクタを定義する // オブジェクトを作成するためのコンストラクタを定義する function Student(name, age) {
            // オブジェクトプロパティ this.name = name
            this.age = 年齢
                //オブジェクトメソッド this.study = function() {
                console.log('学習中...')
            }
        }
        //コンストラクタを呼び出してオブジェクトを作成します var stu = new Student('tom', 18)
        console.log(stu.name)
        勉強()
    </スクリプト>

var stu = {
            名前: 'jibu',
            年齢: 100,
            「特殊変数」: 1111
            研究: 関数() {
                console.log('学習中')
            },
            表示: 関数() {
                console.log('私の名前は' + this.name, '年齢:' + this.age)
            }
        }
        console.log(stu.name)
        console.log(stu['特殊変数']

<スクリプト>
        // 関数内の this は関数の呼び出し元を参照します var a = 1

        関数f1() {
            変数a = 2
            console.log(これ)
                // ローカル変数とグローバル変数が同じ名前を持つ問題を解決する console.log('local variable: ', a)
            console.log('グローバル変数: ', window.a)
            console.log('グローバル変数: ', this.a)

        }
        f1()
    </スクリプト>

 <スクリプト>
        window.onload = 関数() {
            document.querySelector('#btn').onclick = 関数() {
                console.log(this) //ここで、これはイベントをトリガーするイベント ソースのターゲット要素を表します}
        }
    </スクリプト>
</head>

<本文>
    <button id="btn">ボタン</button>
</本文>

<スクリプト>
        関数 学生(名前, 年齢) {
            // コンストラクタ内の this は、将来新しく作成される現在のオブジェクトを表します。this.name = name
            this.age = 年齢
        }
    </スクリプト>

文字列、数値、ブール値、未定義、null

<スクリプト>
        変数a = 5
        var b = a
        8 です
        コンソールログ(a)
        コンソールログ(b)
    </スクリプト>

オブジェクト、配列、学生…

<スクリプト>
        var stu1 = {
            名前: 'トム',
            年齢: 18
        }
        var stu2 = stu1; // stu1のアドレスをstu2に割り当てる
        stu1.name = 'アリス'
        コンソールログ(stu1.name)
        コンソールログ(stu2.name)
    </スクリプト>

   <スクリプト>
        関数add(){
            (var i = 1; i <= 5; i++) の場合 {
                var li = document.createElement('li')
                li.innerText = 'li' + i
                li.onclick = 関数() {
                    console.log('クリック' + i + 'li')
                }
                document.getElementById('myul').appendChild(li)
            }
        }
    </スクリプト>
    <スタイル>
        ul {
            幅: 300ピクセル;
            高さ: 300px;
            境界線: 1px 実線 #ccc;
        }
    </スタイル>
</head>

<本文>
    <button onclick="add()">要素を追加</button>
    <ul id="myul">

    </ul>
</本文>

<スクリプト>
        関数add(){
            (var i = 1; i <= 5; i++) の場合 {
                var li = createLi(i)
                document.getElementById('myul').appendChild(li)
            }
        }

        関数createLi(num) {
            var li = document.createElement('li')
            li.innerText = 'li' + 数値
            li.onclick = 関数() {
                console.log('クリック' + num + 'li')
            }
            戻る
        }

<スクリプト>
        関数add(){
            (var i = 1; i <= 5; i++) の場合 {
                var li = document.createElement('li')
                li.innerText = 'li' + i
                li.num = i; //データを保存 li.onclick = function() {
                    console.log('クリック' + this.num + 'li')
                }
                document.getElementById('myul').appendChild(li)
            }
        }
    </スクリプト>

<スクリプト>
        関数add(){
            (i = 1; i <= 5; i++ とします) {
                var li = document.createElement('li')
                li.innerText = 'li' + i
                li.onclick = 関数() {
                    console.log('クリック' + i + 'li')
                }
                document.getElementById('myul').appendChild(li)
            }
        }
    </スクリプト>

<スクリプト>
        //複合属性値はJSONオブジェクトです var user = {
            "名前"： {
                "firstName": "ji",
                "姓": "bu"
            },
            「年齢」: 100
        }
        console.log(ユーザー名.firstName)
    </スクリプト>

<スクリプト>
        //複合属性値はJSONオブジェクトです var user = [{
                    "id": 1,
                    "firstName": "ji",
                    "姓": "bu"
                }, {
                    "id": 1,
                    "firstName": "ji",
                    "姓": "bu"
                }, {
                    "id": 1,
                    "firstName": "ji",
                    "姓": "bu"
                },

            ]
            //ループ for (var i = 0; i < user.length; i++) {
            コンソールログ(ユーザー[i])
        }
    </スクリプト>

 <スクリプト>
        //JSonオブジェクトを文字列に変換する var stu = {
            "id": 1,
            「名前」：「治部」
        }
        console.log(typeof stu)
        var str = JSON.stringify(stu);
        console.log(文字列型)


        // 文字列をJSONに変換する
        var str = '{"id": 1,"name": "jibu"}'
        console.log(文字列型)

        var obj = JSON.parse(str)
        console.log(obj 型)
    </スクリプト>