오늘의 목표

더보기

✔️ 알고리즘 풀이 세션 듣기

✔️ 개인과제 발제 듣기


⏱️ 오늘의 일정

9:00 ~ 11:00 - 개인과제 발제, 알고리즘 풀이 세션

12:00 ~ 21:00 - 개인 과제 풀이


 

📜 개인과제 발제, 알고리즘 풀이 세션

9:00 ~ 11:00 - 개인과제 발제, 알고리즘 풀이 세션

 

어제 예고한대로 개인과제에 관한 설명과 알고리즘 풀이 세션이 있었다.

 

텍스트 게임

 

개인과제는 텍스트로 만드는 로그라이크 게임이였는데, 시작 화면은 위와 같다.

뼈대 코드는 제공되어서 그나마 편하게 구현할 수 있을 것 같다.

기간은 일주일로 충분히 주어진듯 하고, 필수 구현 목록과 도전 목록으로 구분되어 평가를 받는걸로 설명 받았다.

도전 목록까지 구현하고 제출하면 Node.js 강의를 지급받는다고 하는데, 이번주 안에 제출하는걸로 목표를 삼고

미리 Node.js 강의를 수강할 수 있도록 해야겠다.

 

알고리즘 풀이세션은 총 10문제가 주어졌는데, 아쉽게도 풀이는 총 4문제에 그쳤다.

10문제 모두 비교해보고 싶었는데 아쉽게 됐다. ㅠㅠ

 

원래는 여기에 코드를 다 올리려고 했으나, 난잡해 보일거 같아서 따로 글로 정리할 생각이다.


📜 개인 과제 풀이

9:00 ~ 11:00 - 개인 과제 풀이

 

기본 적인 뼈대가 제공되어서, 오늘은 플레이어의 공격과 몬스터의 공격까지 구현했다.

플레이어와 몬스터의 공통점이 많아서 Creature ( 생명체 ) 클래스를 만들어 부모로 삼았다.

class Creature {
    constructor() {
        this.name = null;
        this.weapon = null;
        this.inventory = [];
    }

    equipWeapon(weaponType) {
        switch (weaponType) {
            case '1':
                this.weapon = new MaceWeapon(this);
                break;
            case '2':
                this.weapon = new SwordWeapon(this);
                break;
            case '3':
                this.weapon = new TwohandSwordWeapon(this);
                break;
        }
    }

    attack(target) {
        if (this.weapon != null) {
            this.weapon.WeaponAttack(target);
        }
    }   

    OnDamage(damagePoint) {
        if (this.hp - damagePoint < 0) {
            this.hp = 0;
        }
        else {
            this.hp -= damagePoint;
        }
    }
}

 

 

플레이어의 공격과 몬스터 공격은 무기를 선택해 공격하는 방식으로 우선 구현했다.

플레이어는 게임 입장 전에 무기를 3가지 ( 둔기, 검, 대검 ) 중에 선택해 장착하고 공격을 하도록 했고,

몬스터는 공격을 할때마다 랜덤하게 3가지 무기 중 골라서 공격하는 방식으로 구현했다.

 

class Monster extends Creature {
    constructor() {
        super();
        
        this.name = "자바스크립트";
        this.hp = 1000;
        this.defensePoint = 0;
        this.criticalPoint = 0.6;
        this.inventory.push(new MaceWeapon(this));
        this.inventory.push(new SwordWeapon(this));
        this.inventory.push(new TwohandSwordWeapon(this));     
    } 

    attack(target) {
        let weaponChoiceNum = rand(0, 2);

        if (this.inventory.length > 0) {
            if (this.inventory[weaponChoiceNum] != null) {
                this.weapon = this.inventory[weaponChoiceNum];                

                this.weapon.WeaponAttack(target);
            }            
        }
    }
}

 

 

내일은 스테이지 클리어 조건과 랜덤하게 스테이지를 클리어 할때마다 추가 능력치를 부여할 생각이다.

 

🌙 하루를 마치며

오늘 드디어 개인과제가 시작되었다.

텍스트로 구현하는 게임은 경험이 좀 있어서 그런지 어떻게 구현할 지 생각이 바로바로 들었다.

