[혼공JS] 1주차_24.07.01-07.07

1주차 진도 [Chapter 01~02]

 

p.66 확인문제 풀어보기

1.

 

2.

 

p.71 식별자

키워드로 사용하면 안된다.

숫자로 시작하면 안된다.

특수문자는 _와 $만 허용한다.

공백 문자를 포함할 수 없다.

여러 글자로 구성된 식별자는 대문자로 구분해준다.

ㄴcreat map > creatMap

ㄴremove all > removeAll

대문자로 시작하면 클래스	클래스가 아닌것
Array Number Pet	ARRAY NUMBER PET

* 변수, 인스턴스, 함수, 메소드는 항상 소문자로 시작한다.

 

식별자의 종류

구분	단독으로 사용	다른 식별자와 사용
식별자 뒤에 괄호 없음	변수	속성
식별자 뒤에 괄호 있음	함수	메소드

 

식별자 종류 구분해보기

alert('hello World')	함수
Array.lenght	속성
input	변수
prompt('message',Defstr')	함수
Math.PI	속성
Matf.abs(-273)	메소드

 

p.73 주석

주석이란? 사람이 보기 위한 코드로 프로그래밍에 영향을 주지 않는다.

html 주석 : <!-- 여기에 주석을 작성 -->

자바 script 주석 : // 한줄로 된 주석을 작성, /* 여러 줄로 된 코드 작성 가능 */

주석 사용 예시 

 

p.81 확인문제 플어보기

5.

 

p.85 문자열

\n : 줄바꿈

\t : 탭 문자

\\ : 역슬래시 자체

 

p.87 문자열 연산

1. 문자열 연결 연산 : 문자열 + 문자열 ex. '안녕'+'하세요' > "안녕하세요"

2. 문자 선택 연삭 : 문자열[인덱스] (문자하나 출력-0부터 시작하는 숫자)

ex."안녕하세요"[0] > "안", "안녕하세요"[4] > "요"

3. 문자열의 길이 : 문자열.length (문자 개수)

ex. "안녕하세요".length > 5

 

p.91 불 자료형

1. true, false를 그대로 입력하여 만든다.

2. 비교 연산자를 사용한다.

연산자	설명	예시
===	양쪽이 같다.	1===1  true
!==	양쪽이 다르다.	1!==1  false
>	왼쪽이 더 크다.	1>1  false
<	오른쪽이 더 크다.	1<1  false
>=	왼쪽이 더 크거나 같다.	1>=1  true
<=	오른쪽이 더 크거나 같다.	1<=1  true

 

논리 부정 연산자

!불 > 값을 반대로 변경

!true => false / !false => true

 

// 단항 연산자 : 피연산자가 하나 

-10

// 이항 연산자 : 피연산자가 두개

10 - 20

// 삼항 연산자 : 피연산자가 세개 > Ch.3에서 진행

 

불 논리합/논리곱 연산자

연산자	설명
&&	논리곱 연산자 (그리고)
||     (\+shift 누르면 나옴)	논리합 연산자 (또는)

 

&& 연산자는 양쪽 변의 값이 모두 true 일때 true로 결과값을 나타낸다. (이외 모두 false)

|| 연산자는 양쪽 변의 값 중 하나만 true 여도 true를 나타낸다.

&& 연산자 (논리곱 연산자)			|| 연산자 (논리합 연산자)
좌변	우변	결과	좌변	우변	결과
true	true	true	true	true	true
true	false	false	true	false	true
false	true	false	false	true	true
false	false	false	false	false	false

 

p.96 자료형 검사 - 단항연산자

typeof(자료)

 

>typeof('문자열') === 'string' → 문자열을 의미

>typeof('273') === 'number' → 숫자를 의

>typeof('true') === 'boolean'

* typeof 연산자 뒤에 괄호가 없어도 됨

 

p.98 템플릿 문자열

`템플릿 문자열 : ${typeof('표현식')}`

백틱(`) 기호를 감싸 만든다.

 

'17+23의 값은' + (17+23) + '입니다.' // "17+23의 값은 40입니다."

위 값을 템플릿 문자열로 입력하게되면

`17+23의 값은 ${17+23}입니다.` // "17+23의 값은 40입니다."

* 더 간단하게 입력하여 출력이 가능하다.

 

console.log(`표현식 273 + 52 의 값은 ${273 + 52} 입니다...!`)

> 표현식 273+52의 값은 325 입니다.

 

p.103 상수와 변수

상수 - 항상 같은 값

const 식별자 = 자료

const pi = 3.14

중복 선언은 불가능하다. > 이름을 바꿔서 선언하거나 f5로 내역을 날린다.

 

변수 - 변할 수 있는 값 

let 식별자 = 자료

let 식별자 (값을 미지정시)

식별자 = 자료 (값을 변경시)

선언한 값을 변경할 수 있다.

let pi = 3.14 로 선언 후 pi=3.141592 로 재선언하면 값이 변경된다.

 

상수 또는 변수에 값을 넣는것 ('식별자'='자료')을 할당한다 라고 표현한다.

처음으로 값을 할당하는 것은 '초기화'라고 한다.

 

p.107 변수에 적용할 수 있는 연산자

복합 대임 연산자 + 증감 연산자

복합 대입 연산자	설명	사용 예	의미
+=	기본 변수의 값에 값을 더한다.	a+=1	a=a+1
-=	기본 변수의 값에 값을 뺀다.	a-=1	a=a-1
*=	기본 변수의 값에 값을 곱한다	a*=1	a=a*1
/=	기본 변수의 값에 값을 나눈다.	a/=1	a=a/1
%=	기본 변수의 값에 나머지를 구한다.	a%=1	a=a%1

 

 

증감 연산자	설명
변수++	기존의 변수 값에 1을 더합니다.(후위)
++변수	기존의 변수 값에 1을 더합니다.(전위)
변수--	기존의 변수 값에 1을 뺍니다.(후위)
--변수	기존의 변수 값에 1을 뺍니다.(전위)

 

undefined 자료형-상수와 변수로 선언하지 않은 식별자typeof(a) > a는 선언되지 않은 상태로 undefined로 나옴-값이 없는 변수let(b) => 값 미지정 / (let b = 10 > 값 지정)typeod(b) > 값이 없으므로 undefined로 나온다.

 

p.116 자료형 변환

prompt(메시지 문자열, 기본 입력 문자열)

 

Number() // 다른것 → 숫자

String() // 다른것 → 문자열

Boolean() // 다른것 → 불

 

불 → 문자열

String(true)→"true"

String(false)→"false"

 

불 → 숫자

Number(true) → 1

Number(flase) → 0

 

1 → 켜져있다, 존재한다.

0 → 꺼져있다, 존재하지 않는다.

 

다른 자료형 → 불

5가지의 경우 → false

0, NaN, "", null, undefined

 

이외의 경우 → true

 

 

[기본숙제]

p.54 <파일 만들고 저장해 실행하기>에서 "Hello World"출력하기

 

[추가숙제]

Ch.01(01-1)확인 문제 1번 상세하게 적고 인증하기

(Statcounter/Browser Market Share Worldwide

https://gs.statcounter.com/browser-version-market-share/desktop/south-korea)

 

기능이 많다고 느낀 웹사이트

1. 유튜브

2. 크롬

3. 아마존

4. 네이버

5. 웨일

 

<2024.07.01 기준 2024.01-06 점유율>