[1일차] <프로그래밍>, <들어가며> 키워드 및 질문

[xeunnie]

[1일차]

[챕터 1] <프로그래밍> <들어가며> 키워드 및 질문

1. 프로그래밍

2. 프로그래밍 언어

3. 웹개발의 역사

4. 웹 자바스크립트의 한계

[202110861]

<모던 자바스크립트 Deep Dive>

1. 키워드

• 컴퓨팅 사고
• 컴파일러, 인터프리터

2. 질문

<우아한 타입스크립트>

1. 키워드

• CBD (컴포넌트 베이스 개발)
• 동적 타입 언어
• 인터페이스

2. 질문

• Q1. 타입스크립트를 사용하는 이유는 무엇일까요?
• Q2. type과 interface의 차이점에 대해 설명해주세요.

[wlgusqkr]

Q1. 웹 규모가 커지면서 동적타입언어인 js의 특징인 동적 타입과 NaN처럼 값을 바꿔주는 문제는 서비스를 유지보수할 때 어려워 점직적으로 js에 적용할 수 있는 슈퍼셋 언어인 typescript로 정적타입으로 만들어서 컴파일 타임에 타입을 지정하여 유지보수를 쉽게 만들어준다.
Q2. type은 변수의 타입을 지정하는 것 interface는 객체의 타입을 지정하는 것
type은 선언하고 밑에서 선언하면 확장되지 않지만 interface는 선언 후 밑에서 또 선언하면 확장된다.

[202110861]

우아한 타입스크립트

Q1. 타입스크립트를 사용하는 이유는 무엇일까요?

• 자바스크립트만 사용하면 개발자의 의도와는 다르게 사용해도 오류가 나지 않음.
• 타입스크립트를 사용함으로써 오류가 나는 경우를 줄여주고 협업 할 때도 다른 사람이 짠 코드를 사용할 때 이해를 도와줌.

Q2. type과 interface의 차이점에 대해 설명해주세요.

• type: 예를 들어 prop 을 사용할 떄 데이터들의 타입을 지정해 줄 때 사용
• interface: 데이터의 타입 뿐만 아니라 extend?도 추가로 적을 수 있어 type보다 약간 확장된? 느낌

[xeunnie]

• A1.
  자바스크립트는 동적 타입 시스텝입니다. 개발자의 의도대로 동작하지 않는다는 단점이 있었습니다. 이는 코드상으로는 문제없지만 사용자에게는 문제를 일으켰습니다.
  타입의 검사가 필요했고 인터페이스와 제네릭과 같은 타입들이 필요해지기 시작했습니다.
  이에 자바스크립트와 완벽한 호환성을 가지고 컴파일 단계에서 검사하는 슈퍼셋으로 타입스크립트가 등장하게 되었습니다.
• A2.
  둘 다 타이을 정의하는 방법입니다.
  인터페이스는 "객체 구조를 정의"할 때 씁니다. extend를 사용해 확장이 가능합니다.
  타입은 객체 타입뿐 아니라 유니온, 튜블 정의에도 씁니다. 복잡한 타입의 조합이 필요할 때 보통 씁니다.
  선언 병합은 인터페이스에서만 가능합니다.

[Stella-516]

Q1. 타입스크립트를 사용하는 이유는 무엇일까요?
자바스크립트의 부족한 점을 보완하기 위함.

Q2. type과 interface의 차이점에 대해 설명해주세요.
type은 형식이고, interface는 서로 다른 형식을 주고 받는 상호작용

[wlgusqkr]

<모던 자바스크립트 Deep Dive>

키워드
컴퓨팅 사고
컴파일러
인터프리터

Q1. 자바스크립트 엔진이 코드를 실행시키는 과정은?

<우아한 타입스크립트>

키워드
슈퍼셋
CBD
동적 타입 언어
질문
Q1. 브라우저 렌더링 과정이 무엇인가?
Q2. Javascript는 어떤 언어인가?
Q3. 크로스 브라우징이란 크로스 브라우징을 해결하는 방법은?

참고 : https://mocha-blog.tistory.com/240

[wlgusqkr]

<모던 자바스크립트 Depp Dive>
A1. ..
<우아한 타입스크립트>
A1. ..
A2. js는 동적 타입언어, 프로토타입이라는 개념이 있다.
A3. 크로스 브라우징이란 같은 코드지만 웹 브라우저마다 결과가 다르게 나타나는 것이다.

[xeunnie]

