허도경, limewhale

자바스크립트에서의 실행 컨텍스트는 굉장히 중요한 개념입니다. 실행컨텍스트를 이해하게 되면 Javascript의 동작 원리를 이해할 수 있게 됩니다. 자바스크립트의 동작원리를 이해하게 되면 코드가 에러를 발생하게 되더라도 좀 더 쉽게 예측이 가능해지게 됩니다. 이는 코드를 작성하거나 수정할 때 굉장한 차이점을 가지게 됩니다. 해당 내용이 조금은 어렵게 느껴질 수 있고 광범위하게 느껴질 수도 있지만 천천히 글을 따라서 읽다 보면 충분히 이해할 수 있도록 정리해보겠습니다. 📖 실행 컨텍스트란? 실행 컨텍스트란 코드가 실행되기 위해 필요한 환경 정보들을 모아 놓은 객체입니다. 실행 컨택스트의 동작은, 동일한 환경에 있는 코드들을 실행할 때 필요한 환경정보를 모아 컨텍스트를 구성하고, 이를 콜 스택에 쌓아놓은 뒤..

우리는 데이터의 값을 출력할 때 최초의 값에서 값이 추가되거나 삭제, 수정이 발생하는 경우가 생기게 됩니다. 이럴 경우 원본 데이터의 값에 바로 접근하여 사용하는 방법도 있지만 이와 같은 방법은 추후에 원본 데이터가 변경되었기 때문에 다양한 오류를 발생시킬 가능성이 있습니다. 그래서 효과적인 방법은 원본 데이터의 값을 복사하여 가공하거나 수정하는 방법을 사용하는 것이 좋습니다. 이런 경우에 사용하는 것이 바로 얕은 복사(shallow copy)와 깊은 복사(deep copy) 입니다. 자바스크립트에서 원시 타입(primitive type)의 값은 새로운 메모리 공간에 독립적인 값을 저장하기 때문에 깊은 복사가 되고 참조 타입(reference type)값은 얕은 복사가 됩니다. 잠깐..... 아직 얕은 ..

Math 객체 와 Date 객체를 알아보았습니다. 이번에는 String 객체를 알아볼께요. 글자를 자르거나 필요한 글자를 탐색, 원하는 글자만 가져오거나 문자열의 결합등 (이 놀라운 모든 구성이 초특가! 3만9천9백원 ) 문자열로 할 수 있는 모든것을 할 수 있습니다. document.write(str.length); // 공백도 문자열로 인식, 결과 : 14 document.write(str.toLowerCase()); // 영문자를 소문자로 바꿔 변환. [결과 : jquery study !] document.write(str.toUpperCase()); // 영문자를 대문자로 바꿔 변환. [결과 : JQUERY STUDY !] document.write(str.indexOf("y")); // 처음인덱..

스크립트를 이용하여 시간과 날짜를 값을 가져오려면 내장 함수인 Date 객체를 이용해서 값을 호출하여야 합니다. 이번에 자주 사용하는 Date 객체에 대해서 정리하고 이해하는 시간이 되었으면 좋겠습니다. Date 객체에 대해 이미 알고 있거나 다른 객체도 공부하고 싶으신 분들은 제가 정리한 String 객체와 Math 객체도 살펴보면 좋을거 같아요. 예제 1. 날짜 객체를 이용하여 오늘 날짜를 구하기 var today = new Date(); var year = today.getFullYear(); var month = today.getMonth(); var day = today.getDate(); var week = today.getDay(); var todayWeek = ['일', '월','화','수..

숫자 데이터를 전달받아서 값을 절삭하거나 반올림 등의 가공이 필요한 경우 자바스크립트의 기본 함수인 Math 객체를 사용하게 됩니다. 간단한 예제를 통해서 한 번씩만 해보신다면 쉽게 이해가 되실 거예요. Math 객체에 대해 이미 알고 있거나 다른 객체도 공부하고 싶으신 분들은 제가 정리한 String 객체와 date 객체도 살펴보면 좋을거 같아요. document.write(Math.max(52, 273, 103, 57, 32)); // 최대값, 결과 : 273 document.write(Math.min(3 , 5, 1, 4)); // 최소값, 결과 : 1 document.write(Math.round(3.4)); // 반올림, 결과 : 3 document.write(Math.ceil(3.2)); //..

정말 프로그래밍에서 자주 사용하는 배열에 대해 알아볼게요. 배열은 우리가 스크립트로 다중 값을 핸들링해야 할 때 반드시 필요한 요소입니다. 아마 배열에 대해 잘 아시는 분도 있고 전혀 모르시는 분도 있을 거라 생각합니다. 배열은 객체(Object)와 마찬가지로 여러 가지 값을 저장할 수 있는 데이터 주머니라고 이해하시면 될 거 같아요. 다만 객체와 다른 점은 배열에 저장된 값에 접근할 때 객체처럼 Key : Velue 형태가 아닌 값이 저장된 인덱스(순서)로 접근을 한다는 것이 차이점일 거 같습니다. 그럼 좀 더 자세히 객체에 대해 알아볼게요. 배열은 하나의 변수에 여러 개의 값을 가져와서 사용해야 할 경우 사용합니다. 배열 Array 함수를 이용하여 사용하게 되며 배열의 첫 번째 값은 0부터 시작됩니다..

객체를 활용하면 우리가 스크립트로 무언가를 구현할 때 굉장히 편리하다는 것을 알 수 있습니다. 이 객체는 사실 우리가 Json이라고 말하는 같다고 생각하시면 됩니다. 중괄호로 값을 포함하고 Key : Velue 형태로 값을 호출하는 방법인데 어디선가 Key : Velue 형태로 값을 호출하는 방법이라는 단어가 이상하게 친숙하지 않나요? (저만 그런 거면 죄송합니다.) 이전에 소개해 드렸던 html5의 data- 속성에 관한 글에서도 Key : Velue에 대한 이야기가 잠깐 나왔습니다. 궁금하신 분들은 위에 링크에 있는 글을 참고해 주세요. 그럼 이제 객체에 대해서 한번 알아볼께요. 모두 설레는 마음으로 같이 알아봐요. 1. 객체는 키와 그에 매칭하는 속성 값으로 선언합니다. 앞에서 말했듯이 객체는 Ke..