728x90 반응형 IT 개발/JavaScript50 객체 속성 기술자 이해하기 [객체 속성 기술자 이해하기] 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 let user = { name : "jeado" }; let descriptor = Object.getOwnPropertyDescriptor(user, 'name'); console.log(descriptor); let user2 = {}; Object.defineProperty(user2, "name", { value : "jeado", enumerable : true, configur.. 2021. 9. 12. 클로저 이해하기 * counter1과 counter2 객체의 increase 메소드를 호출하면 2라인에서 볼 수 있는 createCounterClosure 함수 내부의 count 변수에 모두 접근한다. 하지만 cunter1과 counter2의 getCount를 호출한 결과를 보면 counter1의 메소드들이 가리키는 count와 counter2의 메소드들이 가리키는 count가 다른 값을 가지고 있는 것을 알 수 있다. counter1과 counter2의 메소드들이 다른 count에 접근하는 것은 다른 렉시컬 환경의 환경 레코드에서 count에 접근하는 것이다. 이러한 현상이 가능한 이유는 바로 클로저 때문이다. increate와 getCount 함수가 정의될 때의 렉시컬 환경은 createCounterClosure 실.. 2021. 9. 12. 스코프 이해하기 스코프는 유효 범위로써 변수와 매개변수가 어디까지 유효한지를 나타낸다. 예를들어, 코드에서 a라고 작성했을 때 a라는 식별자가 어디를 참조할지, 실제값이 무엇인지를 찾을 때 스코프를 활용하여 찾게 도니다. 자바스크립트는 기본적으로 전역과 함수 단위로 스코프를 생성한다. 함수 안에서 선언된 수는 함수 블록 안에서만 접근이 가능하다. 그리고 전역에 선언한 변수들은 코드 어디에서든 접근이 가능하다 2021. 9. 12. 함수 호이스팅 이해하기 * 자바스크립트에서는 함수를 선언하기 전에 호출이 가능하다. * 이러한 현상을 호이스팅이라고 한다. 호이스팅을 직영하면 '끌어올리기'인데 함수가 실제 호출하기 이전으로 끌어 올라간 것 처럼 동장하기 때문이다. [함수를 선언문이 아닌 표현식을 통해 변수에 할당하여 호출하기] TypeError 에러가 발생한다. 에러의 종류가 TypeError 의외일 수 있다. 실제로는 hello2 이름으로 선언된 변수는 호이스팅이 이루어졌고, 여기에는 undefined가 할당된다. 그래서 undefined는 호출할 수 없기 때문에 TypeError가 발생한 것이다. 만약 호이스팅이 이루어지지 않았더라면 ReferenceError로 hello가 선언되지 않았다는 에러가 나와야 한다. [NOTE] 호이스팅은 자바스크립트의 코드.. 2021. 9. 12. ES6의 향상된 객체 문법 알아보기 - 단축 속성명, 속성 계산명, 비구조화 할당 ● ES6부터 추가된 단축 속성명으로 객체를 정의하는 방법 ES6에 새로 추가된 JavaScript 기능인 단축 속성명을 활용하여, 객체의 속성을 좀 더 간단하게 정의할 수 있다. 객체 속성을 리터럴로 정의하기 위해서는 키 : 값으로 작성해야 했다. 단축 속성명은 변수가 미리 준비되어 있는 경우 활용 가능하며, 변수명으로 속성의 키와 값을 한번에 정의할 수 있다. 이는 객체 리터럴 선언 코드를 더 짧고 가독성 있게 만들어 준다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 // {변수명} var address = 'Seoul'; var member = {}; var addFamily .. 2021. 9. 4. 반복문 배우기 - while shift()는 배열의 앞에서부터 값을 하나씩 빼내오는 함수이다. [1,2] 배열에 shift() 가 실행되어 1이 방출되면 해당 배열은 [2]가 된다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 var hometown = [ {name: '진', city: '과천'}, {name: '남준', place: '일산', city: '고양'}, {name: '호석', place: '광주', city: '전라도'}, {name: '지민', place: '부산', city: '경상도'} ]; var isHometown = function(h, name) { console.log(`함수가 실행.. 2021. 4. 18. 반복문 - for in for-in 반복문은 for 반복문과 비슷하게 for 키워드를 사욯나다. 단, 순회 조건과 내부 요소에 접근하는 방법에 차이가 있는데, for-in 반복은 in 키워드를 사용한다. 키워드를 사이에 두고 오른쪽에는 반복한 대상 변수를 , 왼쪽에는 속성명을 작성한다. for ( 속성명 in 반복할 대상 (list, 배열,) { } 1 2 3 4 5 6 7 var store = { snack: 1000, flower: 5000, beverage: 2000 }; for (var item in store) { if (!store.hasOwnProperty(item)) continue; console.log(item + ' 는 가격이 ' + store[item] + ' 입니다.') } Colored by Color.. 2021. 4. 18. [Node.js 다운로드] Node.js 설치하기 http://nodejs.org/ko.download/ 로 이동하여 설치 진행 다운로드 이지 내 설치 파일에는 LTS(Long Term Support)와 현재버전(Current)이 있다. LTS란, 최소 18개월 지원되는 버전으로 장기간 동안 유지 관리가 가능하다. 현재버전은 항상 최신 기능이 적용된 반면, 이를 6개월만 지원하기 때문에 기능 추가 및 버전 업데이트가 자주 발생한다. 따라서 보다 안정된 환경에서 개랍하고 유지관리하기 위해서는 LTS를 사용하는 것을 권장한다. - 다운로드 받은 후 파일 실행 - 파일실행이 완료되어 Node.js 를 실행시키면 아래처럼 명령 프롬프트가 열린다. - Window 명령 프롬프트를 열어 'node -v','npm -v' 명령어를 실행하여 n.. 2021. 4. 18. 도시하천) 강우 레이더 조회 03.02 강우 레이더 조회 (한강 홍수통제소 레이더 영상 조회) -- 한강홍수통제소 openAPI 사용 -- http://www.hrfco.go.kr/web/openapiPage/reference.do# 1) 아래 xml에 Api key와 Url 생성 - system_config_properties_dev.xml - system_config_properties_production.xml - system_config_properties_staging.xml * 참고 자료 -- %s 는 HRFCO_RADAR_KEY가 들어갈 자리 http://api.hrfco.go.kr/%s/radar/list/COMP.json 52832662-D130-4239-9C5F-730AD3BE6BC6 * sfc_rainfall.j.. 2020. 3. 17. 07. 제이쿼리 이벤트 (5) : 포커스 이벤트 포커스는 마우스로 또는 태그를 클릭하거나 Tab 키를 누르면 생성됨 앞에서 작성한 포스팅에는 마우스 이벤트는 마우스가 없으면 사용할 수 없다. 사용자는 키보드만 가지고 사용해야 함. 이때 사용자가 키보드만으로 사이트를 이용해도 불편함이 없도록 제이쿼리가 잘 작동되어야 하는데, 이를 키보드 접근성이라 한다. 키보드 접근성을 높이기 위해서는 마우스 이벤트를 등록할 때 될 수 있으면 또는 태그에 등록하고, 키보드가 없을 경우를 고려하여 마우스 이벤트에 대응할 수 있는 키보드 이벤트까지 등록해야 한다. focus() / blur() / focusin() / focusout() 이벤트 메서드 - focus() 이벤트 메서드 : 대상 요소로 포커스가 이동하면 이벤트를 발생 시킴 - blur() 이벤트 메서드 : 포.. 2020. 3. 16. 이전 1 2 3 4 5 다음 728x90 반응형
