[Elice AI_4기] 2주차 내용 정리

Hyes_y·2022년 2월 3일

엘리스_AI_4기

목록 보기

2/6

2주차 학습 내용 정리

2022.01.18 - 2022.01.22
몰랐던 것 위주로 정리

 javascript(기초)

🚩 Javascript

이미지 슬라이드 효과, 팝업 효과 등의 기능을 포함한
동적인 웹사이트 제작시 사용되는 프로그래밍 언어

1. 변수 선언

🥕 var let const 를 사용하여 변수 선언 가능

var : 이미 선언된 변수라도 재선언 가능
let : 이미 선언되어 있다면 재선언 불가, 초기화는 가능
const : 재선언, 재할당 불가능(상수(변하지 않는 값)에 사용)

ex>
var num;   // 변수 선언

// 변수 선언 및 초기화
var num = 1;	
let cnt = 1;
const pi = 3.14;

2. 데이터 타입

String : 문자열
Number : 숫자(정수(음수 포함), 실수)
Function : 함수
Array : 배열
Object : 객체
Boolean : 논리값(true/false)
undefined : 정의되지 않음 (변수가 선언되고 초기화는 이루어지지 않은 경우)
null : 널(의도적으로 빈 데이터로 초기화한 경우)

✔ 문자열의 경우 큰따옴표 혹은 작은 따옴표가 데이터에 포함이라면 앞에 \ 를 붙임
✔ 주석은 한 줄일 경우 // 여러 줄일 경우 /* */ 사용

🥕 함수 생성 방법

변수 초기화로 함수 지정
함수 키워드로 직접 생성

var myfunc = function(){
  return "my func!";
}

myfunc();  // my func!

function myfunc(){
  return "my func!";
}

myfunc();  // my func!

🥕 객체(Object)

프로퍼티와 메서드, 데이터로 이루어짐
여러 종류의 데이터 삽입 가능

var student = {
  name: "sun",
  age: "20",
  family: ['moon', 'star', 'earth'],
  message: function(num1, num2){ return `${num1} + ${num2} = ${num1 + num2} 입니다` }
} 
// name, age, family 는 프로퍼티, message는 메서드
// 문자열 안에 변수 넣을 경우 백틱으로 감싼 문자열 안에 ${변수} 형식으로 작성

console.log(student.name) // sun
console.log(student['family']) // 배열 리턴
console.log(student.message(1, 2)) // 1 + 2 = 3 입니다

3. 자바스크립트의 데이터 타입별 프로퍼티/ 메서드

🥕 문자열 프로퍼티 / 메서드

String.length : 문자열 길이 반환
String.charAt(index) : 문자열의 해당 인덱스의 글자 반환
String.split() : 괄호 안에 주어진 값을 기준으로 분리 후 배열로 반환(아무것도 없는 경우 글자별로 나눔)
String.match(정규표현식) : 정규 표현식에 해당하는 부분을 배열로 리턴

✔ 정규 표현식
✔ 더 많은 문자열 메서드 및 프로퍼티

🥕 배열 프로퍼티 / 메서드

Array.length : 배열 길이 반환
Array.push : 배열 맨 뒤에 요소 삽입
Array.pop : 배열 맨 뒤 요소 제거
Array.unshift : 배열 맨 앞에 요소 삽입
Array.shift : 배열 맨 앞에 요소 제거
Array.splice(index, cnt) : 해당 index로부터 cnt개수만큼을 제거
Array.join() : 배열을 콤마(기본값)를 기준으로 이어붙임, 공백으로 잇고 싶은 경우 괄호 안에 ' '를 입력
Array.sort() : 배열을 정렬(기본값 → 유니코드 값으로 정렬)
숫자의 오름차순, 내림차순 등으로 배열하기 위해선 매개변수로 함수를 넘겨주어야 함

function compareNumbers(a, b) {
    return a - b;
}
// 오름차순 정렬, 내림차순으로 하고 싶을 때는 return b - a;