자바스크립트로는 처음이기에 중간중간 막히는 부분은 튜터님이나 구글에 도움을 받아서

앞서 언급한대로 이번주 안에는 완성하는 것을 목표로 삼아야겠다.

Math.random()

 위 함수는 0 ~ 1 구간에서 부동소수점의 난수를 생성한다.

let rand1 = Math.random();
let rand2 = Math.random();

console.log(rand1);
console.log(rand2);

 

 

범위를 지정한 난수 생성

 정수인 난수를 생성하기 위해서는 Math.random() 함수와 Math.floor() 함수를 사용해 생성한다.

 Math.floor() 함수는 소수점 1번째 자리를 버려서 정수를 반환해주는 함수다.

let rand = Math.floor(Math.random());
console.log(rand); // 0

let rand2 = Math.floor(Math.random() * 10);
console.log(rand2); // 0 ~ 9

let rand3 = Math.floor(Math.random() * 11);
console.log(rand3); // 0 ~ 10

let rand4 = Math.floor(Math.random() * 100);
console.log(rand4); // 0 ~ 99

let rand5 = Math.floor(Math.random() * 10 ) + 1;
console.log(rand5); // 1 ~ 10

 

min 이상 max 이하 범위 안에서 랜덤하게 수 반환

function rand(min, max){
	return Math.floor(Math.random() * (max - min)) + min;
}

 

  

'Javascript' 카테고리의 다른 글

[Javascript] 화살표함수  (0) 2024.08.22
[Javascript] 프로토타입 ( Prototype )  (0) 2024.08.22
[Javascript] Map  (0) 2024.08.19
[Javascript] 소수 올림, 내림, 반올림  (0) 2024.08.19
[Javascript] this  (0) 2024.08.14

오늘의 목표

더보기

✔️ 알고리즘 세션 듣기

✔️ 알고리즘 도전 1일, 2일차 문제 풀기


⏱️ 오늘의 일정

9:00 ~ 10:00 - 알고리즘 세션 듣기
10:00 ~ 13:00 - 병원

13:00 ~ 16:00 - 알고리즘 도전 1일, 2일차 문제 풀기

16:00 ~ 17:00 - 자바스크립트 세션

17:00 ~ 21:00 - 알고리즘 도전 1일, 2일차 문제 풀기


📜 알고리즘 세션 듣기

9:00 ~ 10:00 - 알고리즘 세션 듣기

 

어제에 이어 오늘도 알고리즘 세션이 준비되어서 강의를 들었다.

알고리즘 문제가 제시되면 접근하는 방법과 연습문제를 제시하고 같이 풀어보는 방식으로 진행했다.

 

📜 병원

10:00 ~ 13:00 병원

 

엄마의 건강 이슈로 인해 병원에 다녀왔다.

정말 다행히도 우려했던 것과는 다르게 전달 받은 건강에 대한 정보가 너무 좋아서 한시름 놓게 되었다. 

계속 신경 쓰여서 걱정이 너무 되었는데, 온전히 공부에만 집중할 수 있을 것 같아 매우 다행이다.


📜 자바스크립트 세션

16:00 ~ 17:00 - 자바스크립트 세션

 

집에 도착해서 알고리즘 문제를 풀고 있을 때, 슬랙으로 16:00 부터 자바스크립트 세션이 있다고 전달받았다.

같이 수업받는 사람들이 공통적으로 어려워하는 부분을 파악하고, 해당 주제를 집중적으로 다루는 세션이였다.

 

this, 호이스팅, 동기, 비동기, promise 등에 관한 내용이였고, 도움이 되었다.


📜 알고리즘 도전 1일, 2일차 문제 풀기

13:00 ~ 16:00 - 알고리즘 도전 1일, 2일차 문제 풀기

17:00 ~ 21:00 -  알고리즘 도전 1일, 2일차 문제 풀기

 

어제에 이어서 알고리즘 2일차 문제 5가지가 제시되었다.

 

문제 1

주어진 문자열에서 중복된 문자를 제거하고, 남은 문자들을 원래 순서대로 반환하는 함수를 작성하세요.

제한사항:

  • 문자열의 길이는 1 이상 1000 이하입니다.

