Young's Today

4.1 변수 변수 숫자(합계나 계산에 사용되는) 또는 문자열(문장의 일부로 사용되는)과 같은 값의 컨테이너 프로그래밍 언어에서 데이터를 관리하기 위한 핵심개념으로, 복잡한 애플리케이션도 데이터를 입력(input) / 출력(output) 하는 것이 전부 https://developer.mozilla.org/ko/docs/Learn/JavaScript/First_steps/Variables 필요한 정보를 저장하기-변수 - Web 개발 학습하기 | MDN 앞선 두 수업을 듣고, 자바스크립트에 대해(웹 기술에서 어떻게 사용되는지, 큰 범위에서의 특징) 알아보았다. 이번 수업에서는 기본중에 기본인 자바스크립트의 주된 구성중 하나인 변수가 어 developer.mozilla.org 하나의 값을 저장하기 위해서 확보..

3.1 자바스크립트 실행 환경 자바스크립트 엔진 모든 브라우저는 자바스크립트를 해석하고 실행할 수 있는 자바스크립트 엔진을 내장 Node.js도 자바스크립트 엔진을 내장하고 있음 따라서 브라우저 또는 Node.js 환경에서 자바스크립트를 실행할 수 있음 브라우저와 Node.js 차이점 브라우저는 HTML, CSS, 자바스크립트를 실행해서 웹페이지를 브라우저 화면에 렌더링하는 것이 주된 목적 파일을 생성하고 수정할 수 있는 파일 시스템을 제공하지 않음 [예시] 파싱된 HTML 요소를 선택하거나 조작하는 기능의 집합인 DOM API를 기본적으로 제공 Node.js는 브라우저 외부에서 자바스크립트 실행 환경을 제공하는 것이 주된 목적 파일을 생성하고 수정할 수 있는 파일 시스템을 제공 [예시] 브라우저 외부에..

2.1 자바스크립트란 자바스크립트의 탄생 웹페이지의 보조적인 기능을 수행하기 위해 브러우저에서 동작하는 경량 프로그래밍 언어를 도입하기로 결정하여 개발된 언어 모카(mocha) > 라이브스크립트(LiveScript) > 자바스크립트(Javascript)로 이름 변경 2.2 자바스크립트의 표준화 히스토리 시기 히스토리 1995년 12월 모카로 시작하여 웹페이지의 보조 기능을 위해 프로그래밍 언어를 도입했고 최종적으로 자바스크립트라는 명칭으로 개발 완료 1996년 08월 넷스케이프 커뮤니케이션즈와 마이크로소프트는 자사 브라우저의 시장 점유율을 높이기 위해 자사 브라우저에서만 동작하는 기능을 추가하기 시작하였으나 이로인해 브라우저에 따라 웹페이지가 동작하지 않는 크로스 브라우징 이슈 발생 1996년 11월 이..

1.1 프로그래밍이란 프로그래밍 네이버 지식백과 : 컴퓨터에 부여하는 명령을 만드는 작업으로 정의 딥다이브 도서 : 컴퓨터에게 실행을 요구하는 일종의 커뮤니케이션 0과 1밖에 모르는 기계가 실행할 수 있을 정도로 정확하고 상세하게 요구사항을 설명하는 작업 문제 해결 능력 프로그래밍을 하기 위해서는 무엇을 실행하고 싶은지 정의할 필요가 있음 해결해야 할 문제 혹은 요구사항을 명확히 이해한 후에 문제 해결 방안을 정의하기 위해 문제 해결 능력이 필요 컴퓨팅 사고 문제 해결 방안을 고려할 때 컴퓨터 입장에서 바라봐야 함 사람의 일반적인 사고 방식은 포괄적이고 익숙한 것을 당연 시 여김 예시 (1) 사람은 소리의 크기를 크다/작다 표현하지만 이러한 표현 방식은 상대적인 개념이므로 기준이 불분명함따라서 컴퓨팅 사..