arr.sort(compareNumbers)

✔ 정렬 방식 참고 블로그 https://hianna.tistory.com/409
✔ 더 많은 배열 메서드 및 프로퍼티

🥕 그 외

Math.abs(num) : num의 절댓값 반환
Math.ceil(num) : num의 올림값 반환
Math.floor(num) : num의 내림값 반환
Math.random() : 0에서 1 사이에 랜덤값 반환
parseInt(sth) : sth를 정수로 변경(값이 숫자인 문자열인 경우)
parseFloat(sth) : sth를 실수로 변경(값이 숫자인 문자열인 경우)

✔ 콘솔로 입력 받을 경우

//콘솔을 통해 값을 입력 받기 위해서는 readline 모듈 사용
const readline = require("readline");

//readline 모듈을 이용해 입출력을 위한 인터페이스 객체 생성
const rl = readline.createInterface({
  input: process.stdin,
  output: process.stdout,
});

//rl 변수는 아래와 같이 이용
  rl.on("line", (line) => { 
      // 한 줄씩 입력받은 후 실행할 코드
     // 입력된 값은 line에 저장된다.
      rl.close(); // close가 없으면 입력을 무한히 받는다.
  });
  rl.on('close', () => {
    // 입력이 끝난 후 실행할 코드
  })

4. 연산자

1. 산술 연산자

+, -, *, /, %(나머지)
문자 <연산자> 숫자(or 문자) 형태일 때 +를 제외한 다른 연산은 문자가 숫자로 바뀜

// ex>
let a = "5";
let b = 3;

console.log(a+b); // 53
console.log(a-b); // 2
console.log(a*b); // 15
console.log(a/b); // 1.66666..
console.log(a%b); // 2

2. 증감 연산자(++, --)

num++, num--, ++num, --num 이 있음
기호가 앞에 붙은 경우 먼저 1씩 더한 후 코드 실행
뒤에 붙은 경우 코드 먼저 실행 후 1씩 더함

// ex>
let num = 3;

console.log(++num); // 4
console.log(num++); // 4(위에서 더했음) => num = 5
console.log(++num); // 6

3. 비교 연산자

==, ===, !=, !==, >, >=, <, <=
== : 값이 같다(같지 않다 !=)
=== : 데이터 타입과 값이 같다(같지 않다 !==)
>, >=, <, <=

✔ 두 값을 비교할 때 ==은 데이터 타입을 동일하게 만든 뒤 비교,
=== 은 데이터 타입까지 동일한지 비교

4. 논리 연산자

&&(and), ||(or)

5. 조건문 / 반복문

1. 조건문

🥕 if문 / switch문

/* if (조건) { 수행할 명령 } 
else if (조건) { 수행할 명령 } 
else { 수행할 명령 } */
const num = 10;

if (num > 10) { console.log("10보다 큽니다");}
else if ( num == 10) { console.log("10입니다");}
else { console.log("10보다 작습니다");}
// 10입니다

/* switch(비교대상) { 
	case (value) : 
		비교 대상이 value일때 수행할 명령 
        break;(안하면 멈추지 않고 다음 케이스로 또 넘어감)
    ...
    default :
    	위에서 매치되는 케이스가 없는 경우 수행할 명령
  } */

switch(num){
  case 10:
    console.log("10입니다");
    break;
  case 0:
    console.log("0입니다");
    break;
  default:
    console.log("10도 아니고 0도 아닙니다");
}
// 10입니다

2. 반복문

🥕 for문 / while문 / do-while문

// for (초기값; 조건 ; 증감 표시) { 수행할 명령 }
for (let i = 0; i < 10; i++) {
  if (i % 3 == 0) console.log(i);
} // 3, 6, 9


// while (조건) { 수행할 명령 }
var i = 0
while (i < 5) {
  console.log(i);
  i++;
} // 0, 1, 2, 3, 4


// do { 수행할 명령 } while(조건)
var num = 5;
do { console.log(num)} while ( num < 5 ); 
// 5