예시) const s = "abbccdeff"; // 출력 : "abcdef"

문제 2

 

주어진 배열에서 최솟값과 최댓값을 찾고, [최솟값, 최댓값] 형태의 배열을 반환하는 함수를 작성하세요.

제한사항:

  • 배열의 길이는 1 이상 1000 이하입니다.
  • 배열의 원소는 -1000 이상 1000 이하의 정수입니다.

예시) const arr = [1,2,3,4,5,6]; // 출력 [1,6]

 

문제 3

주어진 문자열을 요약하는 함수를 작성해주세요!

 

예시) str = 'aaabbbc' // 출력 : 'a3/b3/c1'

 

 

문제 4

주어진 배열에서 두 수를 선택하여 그 합이 주어진 target 값과 일치하는지 확인하는 함수를 작성하세요. 일치하는 경우 true, 그렇지 않은 경우 false를 반환하세요.

제한사항:

  • 배열의 길이는 2 이상 1000 이하입니다.
  • 배열의 원소는 1 이상 1000 이하의 자연수입니다.

예시) arr = [2,7,11,15], target = 9 // 출력 : true

 

문제 5

주어진 문자열이 유효한 괄호 조합인지 확인하는 함수를 작성하세요. 유효한 조합은 모든 여는 괄호가 올바르게 닫혀야 하며, 괄호의 순서도 일치해야 합니다.

제한사항:

  • 문자열의 길이는 1 이상 1000 이하입니다.
  • 괄호는 (), {}, []의 세 종류입니다.

예시) ({[]}] // 출력 : true

         ({][}) // 출력 : false

 


🌙 하루를 마치며

엄마 건강에 걱정이 많았는데 잘 해결된거 같아 정말 다행이다. 정말로.. ㅠㅠ

 

어제 오늘 제시된 알고리즘 10문제를 모두 풀기는 했다. 내일 9시에 있을 문제 풀이를 듣고,내가 풀이한 것과 튜터님의 풀이 방법을 비교해 글을 게시할 생각이다.

 

내일 또한 개인과제에 대한 설명이 있다고 전달 받았다. 기간은 일주일동안 과제를 풀어 제출해야한다고 하는데,자바스크립트를 처음 접해 걱정도 되고 기대도 된다.. 

 

오늘의 목표

더보기

✔️ 알고리즘 세션 듣기

✔️ 자바스크립트 수업 정리하기


⏱️ 오늘의 일정

9:00 ~ 10:30 - 알고리즘 세션
10:30 ~ 11:00 - 팀 배정

11:00 ~ 18:00 - 자바스크립트 수업 정리

18:00 ~ 21:00 - 알고리즘 과제 풀이


📜 알고리즘 세션

9:00 ~ 10:30 - 알고리즘 세션

 

미리 공지된 대로 알고리즘 세션이 9시 부터 있었고, 세션에 참가해 수업을 들었다.

기초적인 알고리즘에 관한 설명과 간단한 퀴즈를 내고 맞추는 세션이였다.

 

📜 팀 배정

10:30 ~ 11:00 - 팀 배정

 

저번주 금요일에 전체공지로 희망하는 팀을 구글폼으로 제출하라는 공지가 있었다.

자바스크립트 수강 여부에 따라 도전 팀과 집중팀으로 나눠 신청을 하라는 내용이였다.

자바스크립트 강의를 5주차까지 끝내긴해서 도전팀으로 신청하고, 도전 팀으로 배정받았다.

 

📜 자바스크립트 수업 정리

11:00 ~ 18:00 - 자바스크립트 수업 정리

 

다행히도 주말동안 5주차까지 강의를 모두 들어서,

자바스크립트 강의를 정리하고 있다. 

 

2024.08.19 - [Javascript] - [Javascript] 소수 올림, 내림, 반올림

 

[Javascript] 소수 올림, 내림, 반올림

올림 ( Math.ceil() )소수점 여부와 상관없이 올림 처리 한다.입력받은 수보다 크거나 같은 정수 중 가장 작은 정수를 반환한다. // 양수let ceil_1 = Math.ceil(1); // 1let ceil_2 = Math.ceil(1.22); // 2let ceil_3 = Mat

