여러가지 객체 사용법
* 아래 내용은 공부용으로 찾아보고 만든 코드이니.. 참고만 하시길 바랍니다. |
객체사용 (1)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | var _company = new Object(); //var _company = {} 동일 _company.CompanyName = 'myCompany'; _company.Owner = 'me'; _company.ConsoleCompanyName = ConsoleCompany(); function ConsoleCompany(){ console.log('ConsoleCompany 호출'); console.log(this.CompanyName ); // 현재 전역 window에 CompanyName를 가르킴 } console.log(_company.CompanyName); _company.AlertCompanyName(); ===== 실행 결과값 ConsoleCompany 호출 undefined myCompany ===== | cs |
_company.AlertCompanyName(); 호출이 되지 않는다.
아래처럼 ConsoleCompany.call(_company); 해서 ConsoleComapny 함수가 _company를 가르키도록 ..
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | var _company = new Object(); //var _company = {} 동일 _company.CompanyName = 'myCompany'; _company.Owner = 'me'; _company.ConsoleCompanyName = ConsoleCompany(); function ConsoleCompany(){ console.log('ConsoleCompany 호출'); console.log(this.CompanyName ); // 현재 전역 window에 CompanyName를 가르킴 } console.log(_company.CompanyName); //ConsoleCompany 이 전역을 가르키지 않고 _company를 가르키도록 ConsoleCompany.call(_company); _company.AlertCompanyName(); ===== 실행 결과값 ConsoleCompany 호출 undefined myCompany ConsoleCompany 호출 myCompany ===== | cs |
객체 사용(2)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | var _company = new Object(); //var _company = {} 동일 _company.CompanyName = 'myCompany'; _company.Owner = 'me'; _company.AlertCompanyName = function(){ console.log(this.CompanyName ); } var _company1 = { companyName : 'myCompany1', owner : 'me1', alertCompanyName : function(){ console.log(this.companyName) } } console.log(_company.CompanyName); _company.AlertCompanyName(); console.log(_company1.companyName); _company1.alertCompanyName(); ===== 실행 결과값 myCompany myCompany myCompany1 myCompany1 ===== | cs |
객체사용(3)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | var _monster = { monsterName : 'fire monster', property : 'fire', whoAreYou : function(){ console.log(this.monsterName); }, weapon : { weaponName : 'namu', weaponWeight : 100 }, gear : [{ gearName : '천옷', cost : 500 }, { gearName : '가죽', cost : 1000 }] } _monster.whoAreYou(); console.log(_monster.weapon.weaponName) console.log(_monster.gear[1].gearName + ' ' + _monster.gear[1].cost); ===== 실행 결과값 fire monster namu 가죽 1000 ===== | cs |
객체사용 (4)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | function MyCompany(){ this.CompanyName = 'MyCompany'; this.AlertCompanyName = function(){ console.log(this.CompanyName); } } MyCompany.prototype.Owner = 'owner'; MyCompany.prototype.AlertOwner = function(){ console.log(this.Owner); } var _company = new MyCompany(); console.log(_company.CompanyName); _company.AlertCompanyName(); _company.AlertOwner(); console.log('====='); function MyCompany1(){ this.CompanyName = 'MyCompany1'; this.AlertCompanyName = function(){ console.log(this.CompanyName); } } // new 키워드는 비어있는 object 를 만들고, class 생성하고자 하는 함수 이름의 // [function name].call 메서드를 통해서 해당 function을 생성자로 빈 ojbect 를 채워줌 var _company1 = new Object(); MyCompany1.call(_company1); console.log(_company1.CompanyName); _company1.AlertCompanyName(); _company1.AlertOwner(); ===== MyCompany MyCompany owner ---------- MyCompany1 MyCompany1 ===== | cs |
'dev > JavaScript' 카테고리의 다른 글
[jsTree] jsTree plugin 알아보기 (0) | 2021.03.04 |
---|---|
[jsTree] jsTree 사용해보기 (0) | 2021.03.03 |
jQuery Code Assist (jQuery 코드 자동완성) (0) | 2017.05.06 |
여러가지 객체사용법 2 (0) | 2017.04.27 |
JavaScript 객체 (0) | 2017.04.25 |