jam 블로그

const, let javscript ES6 버전에서는 변수 선언시 이전 버전의 var 말고도 const, let 키워드가 추가되었습니다. let 블록 스코프 변수로써 자신을 정의한 블록에서만 접근 가능하며 블록 밖에서는 볼 수 없습니다. function letTest() { let x = 10; console.log(x); //10 if(true) { let y= 20; console.log(y); //20 } console.log(y); //Reference Error Exception } const 읽기 전용 변수, 즉 값을 다시 할당할 수 없는 상수를 선언 const도 블록 스코프 변수라 let으로 선언한 변수와 규칙은 동일 다만, 객체 자신이 아닌 참조값이 저장하므로 객체 내부는 변경 가능 fu..

destructuring assignment (해체 할당) 이터러블이나 객체의 값/프로퍼티를 각각 배열이나 객체 생성자 리터럴과 비슷한 구문으로 변수에 할당하는 표현식 // es5 var arr = [1, 2, 3]; var a = arr[0]; // 1 var b = arr[1]; // 2 var c = arr[2]; // 3 // es6 const arr = [1, 2, 3]; let a, b, c; [a, b, c] = arr; // [1, 2, 3] let [d, , e] = arr;console.logbconsole.logb console.log(d); // 1 console.log(e); // 3 let [f, ...g] = arr; console.log(a); // 1 console.log(..

function parameter 기본값 es6에서 es5와 다르게 함수에서 파라미터 값에 기본값을 설정할 수 있습니다. //es5 function myFunc(x, y, z) { x = x === undefined ? 1 : x; y = y === undefined ? 2 : y; z = z === undefined ? 3 : z; } myFunc() // 1, 2, 3 //es6 function myFunc(x = 1, y = 2, z = 3) { console.log(x, y, z); } myFunc(x,4,z); // 1, 4, 3 펼침 연산자 (spread operator) 이터러블(iterable) 객체를 개별 값으로 나누는 펼침 연산자(spread operator) ... 로 표기합니다. /..

CORS (Cross Domain) 서버와의 통신을 위해 ajax나 XMLHttpRequest를 사용하다보면 CORS 에러가 나오는 경우가 종종 발생합니다. 할때마다 설정 방법이나 우회 방법을 항상 찾다보니 매번 고생하는거 같아 정리해봅니다. CORS 란? CORS는 Cross-Origin Resource Sharing의 약자로 보안상의 이유로, 브라우저들은 스크립트 내에서 초기화되는 cross-origin HTTP 요청을 제한합니다. 예를 들면 다음과 같습니다. # 사이트 도메인이 www.a.com 일 경우 const xhr = new XMLHttpRequest(); xhr.onreadystatechange = () => { if (xhr.readyState === xhr.DONE) { if (xhr...

Element의 Center를 찾기 화면 레이아웃을 만들고 스타일 잡다보면 vertical, horizontal center 만드는게 여간 까다로운게 아닙니다. 한번 정리를 해봅니다. horizontal center는 간단한 부분이 많지만 vertical center가 까다롭고 parent element의 영향이 많습니다. Horizontal Center Text를 horizontal center 하는 것 Text는 horizontal center는 간단합니다. text-align을 사용하면 되는데 text를 둘러싸고 있는 element가 block인지 inline 속성인지에 따라 text-align을 하는 부분이 달라집니다. Text를 둘러 싸고 있는 tag가 inline 속성이라면? text 위와 같..