program-yam.tistory.com

 

2024.08.19 - [Javascript] - [Javascript] Array - push, pop, unshift, shift

 

[Javascript] Array - push, pop, unshift, shift

Array ( 배열 ) 기본 생성// 기본 생성let fruits = ["사과", "바나나", "오렌지"];// 배열 요소 접근console.log(fruits[0]); // "사과"  크기를 지정해 생성let number = new Array(5); push ( 데이터를 맨뒤에 넣기 )let f

program-yam.tistory.com

 

2024.08.19 - [Javascript] - [Javascript] Array - splice, slice

 

[Javascript] Array - splice, slice

splice 시작 위치부터 지정한 개수를 삭제하고, 시작 위치에 데이터를 넣는다.let fruits = ["배", "감", "귤", "두리안"]; // [1] 위치 : '감' 부터 2개( 감, 귤 )를 삭제하고 [1] 위치에 자두를 넣는다. fruits.s

program-yam.tistory.com

 

2024.08.19 - [Javascript] - [Javascript] Array - sort, reverse

 

[Javascript] Array - sort, reverse

sort ( 정렬 함수 )array.sort([compareFunction]) 매개변수 - compareFunction   - 정렬 순서를 정의하는 함수.     생략하면 배열은 각 요소의 문자열 반환에 따라 각 문자의 유니코드 포인트 값에 따라 정

program-yam.tistory.com

 

2024.08.19 - [Javascript] - [Javascript] Map

 

[Javascript] Map

Map은 키와 값으로 데이터를 저장하고 관리하는 객체다.key에는 어떤 데이터타입도 다 들어올 수 있다.Map은 키가 정렬된 순서로 저장된다. // 기본 형태let MyMap = new Map();// set(키,값) 데이터를 저장

program-yam.tistory.com

 

2024.08.19 - [분류 전체보기] - [Javascript] Set

 

[Javascript] Set

Set은 원시 값이나 객체 참조 값 등 모든 유형의 고유 값을 저장할 때 사용하는 객체다. 선언let mySet = new Set(); add ( 데이터 넣기 )Set에 데이터를 넣는다. 해당 값이 중복되면 데이터가 저장되지

program-yam.tistory.com

 

 

 

📜 알고리즘 과제 풀이

18:00 ~ 21:00 - 알고리즘 과제 풀이

 

알고리즘 세션을 듣고나서 1회차 문제가 제공되었다.

 

문제 1


두 자연수 a와 b가 주어질 때, 이 둘의 최대공약수를 구하는 함수를 작성하세요.

제한사항:

  • a, b는 1 이상 1000 이하의 자연수입니다.

 

문제 2


주어진 배열에서 짝수와 홀수의 개수를 각각 세는 함수를 작성하세요. 함수는 [짝수 개수, 홀수 개수]의 배열을 반환해야 합니다.

제한사항:

  • 배열의 길이는 1 이상 1000 이하입니다.
  • 배열의 원소는 1 이상 1000 이하의 자연수입니다.

 

문제 3


문자열이 주어지면 해당 문자열을 역순으로 배치한 후, 알파벳을 하나씩 오른쪽으로 이동시킨 결과를 출력하세요. 예를 들어, a는 b, z는 a로 변환됩니다.

제한사항:

  • 문자열은 소문자 알파벳으로만 구성됩니다.
  • 문자열의 길이는 1 이상 1000 이하입니다.

 

문제 4


회전 초밥을 먹을 때, 접시들의 번호가 주어집니다. 이 중에서 임의의 연속된 접시를 선택하여 먹을 때, 가능한 모든 선택에서 가장 다양한 초밥 종류의 개수를 구하세요.

제한사항:

  • 접시의 개수는 2 이상 1000 이하입니다.
  • 각 접시는 1 이상 30 이하의 정수로 표현됩니다.

 

문제 5


양의 정수가 주어질 때, 숫자에서 **k**개의 자릿수를 제거하여 얻을 수 있는 가장 큰 수를 구하세요.

제한사항:

  • **number**는 최대 1,000,000자리까지 입력될 수 있습니다.
  • **k**는 1 이상 len(number) - 1 이하입니다.

 

