본문 바로가기

Front-End

[ES6] Class ECMAScript 2015의 ClassES6는 변수에 대한 규칙이 엄격해지고 클래스와 모듈 같은 복잡한 응용 프로그램을 작성하기 위한 새로운 문법이 추가되었다. 특히 명시적인 클래스의 추가로 더욱 더 편리해졌다. 기본의 자바스크립트(ES5)에는 클래스가 없어서, 생성자 함수와 프로토타입으로 클래스의 개념을 구현했지만, ES6에서는 클래스를 선언할 수 있다. ES5와 ES6의 코드를 비교해보자. ES512345678910111213141516//생성자 함수function Character(name, job) { this.name = name; this.job = job;} //프로토타입으로 메소드 생성Character.prototype.move = function() { document.write(thi.. 더보기
[JavaScript] this https://jess2.xyz/JavaScript/this/ 로 이동되었습니다. 더보기
[JavaScript] Ajax 와 XML / JSON https://jess2.xyz/JavaScript/ajax-xml-json/ 로 이동되었습니다. 더보기
[JavaScript] bind 메소드 https://jess2.xyz/JavaScript/bind/ 로 이동되었습니다 더보기
[JavaScript] 함수의 호출 방법 - call / apply https://jess2.xyz/JavaScript/call-apply/ 로 이동되었습니다 더보기
[JavaScript] 프로토타입(Prototype) https://jess2.xyz/JavaScript/prototype/ 로 이동되었습니다 더보기
[JavaScript] 클로저(Closure) https://jess2.xyz/JavaScript/closure/ 로 이동되었습니다 더보기
[CSS] display 속성(none / block / inline / inline-block) display 속성 종류1. none2. block3. inline4. inline-block1. display : nonedisplay 속성을 none으로 설정하면, 태그 자체가 보이지 않게 된다. visibility 속성을 hidden 으로 설정한 것과는 달리, 영역 자체를 차지하지 않는다.2. blockwidth는 기본적으로 화면의 100% 전부를 차지하며, width와 height 속성을 지정할 수 있다.ex) , 3. inlineblock 태그와 달리 width는 기본적으로 화면의 100% 전부를 차지하지 않으며, width와 height 속성을 지정할 수 없다.ex) 4. inline-blockblock과 inline의 중간 형태이다. width는 기본적으로 화면의 100% 전부를 차지하지 않.. 더보기
[CSS] Position(static / relative / absolute / fixed / sticky) Position 종류1. static2. relative3. absolute4. fixed5. sticky Position 속성은 도큐먼트(document) 에 요소를 배치하는 방법을 지정하고, top, right, bottom, left 속성들은 요소가 최종적으로 배치될 위치를 지정한다.1. staticstatic은 position 속성 기본값으로, document의 일반적인 흐름을 따라 배치된다. top, bottom, left, right, z-index 속성들은 static에서 아무런 효과를 주지 못한다.2. relativerelative은 상대적인 위치를 계산한다. top과 bottom 속성은 기본 위치로부터 수직 방향으로 얼만큼 떨어진 곳에 위치할 것인가를 설정하고, left와 right 속성.. 더보기
[ES6] ECMAScript 2015 주요 기능 ECMAScript 2015 (ECMAScript 6, ES6)ES6는 2015년에 공식적으로 업데이트 된 ECMAScript 언어의 여섯 번째 버전이다. ES6에는 클래스, 모듈, 새로운 키워드 등을 비롯해 새로운 기능이 많이 추가되었다. 최근 react.js나 node.js 프로젝트들에서는 대부분 ES6가 사용되고 있다. 그렇다면 ES6의 주요 기능에 대해 알아보자.1. let / constES6에서는 변수를 선언하는 새로운 키워드로, let과 const가 추가되었다. 기존에는 var 키워드를 사용했었는데, var 키워드는 재선언과 재할당이 모두 가능했지만, let 키워드는 재할당만 가능하며, 재선언은 불가능하다. 그리고 const는 재할당과 재선언이 모두 불가능하다. 또한, var는 선언이 hois.. 더보기