Xiaoqiang의 HTML5 모바일 개발 로드(27) - JavaScript 검토 2-HTML 튜토리얼-php.cn

집

웹 프론트엔드

HTML 튜토리얼

Xiaoqiang의 HTML5 모바일 개발 로드(27) - JavaScript 검토 2

黄舟

Feb 04, 2017 pm 02:16 PM

JavaScript 객체지향 기본 지식

1. 클래스를 정의하고 다음 구문을 사용하여 클래스를 만드는 방법

 function Person(name, age){ //习惯上第一个字母大写  
    //this修饰的变量称为属性  
    this.name = name;  
    this.age = age;  
    //如果属性值是一个函数，则这个属性就是一个方法  
    this.play = function(){  
        alert(&#39;play football...&#39;);  
    };  
}

로그인 후 복사

2. 이 클래스의 인스턴스를 만드는 방법

var p = new Person(&#39;zs&#39;, 22);  
p.play();  
p.name;

로그인 후 복사

3. 자바스크립트 객체를 생성하는 다른 두 가지 방법

(1) 먼저 객체 유형의 인스턴스를 생성한 다음 새 속성과 메서드를 추가합니다

javascript는 런타임에 객체에 새로운 속성과 메소드를 추가할 수 있는 동적 언어입니다.

var obj = new Object();  
obj.name = &#39;zs&#39;;  
obj.age = 22;  
obj.play = function(){  
    alert(&#39;play...&#39;);  
};

로그인 후 복사

(2) "json" 구문

  var p = {&#39;name&#39;:&#39;zs&#39;,&#39;age&#39;:22};  
ar p = {&#39;name&#39;:&#39;zs&#39;,&#39;play&#39;:function(){  
alert(&#39;hello&#39;);  
};

로그인 후 복사

또는

var p = {name:&#39;zs&#39;,age:22,marrid:false};  
var p = {name:&#39;zs&#39;,play:function(){  
    alert(&#39;hello&#39;);  
}};

로그인 후 복사

<🎜를 사용하세요. > 속성값 문자열인 경우 반드시 따옴표(단수, 이중)로 묶어야 합니다

속성값은 number, string, boolean, null, Object를 허용합니다

var p = {name:&#39;zs&#39;,  
    address:{  
        city:&#39;beijing&#39;,  
        street:&#39;ca&#39;  
    }  
};

로그인 후 복사

전체 예시

<html>  
    <head>  
        <script>  
            function f1(){  
                //var p = {&#39;name&#39;:&#39;zs&#39;,&#39;age&#39;:22};  
                //var p = {name:&#39;zs&#39;,age:22,marrid:false};  
                var p = {name:&#39;zs&#39;,  
                    address:{  
                        city:&#39;beijing&#39;,  
                        street:&#39;ca&#39;  
                    }  
                };  
                //alert(p.name);  
                alert(p.address.city);  
            }  
            function f2(){  
                var arr = [  
                    {&#39;name&#39;:&#39;zs&#39;,&#39;age&#39;:22},  
                    {&#39;name&#39;:&#39;ls&#39;,&#39;age&#39;:32}  
                ];  
                alert(arr[1].name);  
            }  
        </script>  
    </head>  
    <body>  
        <input type="button" value="click me" onclick="f2();"/>  
    </body>  
</html>

로그인 후 복사

위는 Xiaoqiang의 HTML5 모바일 개발 로드(27) - JavaScript 리뷰 내용입니다. 2. 더 많은 관련 내용은 PHP 중국어를 참고해주세요. 홈페이지(www.php.cn)!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.