🌙 하루를 마치며

 

본격적인 알고리즘 문제 풀이의 시작!

오늘과 내일, 다음주 월, 화까지 알고리즘 세션이 잡혀있다.

그리고 이제부터 매일 10 : 00 ~ 11 : 00 가 알고리즘 문제 푸는 시간으로 정해졌다.

세션을 들어 알고리즘 문제 풀이에 도움을 받고, 따로 유튜브로 듣고 있는 강의도 꾸준히 들어야겠다.

 

선택 정렬

 

선택 정렬( Selection Sort )은 버블 정렬과 유사한 알고리즘으로, 해당 순서에 원소를 넣을 위치는 이미 정해져 있고, 어떤 원소를 넣을지 선택하는 알고리즘이다. 선택 정렬과 삽입 정렬를 헷갈릴 수 있는데, 선택 정렬은 배열에서 해당 자리를 선택하고 그 자리에 오는 값을 찾는 것이라고 생각하면 된다.

 

선택 정렬은 3가지의 과정을 반복하며 정렬을 수행한다.

 1. 선택한 곳의 데이터보다 더 작은 데이터가 있는지 순환하며 찾는다.

 2. 구한 가장 작은 최솟값을 맨 앞에 위치한 값과 교체한다.

 3. 맨 앞의 위치를 하나씩 앞으로 옮겨가며 반복한다.

 

#include<iostream>
using namespace std;

int main()
{
	int Array[] = { 10,9,8,7,6,5,4,2,3,1 };
	int MinIndex;
	int Number;

	for (int i = 0; i < 9; i++)
	{
        // 맨 앞 위치 선택
		MinIndex = i;

		for (int j = i + 1; j < 10; j++)
		{
            // 선택한 위치 값과 다른 위치 값들비교
            // 더 작은 값이 있으면 위치값 갱신
			if (Array[MinIndex] > Array[j])
			{				
				MinIndex = j;
			}
		}
        
        // 한번 반복하고 나면 스왑
		swap(Array[i], Array[MinIndex]);
	}

	return 0;
}

 

 

시간복잡도

데이터의 개수가 n개라고 할 경우,

  • 첫 번째 회전에서의 비교횟수 : 1 ~ ( n - 1 ) => n - 1
  • 두 번째 회전에서의 비교횟수 : 2 ~ ( n - 1 ) => n - 2
  • ...
  • (n-1) + (n-2) + ... + 2 + 1 => n(n-1) / 2

비교하는 것이 상수 시간에 이루어진다는 가정 아래에서 n개의 주어진 배열을 정렬하는데

O( n^2 ) 만큼의 시간이 걸린다. 최선, 평균, 최악의 경우 시간복잡도는 O( n^2 )로 동일하다.

 

공간복잡도

주어진 배열 안에서 교환(swap)을 통해, 정렬이 수행되므로 O(n) 이다.

버블 정렬

 

버블 정렬이란, 두 인접한 데이터를 비교하여 앞에 있는 데이터가 뒤에 있는 데이터보다 크면

자리를 바꾸는 정렬 알고리즘을 말한다.

 

이름의 유래는 정렬 과정에서 원소의 이동이 거품이 수면으로 올라오는 듯한 모습을 보이기 때문에 지어졌다고 한다.

 

버블 정렬 알고리즘의 구체적인 방법

  • 버블 정렬은 첫 번째 자료와 두 번째 자료를, 두번째 자료와 세 번째 자료를 .. 이런 식으로 ( 마지막 - 1 )번째 자료와 마지막 자료를 비교해 교환하면서 자료를 정렬한다.
void BubbleSort(int list[], int n)
{
	for (int i = 0; i < n; i++)
	{
		for (int j = 0; j < n - 1; j++)
		{
			// 현재 위치와 앞 위치 데이터 비교
			// 현재 위치 데이터가 더 크면 스왑
			if (list[j] > list[j + 1])
			{
				swap(list[j], list[j + 1]);
			}
		}
	}
}

 

시간복잡도

