\(@^0^@)/

[TDL] 05/10 Today's-Done-List 본문

TDL

[TDL] 05/10 Today's-Done-List

minjuuu 2022. 5. 11. 00:14
728x90

 

- 자료구조 / 알고리즘 (Js ver.) 강의

  • 괄호 계산
    1. '()'인 괄호 열 값은 2
    2. '[]'인 괄호 열 값은 3
    3. '(X)'인 괄호 값은 2 * 값 (X)로 계산
    4. '[X]'인 괄호 값은 3 * 값 (X)로 계산
    5. 괄호형 X와 Y가 결합된 XY는 값(XY) = 값(X) + 값(Y)으로 계산
    6. 예를 들어 ()[[]]는 2 + 3 * 3 = 11이 나오며, ([])의 값은 2 * 3으로 6.
let result = 0;
let stack = [];
let temp = 1;

for (let i = 0; i < str.length; i++) {
    let mark = str[i];
    switch (mark) {
        case "(":
            temp *= 2;
            stack.push(mark);
            break;

        case "[":
            temp *= 3;
            stack.push(mark);
            break;

        case ")":
            if (stack.length == 0 || stack[stack.length - 1] != "(") {
                return 0;
            }
            if (mark[i - 1] == "(") {
                result += temp;
                temp /= 2;
                break;
            }
        case "]":
            if (stack.length == 0 || stack[stack.length - 1] != "[") {
                return 0;
            }
            if (mark[i - 1] == "[") {
                result += temp;
                temp /= 3;
                break;
            }
    }
}

if (stack.length != 0) {
    return 0;
}

return result;
  • 접근 방식
    • "(" , "(" , "[" , "]"의 조건문을 구해야 하기 때문에 switch로 케이스 문을 돌린다.
    • "("와 "["가 들어올 경우에는 temp에 2 또는 3 값을 넣어주고, stack에 쌓는다.
    • ")"와 "]"가 들어올 경우에 바로 앞에 "(" 또는 "["가 있는지 확인하고, 있다면 result와 temp를 수정해준다.
  • 풀이 방식
    1. case "("와 case "["를 받는다면
      temp에 2, 3을 곱해주고 stack에 str[i]를 push 한다.
      ==> "("와 "["의 페어를 찾기 위해 stack에 저장해 두고, 페어를 찾았다면 pop으로 꺼내면서 result에 업데이트.
    2. case ")"와 case "]"를 받는다면
      만약 str[i -1]로 "(" 또는 "["가 근접한 곳에 위치한다면 바로 전에 2 또는 3을 넣었던 temp을 result에 업데이트.
      만약 stack에 아무것도 없고, stack의 최상단이 "(" 또는 "["가 아니라면, 페어가 없으므로 return 0
    3. 스위치 문의 케이스를 다 돌리고 나서도 stack에 뭔가가 남아있다면, 페어가 아니므로 return 0

17:50 오후 회고 스터디 (만족도 : 6)

알고리즘 문제 풀 때, 접근을 제대로 못하니깐 계속 집중도가 떨어지고 휴대폰을 너무 많이 본다ㅠ
저녁부터는 뽀모도로를 이용해서 50분 동안은 절대 휴대폰을 보지 않는 연습을 진짜 해야 할 것 같다.
휴대폰으로 인해 버리는 시간이 너무너무 많다.. 막상 보면 할 것도 없는데ㅠ

1. 뽀모도로를 이용해서 50분 공부, 10분 휴식하자.
2. 50분 동안은 절대 휴대폰을 보지 않도록 노력하자.
3. 알고리즘을 접근할 때, 조금 더 다양한 방식으로 생각해보자.


- 화요일 8시 알고리즘 스터디

매주 화요일에 알고리즘 스터디를 하기로 했다.
일주일 동안 leetcode에서 지정한 섹션 문제들 풀고, 어려웠던 부분 또는 공유하고 싶은 부분들 공유하고
또, 만약에 이번에 linked list를 공부한다 하면, 그에 대한 공유하고 싶은 자료구조 문서들? 도 같이 공유하기로 했음!
지난주에 봤던 코테 점수를 들으니... 내가 제일 못하는 것 같다! 아직 많이 남았으니까 열심히 해보자!

 


- JS 기본 문법

  • 프로토타입 확장 (extends, 상속)
// Super Class
function Animal(name, sound) {
	this.name = name;
	this.sound = sound;
}

Animal.prototype.getInfo = function () {
	return this.name + "가(이)" + this.sound + " 소리를 낸다.";
};

// Sub Class
function Friends(name, sound) {
	Animal.call(this, name, sound);
}

Friends.prototype = Object.create(Animal.prototype);

Friends.prototype.constructor = Friends;

const dog = new Friends("개", "멍멍");
const cat = new Friends("고양이", "야옹");

console.log(dog);  // Friends { name: '개', sound: '멍멍' }
console.log(cat);  // Friends { name: '고양이', sound: '야옹' }

console.log(dog.getInfo()); // 개가(이)멍멍 소리를 낸다.
console.log(cat.getInfo()); // 고양이가(이)야옹 소리를 낸다.

