본문 바로가기
매일코딩/자바스크립트예제

자바스크립트 객체 예제

by 인생여희 2018. 10. 15.
반응형

//방법1.

function Car(name,color){

this.name = name;

this.color = color;

this.show = function(){console.log(name, color)}

}


var car1 = new Car('morning','blue');

car1.show();



//방법2. 프로토타입 이용


function BigCar(name, color){

this.name = name;

this.color = color;

}


BigCar.prototype.show = function(){

console.log('bigcar' ,this.name , this.color)

}

//자식 객체 1

var bigcar1 = new BigCar('churare','white');

bigcar1.show();

//자식 객체 2

var bigcar2 = new BigCar('dump','black');

bigcar2.show();



//방법3. 객체리터럴(싱글톤)

var smallcar = {

name: "tico",

color: "blue",

show: function(){

console.log('smallcar',this.name,this.color);

}

}

//할당

smallcar.name = "morning2";

smallcar.color = "gold";

smallcar.show();



//*******************************************************js getter setter 1************************************************

var person = {

    firstName: 'Jimmy',

    lastName: 'Smith',

    get fullName() {

        return this.firstName + ' ' + this.lastName;

    },

    set fullName (name) {

        var words = name.toString().split(' ');

        this.firstName = words[0] || '';

        this.lastName = words[1] || '';

    }

}


person.fullName = 'Jack Franklin';

console.log(person.firstName); // Jack

console.log(person.lastName) // Franklin



//*******************************************************js getter setter 2****************************************************

var person2 = {

    firstName: 'kang',

    lastName: 'youngkyuen'

};


Object.defineProperty(person2, 'fullName', {

    get: function() {

        return this.firstName + ' ' + this.lastName;

    },

    set: function(name) {

        var words = name.split(' ');

        this.firstName = words[0] || '';

        this.lastName = words[1] || '';

    }

});

console.log(person2.fullName) 



//********************************************************************************************




//------------------------------------------

function Student(name, age) {

    this.name = name;

     

    this.getName = function() {

        return this.name;

    }

    this.setName = function(name) {

        this.name = name;

    }

}

var preamtree = new Student(name);



//------------------------------------------

function Student(name, age) {

    this.name = name;

}

Student.prototype.getName = function() {

    return this.name;

}

 

Student.prototype.setName = function(name) {

    this.name = name;

}

var preamtree = new Student(name);


//---------------------------------------------------------------------------

//prototype에 프로퍼티를 추가하는 함수

Function.prototype.method = function(name, func) {

    if(!this.prototype[name]) {

        this.prototype[name] = func;

    }

}

 

function Person(name, age) {

    this.name = name;

}

 

// prototype에 프로퍼티를 추가할 때마다 '.prototype'을 반복할 필요가 없음.

Person.method('getName',  function() {

    return this.name;

});

 

Person.method('setName', function(name) {

    this.name = name;

});



//********************************* 상속 *********************************


//부모 클래스

function Car(name,color){

this.name = name;

this.color = color;

this.show = function(){

return this.name + ' ' + this.color;

}


}



function create(o) {

    function F() {}; //빈 자식 클래스

    F.prototype = o;

    return new F(); // o를 부모로하는 객체 리턴

}


var myPcar = new Car('pCar','BLACK');

var sunCar = create(myPcar);

var text = sunCar.show();

console.log(text);



반응형

댓글