시간복잡도를 계산하면, ( n - 1 ) + ( n - 2 ) + ( n -3 ) + .... + 2 + 1 => n(n-1)/2 이므로, O(n^2)다.

또한, Bubble Sort는 정렬이 되어있던 안되어있던, 2개의 원소를 비교하기 때문에 최선, 평균, 최악의 경우 모두

시간 복잡도가 O(n^2)로 동일하다.

 

공간복잡도

주어진 배열 안에서 교환(swap)을 통해, 정렬이 수행되므로 O(n)이다.

 

 

장점

  • 구현이 간단하고, 소스코드가 직관적이다.
  • 정렬하고자 하는 배열 안에서 교환하는 방식이므로, 다른 메모리 공간을 필요로 하지 않는다. ( 제자리 정렬 )
  • 안정 정렬(Stable Sort)이다.

 

단점

  • 시간복잡도가 최악, 최선, 평균 모두 O(n^2)으로, 굉장히 비효율적이다.
  • 정렬 되어있지 않은 원소가 정렬 되었을때의 자리로 가기 위해, 교환 연산(swap)이 많이 일어나게 된다.

 

 

 

Set은 원시 값이나 객체 참조 값 등 모든 유형의 고유 값을 저장할 때 사용하는 객체다.

 

선언

let mySet = new Set();

 

add ( 데이터 넣기 )

Set에 데이터를 넣는다. 해당 값이 중복되면 데이터가 저장되지 않는다.

let mySet = new Set();

// 데이터 넣기
mySet.add(1);
mySet.add(2);
mySet.add(2); // 데이터가 중복되므로 저장되지 않는다.

 

delete ( 데이터 삭제 )

Set에서 데이터를 삭제한다. 데이터 삭제에 성공하면 true를 반환하고 실패하면 false를 반환한다.

let mySet = new Set();

// 데이터 넣기
mySet.add(1);
mySet.add(2);

// 데이터 삭제하기
mySet.delete(1); // true
mySet.delete(3); // false

 

clear ( 데이터 모두 삭제 )

Set에 저장되어 있는 데이터 전부를 삭제한다. 삭제에 성공하면 true, 실패하면 false를 반환한다.

let mySet = new Set();

// 데이터 넣기
mySet.add(1);
mySet.add(2);

// 데이터 모두 삭제하기
mySet.clear(); // true

 

Set 순회하기

let mySet = new Set();

mySet2.add(1);
mySet2.add(2);

// 데이터 순회하기
for (let item of mySet) {
  console.log(item);
}

for (let item of mySet.values()) {
  console.log(item);
}

 

 

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Set

 

Set - JavaScript | MDN

Set 객체는 원시값이나 객체 참조 값 등 모든 유형의 고유 값을 저장할 때 사용할 수 있습니다.

developer.mozilla.org

 

Map은 키와 값으로 데이터를 저장하고 관리하는 객체다.

key에는 어떤 데이터타입도 다 들어올 수 있다.

Map은 키가 정렬된 순서로 저장된다.

 

// 기본 형태
let MyMap = new Map();

// set(키,값) 데이터를 저장
MyMap.set("one",1);
MyMap.set("two",2);
MyMap.set("three",3);

// 키로 값 출력
// MyMap.get("one"); // 1

// 키로 데이터 삭제
// MyMap.delete("two");

// 키 출력
console.log(MyMap.keys());
for (key of MyMap.keys()) {
    console.log(key);
}

// 값 출력
console.log(MyMap.values());
for (value of MyMap.values()) {
    console.log(value);
}

// 키, 값 출력
console.log(MyMap.entries());
for (entri of MyMap.entries()) {
    console.log(entri);
}

// 길이 (= 크기) 출력
console.log(MyMap.size); // 2
// 키 찾기
console.log(MyMap.has("three")); // true

// 모든 데이터 삭제
MyMap.clear();

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Map

 

Map - JavaScript | MDN

Map 객체는 키-값 쌍과 키의 원래 삽입 순서를 기억합니다. 모든 값(객체 및 원시 값 모두)은 키 또는 값으로 사용될 수 있습니다.

developer.mozilla.org

 

'Javascript' 카테고리의 다른 글

