LeeeYumin / academy_TIL

0 stars 0 forks source link

0711_오전 #6

Open LeeeYumin opened 4 months ago

LeeeYumin commented 4 months ago

✔API 애플리케이션 프로그래밍 인터페이스. : 애플리케이션에서 사용하도록 운영체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스. 인터페이스 ex. 자판기의 음료수를 구매하는 경우

  1. 사용자가 버튼을 눌러 음료를 선택
  2. 자판기는 내부적으로 동작 실행
  3. 사용자가 음료수를 받음 API가 스마트폰 앱과 서버 사이의 데이터 통신을 중재. 클라이언트에서 동작하는 애플리케이션과 서버가 서로 통신할 수 있도록 도와주는 매개체.

❓API의 중요성 통합 - 목적이 제각각인 시스템 간의 통합을 쉽게 할 수 있음 ex. 날씨 정보를 보여주는 애플리케이션과 날씨 정보를 응답하는 서버는 프로그래밍 사이의 관련성이 없어도 api를 사용하면 두 시스템을 통합해 날씨 정보 제공이라는 하나의 목적을 달성할 수 있음. 확장 - 확장성이 좋은 애플리케이션을 만들 수 있음 ex. 날씨 정보만 제공하는 애플리케이션에 커뮤니티 기능이 필요하다면 그 기능을 하는 애플리케이션을 만든 후 합치기만 하면 됨. 용도별로 api가 있기 때문에 이를 사용하면 확장이 쉬움. 재사용성 - 애플리케이션의 기능을 쉽게 재사용할 수 있음 ex. 상품 검색 버튼이 A, B 페이지에 있다면 검색 기능 api를 하나만 만들어 여러 페이지에 사용 가능. 보안 -애플리케이션의 보안 기능을 강화할 수 있음 ex. 중요한 데이터를 보호하기 위해 api 자체에 인증 및 권한 부여 로직을 적용 가능. 관심사 분리 - 프론트앤드와 백앤드의 관심사를 분리할 수 있음 ex. 프론트앤드 개발 시 백앤드의 세부 구현 사항을 신경 쓰지 않고 사용자에게 보이는 UI와 각 구성 요소 간의 상호작용에만 집중하면 됨. api를 기준으로 서버와 통신하면 되기 때문.

❓API의 종류 브라우저 API - 웹 브라우저에서 자체적으로 제공하는 API 집합. 주요 브라우저 API 는 DOM API, 지오로케이션 API, 스토리지 API 등이 있음. DOM API Document Object Model API. : 개발자가 HTML 문서와 구조의 내용에 접근해 조작할 수 있는 일련의 방법을 제공하는 브라우저 API. 주요 기능으로는 요소 선택과 탐색(getElementById, querySelector()등) 요소 생성과 조작(innerHTML, setAttribute() 등) 문서 조작(appendChidl(), replaceChild() 등) 이벤트 처리(선택된 요소에 이벤트 등록, 등록된 이벤트에 해당하는 이벤트 리스너 등록 등) https://developer.mozilla.org/ko/docs/Web/API/Document/createElement 참고

지오로케이션 API : 사용자의 위치 정보를 가져오는 기능을 제공하는 브라우저 API. api를 통해 사용자의 현재 위치를 파악함으로써 사용자 위치 기반 서비스 개발이 가능함. 자주 사용하는 메서드는 getCurrentPosition(), watchPosition() 등 지오로케이션 API는 사용자의 동의를 받지 않으면 사용불가. 사용자가 위치 추적에 동의했을 때와 동의하지 않았을 때를 고려해 코드를 작성해야 함.

스토리지 API : 데이터를 웹 브라우저에 저장하는 방법을 제공하는 브라우저 API. 데이터베이스를 사용하지 않고 클라이언트에서 바로 데이터를 저장해 사용할 수 있음. 웹 스토리지 API와 인텍스트DB API로 구분함. ◾웹 스토리지 API - 키-값 형태의 데이터를 사용자의 웹 브라우저에 저장함. 웹 브라우저의 로컬 스토리지 또는 세션 스토리지에 저장된다. 로컬 스토리지는 웹 브라우저를 종료해도 데이터가 유지됨. 세션 스토리지는 웹 브라우저가 종료되면 데이터도 같이 삭제됨. ◾인텍스트DB API - 웹 브라우저에 데이터를 저장하기 위한 데이터를 저장하기 위한 고급 메커니즘을 제공함. 웹 브라우저에거 제공하는 NoSQL(Not only SQL) 기반의 데이터베이스라고 생각하면 됨. (행과 열로 이뤄진 테이블에 데이터를 저장하는 관계형 데이터베이스와 달리 데이터 유형에 따라 유연하게 형태를 바꿔 데이터를 저장함)

✔Math 메소드 Math.abs(number) : number 인수의 절댓값을 반환한다 Math.round(number) : number 인수의 소수점 이하를 반올림한 정수를 반환한다 Math.ceil(number) : number 인수의 소수점 이하를 올림한 정수를 반환한다 Math.floor(number) : number 인수의 소수점 이하를 내림한 정수를 반환한다 Math.sqrt(number) : 숫자의 제곱근을 반환한다 Math.random() : number 임의의 부동 소수점을 반환한다. 반환된 부동 소수점은 0부터 1미만. 0은 포함되고 1은 포함안됨 Math.pow(number,number) : 첫번째 인수를 밑(base), 두번째 인수를 지수(exponent)로 거듭제곱 반환한다 Math.max(...number) : 인수 중에서 가장 큰 수를 반환한다 더 있는데 필요할 때 찾아보기.

LeeeYumin commented 4 months ago

✔Date() : 자바스크립트에서 월(month)을 나타낼때는 1월이 0으로, 12월이 11로 표현됨! UTC 랑 GMT 비슷..? 기술적인 표기에서는 UTC가 사용됨.

Date Constructor Date 객체는 생성자 함수.

new Date() : 인수를 전달하지 않으면 현재 날짜와 시간을 가지는 인스턴스를 반환함 new Date(milliseconds) : 인수로 숫자 타입의 밀리초를 전달하면 1970년 1월 1일 00:00 을 기점으로 함. new Date(dateString) : 인수로 날짜와 시간을 나타내는 문자열을 전달하면 지정된 날짜와 시간을 가지는 인스턴스를 반환함. 이때 인수로 전달한 문자열은 Date.parse 메소드에 의해 해석 가능한 형식이어야 함, new Date(year, month[, day, hour, minute, second, millisecond]) : 인수로 년, 월, 일, 시, 분, 초, 밀리초를 의미하는 숫자를 전달하면 지정된 날짜와 시간을 가지는 인스턴스를 반환함. 이때 년, 월은 반드시 지정해야 함. 지정하지 않은 옵션 정보는 0 또는 1로 초기화 됨. 년, 월을 지정하지 않은 경우 1970년 00:00(UTC)을 가지는 인스턴스를 반환함

✍🏻카운트다운 실습