분류 전체보기159 [JavaScript] 객체를 복사하는 방법 객체 = 객체 형식은 객체가 참조관계를 갖기 때문에, 어느 한 객체를 변경하면 같이 바뀌면 같이 바뀌게 된다. 그렇다면, 객체를 복사하는 방법은 아래 코드와 같다. 객체의 참조를 확인하는 방법 객체의 참조관계를 쉽게 확인하기 위해서는 '===' 비교 연산자를 통해 확인할 수 있다. 객체 === 객체의 결과가 true라면 참조관계이다. 객체를 복사하는 방법 var obj = { a:1, b:2, c:3 } Object.keys(obj); var obj2 = {}; Object.keys(obj).forEach(function(key){ obj2[key] = obj[key] }) 먼저 객체를 생성하고, Object.keys(obj); 를 통해 객체의 key들을 뽑아내서 배열을 만든후에, forEach 반복문을.. 2020. 9. 8. [JavaScript] 참조와 복사 복사 자바스크립트에서는 원시 데이터형을 제외한 모든 데이터 타입은 객체이다. 객체를 다른 말로는 참조 데이터 형(참조 자료형)이라고도 부른다. 자바스크립트는 원시값(숫자, 문자, boolean)에선 값이 복사가 되고, 객체일 때는 다르게 동작한다. 위 사진처럼 값을 복사하고 싶으면 변수를 지정하여 바꿔준다. 위 사진에는 값을 false로, 복사 = 값을 통해 value를 복사해준 후, 복사의 false값을 true로 바꿨다. 그 결과 복사는 true라는 value를 갖고, 값은 false라는 value를 갖는 형태를 볼 수 있다. 이 것을 통해 알 수 있는 것은 원시값을 복사하면 변수에 따로따로 동작하는 것을 알 수 있다. 참조 하지만, 객체일 때는 다르게 동작한다. 여기서 객체란 객체, 배열, 함수를 .. 2020. 9. 7. [JavaScript] classList 코딩을 할 때 효과적인 방식은 html은 html파일에만 쓰고 css로 처리할 수 있는 것은 css로 처리하고 JavaScript는 최소한의 로직만 처리하게끔 분리하는것이다. 반응속도.html html에 이렇게 style을 여러개의 class형태로 여러 속성을 적용을 해놓았다. 반응속도.js var 스크린 = document.querySelector('#screen'); var 상태 = { }; 스크린.addEventListener('click', function(){ if(스크린.classList.contains('waiting')){ // classList.contains: 현재클래스를 파악가능하다 스크린.classList.remove('waiting'); // class는 여러 스타일을 한번에 적용.. 2020. 9. 4. [JavaScript] 렉시컬 스코프, 클로저 렉시컬 스코프 자바스크립트에서는 코드가 적힌 순간 변수의 유효범위가 정해진다다. 이것을 정적 유효범위, 렉시컬(어휘적) 스코프라고 부릅니다. function main(){ var name = 'skykchmin'; } var로 선언한 name변수의 유효범위는 함수를 절대로 벗어날 수 없다. 즉 함수안에서 선언한 변수는 함수 밖에서 접근할 수 없다. var name = 'kchmin'; function log(){ console.log(name); } function main(){ var name = 'skykchmin'; log(); } main(); 위 예의 실행 결과는 skykchmin 이다. main() 메서드가 실행하면서, variable name이 있는지 찾아보고, 없으면 전체에서 찾아본다. 이.. 2020. 9. 3. 이전 1 ··· 32 33 34 35 36 37 38 ··· 40 다음