[Javascript] 프로토타입 ( Prototype )  (0) 2024.08.22
[Javascript] Random - 난수 생성하기  (0) 2024.08.21
[Javascript] 소수 올림, 내림, 반올림  (0) 2024.08.19
[Javascript] this  (0) 2024.08.14
[Javascript] var, let, const  (0) 2024.08.12

join ( 배열을 문자열로 변환 )

배열의 모든 요소들을 연결한 문자열을 반환한다.

각각의 요소들 사이에 매개변수로 입력한 구분자가 들어간다.

구분자를 입력하지 않으면 기본값으로 , 가 들어간다.

 

let fruits = ["사과", "배", "수박"];

let str1 = fruits.join();
let str2 = fruits.join('-');
let str3 = fruits.join('');

console.log(str1); // 사과,배,수박
console.log(str2); // 사과-배-수박
console.log(str3); // 사과배수박

 

Array.from ( 문자열을 배열로 변환 )

문자열을 배열로 변환해 반환한다.

 

let number1 = "123";
console.log(Array.from(number)); // ['1','2','3']

let str = "abc";
console.log(Array.from(str)); // ['a','b','c']

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/join

 

Array.prototype.join() - JavaScript | MDN

Array 인스턴스의 Join() 메서드는 배열의 모든 요소를 쉼표나 지정된 구분 문자열로 구분하여 연결한 새 문자열을 만들어 반환합니다. 배열에 항목이 하나만 있는 경우, 해당 항목은 구분 기호를

developer.mozilla.org

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/from

 

Array.from() - JavaScript | MDN

Array.from() 정적 메서드는 순회 가능 또는 유사 배열 객체에서 얕게 복사된 새로운 Array 인스턴스를 생성합니다.

developer.mozilla.org

 

sort ( 정렬 함수 )

array.sort([compareFunction])

 

매개변수

 - compareFunction

   - 정렬 순서를 정의하는 함수.

     생략하면 배열은 각 요소의 문자열 반환에 따라 각 문자의 유니코드 포인트 값에 따라 정렬된다.

   - 해당 함수는 2개의 요소 ( a, b )를 입력 받는다.

   - 해당 함수가 반환하는 값이 0보다 작을 경우, a가 b보다 앞에 오도록 정렬하고,

     해당 함수가 반환하는 값이 0보다 클 경우, b가 a보다 앞에 오도록 정렬한다.

     해당 함수가 0을 반환하면, a와 b의 순서를 변경하지 않는다.

 

파라미터 함수를 입력하지 않고 정렬

let numbers = [2,1,3,10];

arr.sort();

console.log(numbers); // 1 10 2 3

 

파라미터 함수를 입력하지 않고 정렬하면 위처럼 유니코드 포인트 값에 따라 정렬한다.

 

오름차순으로 정렬

let numbers = [ 9, 8, 7, 6];

numbers.sort((a, b) => a - b); 

console.log(numbers); // 6 7 8 9

 

 

내림차순으로 정렬

let numbers = [6, 7, 8, 9];

numbers.sort((a, b) => b - a));

console.log(numbers); // 9 8 7 6

 

reverse ( 배열 뒤집기 )

let numbers = [1,2,3,4,5];

numbers.reverse();

console.log(numbers); // 5 4 3 2 1

 

원본 배열 유지하고 뒤집기

let number = [1,2,3,4,5];

let reverseNumber = [...number].reverse();

console.log(number);
console.log(reverseNumber);

 

전개 구문인 ...을 이용해 복사본을 뒤집어서 reverseNumber에 저장한다.

이렇게 하면 원본 배열을 유지할 수 있다.

 

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

 

Array.prototype.sort() - JavaScript | MDN

sort() 메서드는 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환합니다. 정렬은 stable sort가 아닐 수 있습니다. 기본 정렬 순서는 문자열의 유니코드 코드 포인트를 따릅니다.

developer.mozilla.org

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse

 

Array.prototype.reverse() - JavaScript | MDN

reverse() 메서드는 배열의 순서를 반전합니다. 첫 번째 요소는 마지막 요소가 되며 마지막 요소는 첫 번째 요소가 됩니다.

developer.mozilla.org

 

 

+ Recent posts