• A1.
  소스코드 파싱 -> ast 생성 -> 인터프리터 실행해서 바이트 코드로 변환 -> 자주 실행되는 코드를 최적화합니다.

• A2.

• html, css, js 해석해 화면에 표시합니다.
  DOM & CSSOM 파싱 -> 렌더 트리 생성 -> 레이아웃 계산 -> 페인팅 -> 컴포지팅(합성) 순서입니다.

• A3
  인터프리터 기반의 동적 타입 언어로 브라우저 동적 기능을 구현하기 위해 만들어진 언어입니다.
  단일 스레드 기반 언어, 비동기 지원, 노드 서버에서 활용가능합니다.

• A4.
  브라우저마다 렌더링 방식이 달라서 웹사이트가 다르게 보이는 문제입니다. 폴리필, 트랜스파일 사용

[Stella-516]

Q1. 자바스크립트 엔진이 코드를 실행시키는 과정은?
->

Q1. 브라우저 렌더링 과정이 무엇인가?
-> 새로고침과 비슷한 효과

Q2. Javascript는 어떤 언어인가?
-> 객체 지향 언어입니다. 추가로 동적으로 사용자가 상호작용 가능한 언어입니다.

Q3. 크로스 브라우징이란 크로스 브라우징을 해결하는 방법은?
->

[202110861]

모던 자바스크립트

Q1. 자바스크립트 엔진이 코드를 실행시키는 과정은?

• ???

우아한 타입스크립트

Q1. 브라우저 렌더링 과정이 무엇인가?

• 새로고침?

Q2. Javascript는 어떤 언어인가?

• 동적 타입 언어

Q3. 크로스 브라우징이란 크로스 브라우징을 해결하는 방법은?

• 기억이 안나요ㅎ.ㅎ

[Stella-516]

<모던 자바스크립트 Deep Dive>
-키워드
컴퓨팅 사고
컴파일러/인터프리터

-질문
자연어와 기계어의 차이?

<우아한 타입스크립트>
-키워드
폴리필 / 트랜스파일
컴포넌트
타입스크립트

-질문
웹 사이트와 웹 애플리케이션의 차이?
자바스크립트의 한계?

[xeunnie]

• A1.
  자연어의 사용자는 사람인 일반 언어이며, 기계어는 0과 1로 이뤄진 기계를 위한 언어입니다.
  둘의 매개체로 프로그래밍 언어가 있습니다.

• A2.
  웹사이트는 정적 사이트로 이뤄진 html, css 위주의 페이지입니다.
  웹 어플리케이션은 사용자와의 상호작용이 가능한 동적 페이지입니다.

• A3.
  동적 타입의 언어이기 때문에 타입의 안정성이 낮아 런타임 오류가 발생합니다.
  싱글 스레드 기반이기 때문에 복잡한 연산 처리에는 성능 문제가 발생합니다.

[wlgusqkr]

A1. 자연어는 사람이 쓰는 언어 기계어는 컴퓨터가 읽을 수 있도록 바뀐 언어이다.
A2. 웹 사이트는 사이트가 사용자에게 정보를 제공하는 단방향 소통이지만 웹 앱은 사이트와 사용자가 쌍방향으로 소통하는 것이다.
A3. 자바스크립트는 동적타입언어이며 a + undefined도 연산을 해내는 언어다.

[202110861]

모던 자바스크립트

Q.1자연어와 기계어의 차이?

• 사람이 이해할 수 있는 모든 말들을 자연어라 하고, 기계어는 컴퓨터가 사용하는 언어, 즉 컴퓨터가 이해할 수 있는 언어를 말함. 컴퓨터는 자연어를 이해하지 못하기 때문에 중간에 컴파일러를 거쳐서 컴퓨터가 이해할 수 있도록 번역해주어야 함.

우아한 타입스크립트

Q.1웹 사이트와 웹 애플리케이션의 차이?

• 웹 사이트: 정보들의 나열이며 사용자와 상호작용 할 수 없는 단방향이 특징임.
• 웹 애플리케이션: 사용자와의 상호작용을 할 수 있는 쌍방향이 특징.
  (상호작용의 예: 댓글, 좋아요 등등)

Q.2 자바스크립트의 한계?

• 동적 타입 언어로써 개발자의 의도와는 다르게 사용될 수 있음.

[Stella-516]

1. 자연어와 기계어의 차이?
   -> 자연어는 인간의 기준으로 사용하는 언어, 기계어는 컴퓨터의 입장에서 사용하는 언어로
   인간의 언어를 프로그래밍 문법을 통해 기계어로 바꿔서 인풋한다

