CSS의 전처리기 언어인 SCSS를 사용하는 방법 중 다른 스타일을 가져오는 방법에 대하여 알아봅니다. 바로 @extend를 사용한 스타일 확장 방법입니다.# SCSS의 스타일 확장 알아보기, @extend전처리기 덕분에 CSS 역시 자바스크립트의 객체처럼 다른 스타일을 상속 받는 것처럼 사용하는 것이 가능합니다. 상속과는 다를 수 있으나 스타일을 확장하여 사용할 수 있어 모든 스타일을 정의하지 않아도 다른 스타일을 가져와 사용할 수 있죠. SCSS의 @extend가 바로 그것입니다.@extend <가져올 스타일>문법은 위와 같이 간단하며 가져올 스타일을...
자바스크립트에서 객체(Object) 타입을 복사, 복제(Clone)하는 방법에 대하여 알아봅니다. 어떻게 하면 똑같은 객체를 하나 더 만들 수 있을지 알아봅니다.! 객체 복사, 복제 앞서 반드시 알아둘 사항객체를 복사하기 이 전에 중요한 개념을 이해하는 것이 좋겠죠. 바로 깊은 복사(Deep copy)와 얇은 복사(Shallow copy)입니다.자바스크립트의 객체를 새로운 변수에 선언하게 되면 참조 형태로 값이 존재하게 되는데 이를 얇은 복사, Shallow copy라고 합니다. 여기서 참조를 설명하면... 새롭게 생긴 변수의 값이 변하면 기존의 객체 역시 함께 변하...
자바스크립트에서 객체를 상속하는 방법은 몇 가지 존재합니다. 이 중에서 Object 객체의 create() 함수를 사용한 객체 확장, 상속에 대하여 알아봅니다. create()은 EC5에서 표준화된 객체의 상속 방법입니다.# 자바스크립트 create() 객체상속 예제보기만약 아래와 같은 생성자 함수를 사용하여 객체상속을 만든다고 생각해봅니다.function Mysite(name) { this.name = name;}이때 생성자함수 Myste를 사용하여 상속받기 위하여 create() 함수를 사용해보겠습니다.webisSite = Object.create(Mysite....
제이쿼리의 extend()는 다수의 객체를 하나의 객체로 합치는 merge기능을 수행할 수 있습니다. 만약 두 개 이상의 객체를 하나로 합치려는 경우 extend()를 사용하여 새로운 객체로 만들 수 있죠. 아래는 extend()를 사용하는 간단한 방법 및 문법은 아래와 같습니다.$.extend(대상, 객체1, 객체2, ... , 객체n)그럼 extend()를 사용한 예제를 알아보겠습니다. 예제에서는 objA, objB를 사용하여 새로운 objC를 생성합니다. 새롭게 만들어진 objC가 extend()를 통해 어떤 값을 가졌는지 확인해보세요. # extend...