console.log(dog.constructor.name); // Friends
console.log(cat.constructor.name); // Friends

console.log(dog instanceof Friends); // true
console.log(dog instanceof Animal); // true
  • Super Class의 Animal이라는 생성자 함수를 확장해서 Sub Class의 Friends라는 함수를 만들어,
    Friends함수로 Animal함수에 있는 메서드와 속성을 그대로 확장해서 사용하는 것.
  • Animal > Friends > dog, cat
  • prototype을 사용하는 것보다, class를 사용한다면 더 깔끔하고 간편하게 사용할 수 있음.

 

  • 클래스 (Class) : 프로토타입 기반 상속을 사용하여 지정된 이름으로 새 클래스를 만든다.
  • prototype을 기반한다고 말할 수 있는 이유는 babel에서 transform을 거치지 않고, 아래의 코드를 작성하였을 때
    두 번째 이미지처럼 복잡한 코드 형태로 나타나면서, 결국 내부에서 prototype을 사용하고 있다는 것을 볼 수 있음.

js에서 class로 작성한 코드
transform을 없앤 코드


 

  • 인스턴스 (Instance)
  • 인스턴스는 생성자 함수, 클래스를 만들 때 new 연산자를 활용해서 만들 수 있음.
    또한 아래의 me 같은 싱글 리터럴 객체도 하나의 인스턴스로 볼 수 있음.
const me = {
  name : 'amy',
  age : 10,
  location: 'Korea',
};

function Func() {

}

class Classs {

}

const newInstance = new Func();
const newInstance2 = new Classs();

 

  • 기존의 생성자 함수를 클래스로 리팩터링 하여 클래스가 얼마나 간단하게 적용할 수 있는 함수인지 알아보자.
  • 클래스 함수는 getter, setter와 private 키워드, 정적 메서드 등의 기능도 활용할 수 있다.
    react, vue에도 클래스 컴포넌트를 사용하고 있기에, 한번 익혀두면 유용한 함수이다.
// 인스턴스
function Person(name, age, location) {
	this.name = name;
	this.age = age;
	this.location = location;

	this.getName = function () {
		return this.name + "입니다";
	};
}

const me = new Person("park", 10, "Korea");
const you = new Person("kim", 30, "Japan");

console.log(me.getName()); // park입니다
console.log(you.getName()); // kim입니다
// 클래스
class Person2 {
	constructor(name, age, location) {
		this.name = name;
		this.age = age;
		this.location = location;
	}

	getName() {
		return this.name + "입니다";
	}
}

const me2 = new Person2("park", 10, "Korea");
const you2 = new Person2("kim", 30, "Japan");

console.log(me2.getName()); // park입니다
console.log(you2.getName()); // kim입니다

 

  • 클래스 확장
    • 기존의 프로토타입 코드를 class 확장하여, class로 간단하게 구현할 수 있음.
// 클래스 확장

// Super Class
class Animal {
	constructor(name, sound) {
		this.name = name;
		this.sound = sound;
	}

	getInfo() {
		return this.name + "가(이)" + this.sound + " 소리를 낸다.";
	}
}

// Sub Class
class Friends extends Animal {
	constructor(name, sound) {
		super(name, sound);
	}
}

const dog = new Friends("개", "멍멍");
const cat = new Friends("고양이", "야옹");
console.log(dog); // Friends { name: '개', sound: '멍멍' }
console.log(cat); // Friends { name: '고양이', sound: '야옹' }

console.log(dog.getInfo()); // 개가(이)멍멍 소리를 낸다.
console.log(cat.getInfo()); // 고양이가(이)야옹 소리를 낸다.

console.log(dog.constructor.name); // Friends
console.log(cat.constructor.name); // Friends

console.log(dog instanceof Friends); // true
console.log(dog instanceof Animal); // true

22:50 저녁 회고 스터디 (만족도 : 8)

[○]  1. 스택 2문제 풀이 및 정리
[△]  2. 정렬, 스택, 연결 리스트 각 2문제씩 복습
[]  3. 알고리즘 스터디 미팅
[]  4. JS 문법 학습 및 정리
[ X ] 5. 큐 학습 및 문제 풀이


원래 알고리즘 복습을 하려 했는데, JS 문법이 조금 남아서 JS문법을 공부하는 시간을 가졌음.
두 시간 동안 집중도도 좋았어서 오늘은 오랜만에 8점을 주겠다.
오후에도 이 정도로만 집중되면 좋겠는데ㅠ 시간이 너무 길어서 그런지 자꾸 루즈해진다~ 어떻게 하면 좋을꼬


[ 출처, 참고 : 제로베이스 프런트엔드 스쿨 ]

728x90

'TDL' 카테고리의 다른 글

[TDL] 05/12 Today's-Done-List  (0) 2022.05.12
[TDL] 05/11 Today's-Done-List  (0) 2022.05.12
[TDL] 05/09 Today's-Done-List  (0) 2022.05.10
[TDL] 05/08 Today's-Done-List  (0) 2022.05.08
[TDL] 05/05 Today's-Done-List  (0) 2022.05.05