[JS] JavaScript 기초 문법

자료형

Number, String, Boolean, Object, undefined와 null

Number

• 정수, 실수 구분 x, 숫자를 나타내는 자료형
• 64bit로 실수와 정수 모두 표현 가능
• 정상적이지 않는 숫자나 표현할 수 없는 범위의 수를 표시하는 NaN, Infinity

parseInt, parseFloat 명령어

• 문자열 숫자로 변환 가능
  Number() 기능과 비교 설명
• 명령어 뒤에 따라오는 괄호 안에 있는 문자열의 앞에서부터 Number를 인식함
  ex) parseInt("185.3 입니다") = 183
  parseFloat("185.3 입니다") = 185.3
  parseInt("키는 185.3입니다.") = NaN
  
  

String

• 특정 위치의 문자열 알아내기
  - 첫 문자 : str.charAt(0)
  - 마지막 문자 : str.charAt(str.length-1)
• 부분문자열 구하기
  - .substring(pos1, pos2) : pos1 에서 pos2까지의 부분 문자열 반환
  - .substr(pos, length) : pos에서 length길이 만큼의 부분 문자열 반환
  pos 가 음수인 경우, str.length - pos 로 동작
• 문자열 검색하기
  - indexOf(str), lastIndexOf(str)
  
  

Object

• number, string, boolean의 단순 자료형보다 더 복잡한 자료를 표현
• 객체 속성 접근: 객체이름.속성이름 / 객체이름["속성이름"]
• Object.keys(obj) : 속성이름 배열로 반환
  - for in 문으로 객체의 각 엘리먼트에 접근 가능
  - for (var propertyName in obj) {}
  
  

undefined

• 시스템에서 어떤 변수나 속성이 정의되지 않은 경우를 표현하기 위해 사용
• 선언만 하고 초기화가 되지 않는 변수의 타입이나 값
• 객체의 정의되지 않은 속성의 타입이나 값

null

• 개발자가 명시적으로 아무것도 없는 비어있는 상태를 나타낼 때 사용
• typeof의 결과는 object이며 값은 null

---

연산자

Math 관련 명령어

• Math.pow(A,b) : A의 B승을 구해 줌
• Math.sqrt(A) : A의 제곱근을 구해 줌

우선순위 순으로 정리한 연산자

• ( ++ -- ) -> ( ! ) -> ( * / % ) -> ( + - ) -> ( < <= > >= ) -> ( == != ) -> ( && ) -> ( || )

---

배열

배열 관련 함수

기본적으로 배열의 앞과 뒤에서 엘리먼트를 추가하거나 삭제할 수 있음.

• .push(element) : 배열의 뒤에 엘리먼트 추가
• .pop() : 배열의 뒤에서 엘리먼트 삭제하고 리턴
• .shift() : 배열의 앞에서 엘리먼트 삭제하고 리턴
• .unshift(element) : 배열의 앞에 엘리먼트 추가

배열 붙이기, 검색하기

• arr1.concat(arr2) : arr1과 arr2 붙임
• arr.indexOf(element) : arr에서 element가 있는 첫 위치를 검색
• arr.lastIndexOf(element) : arr에서 element가 있는 마지막 위치를 검색
• .split(""): 문자열을 구분자(separator)로 나눠서 각각을 담은 배열을 반환
  
  

유용한 10가지 배열 함수들, Array APIs 총정리

1. .join

• 구분자 전달

// Q1. make a string out of an array
{
  const fruits = ['apple', 'banana', 'orange'];
  const result = fruits.join('^')); // apple^banana^orange
}

2. .split

• 구분자 전달

// Q2. make an array out of a string
{
  const fruits = '🍎, 🥝, 🍌, 🍒';
  const result = fruits.split(','); 
}

3. .reverse

• 배열 자체를 변환

// Q3. make this array look like this: [5, 4, 3, 2, 1]
{
  const array = [1, 2, 3, 4, 5];
  const result = array.reverse();
}

4. .slice & .splice

// Q4. make new array without the first two elements
{
  const array = [1, 2, 3, 4, 5];
  const result = array.slice(2, 5); // [3, 4, 5]
  console.log(array); // [1, 2, 3, 4, 5]
  const result2 = array.splice(0, 2); // [1, 2]
  console.log(array); // [3, 4, 5]
}

class Student {
  constructor(name, age, enrolled, score) {
    this.name = name;
    this.age = age;
    this.enrolled = enrolled;
    this.score = score;
  }
}
const students = [
  new Student('A', 29, true, 45),
  new Student('B', 28, false, 80),
  new Student('C', 30, true, 90),
  new Student('D', 40, false, 66),
  new Student('E', 18, true, 88),
];

5. .find

// Q5. find a student with the score 90
{
	const result = students.find((student) => student.score === 90);
    });
    console.log(result);
}

6. .filter

// Q6. make an array of enrolled students
{
	const result = students.filter((student) => student.enrolled);
}

7. .map

// Q7. make an array containing only the students' scores
// result should be: [45, 80, 90, 66, 88]
{
	const result = students.map((student) => student.score);
}

8. .some & .every

// Q8. check if there is a student with the score lower than 50
{
	const result = students.some((student) => student.score < 50);
    console.log(result); // 조건이 하나라도 만족한다면 true 반환
}

9. .reduce & .reduceRight

• 배열에 있는 요소 누적할 때 사용
• .reduceRight: 역순으로 적용

// Q9. compute students' average score
{
	const result= students.reduce((prev, curr) => prev + curr.score, 0);
    console.log(result/students.length); 
}

10. .sort

// Q10. make a string containing all the scores + sorted in ascending order
// result should be: '45, 80, 90, 66, 88'
{
	const result = students.map((student) => student.score).join();
    // 필요한 배열 생성 후 join
    const result2 = students.map((student) => student.score).sort((a,b) => a-b).joi();
}