2. 웹 사이트와 웹 애플리케이션의 차이?
   -> 웹 사이트는 정적이며, 웹 애플리케이션은 동적으로 사용자가 본인이 원하는 방향으로 수정 및 사용이 가능한 다양한 요소들을 포함할 수 있다

3. 자바스크립트의 한계?
   -> 형식(문법)이 맞는다면 의미가 맞지 않더라고 오류가 없다고 판단하는 한계를 가진다 그래서 이에 타입스크립트가 등장함

[xeunnie]

<모던 자바스크립트 Deep Dive>

키워드

• 프로그래밍
• 컴파일러
• 인터프리터

질문

• Q1. 컴파일러와 인터프리터의 차이점은 무엇인가요?

<우아한 타입스크립트>

키워드

• 폴리필, 트랜스파일
• CBD
• 웹사이트
• 동적 언어
• 크로스 브라우징

질문

• Q2. ECMAScript 표준이 등장하게 된 이유와 그로 인해 웹 개발의 패러다임이 어떻게 변화했나요?
• Q3. 타입스크립트가 자바스크립트의 한계를 어떻게 보완하며, 도입할 때의 장점은 무엇인가요?

[xeunnie]

• A1.
  컴파일러: 코드를 한번에 기계어로 변환 -> 실행 실행 속도가 빠르지만 컴파일 시간이 필요
  인터프리터: 코드를 한 줄씩 즉시 실행 -> 실행 속도는 느리지만 수정이 용이(컴파일 과정 없음)

• A2.

1. 등장 이유
   각기 다른 방식으로 js를 해석해 크로스 브라우징 발생 -> ECMA에 js 표준 등장
2. 패러다임 변화
   모듈, 비동기 처리등이 강화되면서 동적인 구조로 발전하고 웹서비스가 복잡하고 큰 규모로 확대

• A3

1. 한계
   • 자바스크립의 동적타입 언어 -> 런타임 오류 발생, 유지보수 어려윰
2. 보완
   • 정적 타입 검사, 컴파일 단계에서 오류 방지 => 안정성 보완
   • 인터페이스, 제네릭, 접근제어자 -> 객체지향 가능해짐

[wlgusqkr]

A1. 컴파일러는 프로그램 전체를 읽어 .o파일로 바꾸고 어셈블리어로 바꾸고 바이트코드로 바꾼다. 인터프리터는 한줄씩 읽는다.
A2. ECMAScript는 초기에 유행했던 네비게이터인가 랑 IE가 있어 두 브라우저를 동시에 적용하기 힘들고 사용자의 브라우저가 업데이트되지 않았다면 제대로 동작하지 않는 문제가 생겨 ECMAScript가 등장하였고 그 이후 급속도로 발전하여 대규모 웹서비스가 등장하고 CBD가 등장햇다.
A3 타입스크립트는 자바스크립트의 문제인 동적 타입과 타입을 줘서 의도와 다른 사용을 막아 유지 보수가 좋아졌다. 타입스크립트는 점진적으로 도입할 수 있는 슈퍼셋 언어이기 때문에 점진적으로 적용가능하고 정적 타입을 적용하여 컴파일 단계에서 에러를 파악할 수 있다.

[Stella-516]

A1. 컴파일러는 작업한 내용을 찾는것, 인터프리터는 서로 다른 형식을 상호작용하는 것.
A2. ,,,,,
A3. 자바스크립트의 형식이 맞으면 의미가 달라도 맞게 사용된다는 문제점을,, 00하게 해결함. 이를 마이크로소프트에서 도입함

[202110861]

Q1. 컴파일러와 인터프리터의 차이점은 무엇인가요?

차이점은 모르겠고...
공통점은 프로그래밍 언어를 컴퓨터가 이해할 수 있도록 기계어로 번역해주는 역할을 함.
Q2. ECMAScript 표준이 등장하게 된 이유와 그로 인해 웹 개발의 패러다임이 어떻게 변화했나요?

자바스크립트의 문제점? 을 표준화를 시켜줌으로써 해결하고 이로 인해 대규모 웹 애플리케이션 시대가 옴
Q3. 타입스크립트가 자바스크립트의 한계를 어떻게 보완하며, 도입할 때의 장점은 무엇인가요?

동적 타입 언어의 문제점들을 보완하기 위해 타입을 지정함으로써 개발자의 의도대로 사용할 수 있게 하고 에러의 가능성을 줄여주는 장점이 있음.