(1) find - 배열의 요소를 순차적으로 순회하면서 조건에 일치하는 요소의 값을 즉시 반환 - 조건에 만족하는 값이 여러개가 있더라도 첫번째 값만 확인 가능 - 조건에 일치하는 경우가 없다면 undefinded 반환 arr.find(callback(element, index, array), thisArg) arr : 순회하고자 하는 배열 element : 현재 배열 요소 index : 현재 배열 요소의 index (생략 가능) array : 함수를 호출한 배열 (생략 가능) thisArg : callback을 실행할 때 this로 사용되는 값 (=map 함수에서 사용될 this값) (생략 가능) - 예시 (조건에 일치하는 배열이 있는 경우) let exam = [ {name: 'A', age: 12}..

(0) 미리 알아두기 : 콜백함수(callback function) - 밑에서 계속 콜백함수에 대한 내용이 나오므로 알아둘 것 - 다른 코드의 인수로서 넘겨주는 실행 가능한 코드를 말함 - 콜백을 넘겨받는 코드는 이 콜백을 필요에 따라 즉시 실행할 수도 있고, 아니면 나중에 실행할 수도 있음 - 즉 다른 함수의 인자로써 이용되는 함수 혹은 어떤 이벤트에 의해 호출되어지는 함수 (1) map - 어떤 배열에 있는 모든 요소들의 값을 변경해서 만든 새로운 배열을 써야할 때 사용 - 배열의 값이 많을수록 편리하게 변경할 수 있음 - 콜백 함수를 이용해 각각의 요소에 호출해서 그 값을 변환할 수 있게 해줌 - 콜백 함수는 배열의 각 요소에 실행 - 사용 방법 array.map() array.map(callbac..

1. 객체 (object) (1) 자바스크립트의 데이터 타입 - 원시타입 : 단 하나의 값만 나타내고, 변경이 불가능한 값 ex. boolean - 객체타입 : 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료 구조, 변경 가능한 값 ex. 함수, 배열 등이 하나로 합쳐진 형태 (2) 자바스크립트는 객체 기반의 프로그래밍 언어 (3) 객체는 0개 이상의 프로퍼티로 구성된 집합, 하나의 프로퍼티는 ket와 value로 구성 https://doyoung-p.tistory.com/39 자바스크립트 객체 / 프로퍼티 / 메서드 1. 객체와 프로퍼티 const test = { property key name1 : property value1, property key name2 : property value2..

1. 프로미스 (promise) -자바스크립트에서 비동기 처리를 동기로 처리할 수 있게 돕는 Built-in(미리 내부적으로 정의된)객체 유형 - 단어 그대로 언제 진행할지 약속한다고 이해하면 됨 - 비동기 명령의 실행이 완료된 이후 언제 진행할지 약속한다는 의미 - 비동기적 진행의 선택은 개발자의 의도에 따라 결정 2. 프로미스 필요한 이유 - 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용 - 웹개발 시 서버에서 데이터를 요청하고 받아오기 위해서 API를 사용하게 됨 - API 실행 후 데이터를 받아오기도 전에 데이터를 다 받아온 것처럼 화면에 데이터를 표시하려고 하면 에러 - 에러를 해결하기 위해 프로미스는 를 사용 3. 프로미스 생성자 인터페이스 - executor에는 함수만 올 ..

1. 객체와 프로퍼티 const test = { property key name1 : property value1, property key name2 : property value2, } (1) 객체 : 이름과 값으로 구성된 프로퍼티의 집합, {} 사이의 내용 (2) 프로퍼티 : 객체 안에 선언된 key와 value로 이루어진 한 쌍 (3) 객체를 만들 때 규칙 객체 선언할 때 const 키워드 사용 프로퍼티 이름 중복 불가 프로퍼티 이름과 밸류 사이 콜론(:)으로 구분 필요 프로퍼티 추가 시 쉼표(,)로 구분 프로퍼티 값은 어느 타입이 가능 (string / number array / object / function etc) 2. 객체 함수 (1) 객체 안에 포함된 함수 (2) 메소드(함수)는 객체 안..

변수 선언 차이점 var let const 중복 선언 가능 여부 가능 불가능 불가능 재할당 가능 여부 가능 가능 불가능 변수 스코프 유효범위 [예시1] 함수 레벨 스코프 블록 레벨 스코프 블록 레벨 스코프 변수 호이스팅 방식 [예시2] 발생 발생/다른 방식 작동 발생/다른 방식 작동 전역 개체 프로퍼티 여부 맞음 아님 아님 [예시1] // var : 함수 레벨 스코프 // 함수 내부에 선언된 변수만 지역변수로 한정 function test() { var a = 1; console.log(a); } test(); // 출력 > 1 console.log(a) // 출력 > ReferenceError : a is not defined // 나머지는 모두 전역 변수로 간주 if (true) { var a = 1..