딩코딩 : Computer Science 블로그

리터럴 객체 선언

let func = (item1, item2) => item1 + item2;
console.log(func(1,2));

const emptyObject = {};

emptyObject.name = "LEee";
console.log(emptyObject.name);

const user = {
    age:20,
    name:"디디에 드록바",
    get_data: () => (1+2),
};
console.log(typeof user, user);
console.log(user.age);
console.log(user.name);
console.log(user.get_data());


const Lee = {
    age: 25,
    name : "Lee",
    details:{
        hobby: "coding",
        major: "software",
        get_detalis:function(item){
            return this.major;
        }
    },

    get get_age(){
        return this.age;
    },

    set set_age(value){
        this.age = value;
    }
}

console.log(typeof Lee, Lee);
console.log(Lee.age);
console.log(Lee.details.hobby);
console.log(Lee.details.get_detalis(4));

console.log(Lee.get_age);
Lee.set_age = 24;
console.log(Lee.get_age);

const a = new Object();

a.age = 10;
a.name = "Daa";
console.log(a.age, a.name);


function User(age, name){
    this.age = age;
    this.name = name;
}

const Kim = new User(3,"Kim");
console.log(typeof Kim);
console.log(Kim.age, Kim.name);

User.prototype.message = function(){
    return "hellow";
}

console.log(Kim.message());

클래스 객체 선언

class Animal{
    constructor(name, age){
        this.name = name;
        this.age = age;
    }
}

class Dog extends Animal{
    constructor(name, age){
        super(name,age);
        
    }
    
    bark = function(){
        return "war war!";
    };
}


const shunider = new Dog("bbo", 12);
console.log(shunider.name);
console.log(shunider.age);
console.log(shunider.bark());

bbo
abc.js:23 12
abc.js:24 war war!

prototype과 hasOwnProperty

class Animal{
    constructor(name){
        this.name = name;
    }

    get_message(){
        return "Hello";
    }

}


Animal.prototype.age = 10;

const dog = new Animal("dog");
console.log(dog.hasOwnProperty('name')); //true
console.log(dog.hasOwnProperty('age')); //false

https://flexboxfroggy.com/#ko

css flex를 응용해서 공부해보기 좋은 사이트입니다.

하단에 24번 답있습니다.

css를 입력해서

개구리를 원하는 방법으로 배치하는 게임입니다.

24번 답

flex-direction:column-reverse;
flex-wrap:wrap-reverse;
align-content:space-between;
justify-content:center;

<input type="checkbox" name="" id="modal-switch">
    <label for="modal-switch">
        <span>
            modal 열고 닫기
        </span>
   	</label>

html에서 체크박스에 포함된 글자를 눌러도

체크박스가 선택되도록 하려면

체크박스에 id를 지정해주고

<label for="체크박스 id">

label의 for에다 적어주면 된다.