개발공부 기록지

문제(출처: 프로그래머스)

덧셈, 뺄셈 수식들이 'X [연산자] Y = Z' 형태로 들어있는 문자열 배열 quiz가 매개변수로 주어집니다. 수식이 옳다면 "O"를 틀리다면 "X"를 순서대로 담은 배열을 return하도록 solution 함수를 완성해주세요.

제한사항

• 연산 기호와 숫자 사이는 항상 하나의 공백이 존재합니다. 단 음수를 표시하는 마이너스 기호와 숫자 사이에는 공백이 존재하지 않습니다.
• 1 ≤ quiz의 길이 ≤ 10
• X, Y, Z는 각각 0부터 9까지 숫자로 이루어진 정수를 의미하며, 각 숫자의 맨 앞에 마이너스 기호가 하나 있을 수 있고 이는 음수를 의미합니다.
• X, Y, Z는 0을 제외하고는 0으로 시작하지 않습니다.
• -10,000 ≤ X, Y ≤ 10,000
• -20,000 ≤ Z ≤ 20,000
• [연산자]는 + 와 - 중 하나입니다.

▶ 내가 푼 방식

function solution(quiz) {
    var answer = [];
    quiz.forEach((v) =>{
        let equation = v.split(' ');
        if(equation[1] === "-"){
            let result = Number(equation[0]) - Number(equation[2]);
            if (result === Number(equation[4])){
                answer.push("O")
            }
            else answer.push("X")
        }
        if(equation[1] === "+"){
            let result = Number(equation[0]) + Number(equation[2]);
            if (result === Number(equation[4])){
                answer.push("O")
            }
            else answer.push("X")     
        }
    })
    return answer;
}

▶ 다른 유저가 푼 방식

// 유저 1
function solution(quiz) {
    var answer = [];
    return quiz.map(t => {
        const [calc, result] = t.split(' = ');
        const sign = calc.includes('+') ? 1 : -1
        const [a, b] = calc.split(sign === 1 ? ' + ' : ' - ');

        return +a + (+b * sign) === +result ? 'O' : 'X'
    });
}

// 유저 2
function solution(quiz) {
    let answer = [];
    quiz.forEach((val) => {
        const [x, sign, y, , z] = val.split(" ");
        let sum = 0;
        if (sign === "+") {
            sum = Number(x) + Number(y);
        } else {
            sum = Number(x) - Number(y);
        }
        sum === Number(z) ? answer.push("O") : answer.push("X");
    });
    return answer;
}

// 유저 3

▶  배운 것들

     -  split 을 한 후 구조분해를 하면 코드가 좀더 간결해진다.

     - 

문제(출처: 프로그래머스)

my_string은 "3 + 5"처럼 문자열로 된 수식입니다. 문자열 my_string이 매개변수로 주어질 때, 수식을 계산한 값을 return 하는 solution 함수를 완성해주세요.

제한사항

• 연산자는 +, -만 존재합니다.
• 문자열의 시작과 끝에는 공백이 없습니다.
• 0으로 시작하는 숫자는 주어지지 않습니다.
• 잘못된 수식은 주어지지 않습니다.
• 5 ≤ my_string의 길이 ≤ 100
• my_string을 계산한 결과값은 1 이상 100,000 이하입니다.
  • my_string의 중간 계산 값은 -100,000 이상 100,000 이하입니다.
  • 계산에 사용하는 숫자는 1 이상 20,000 이하인 자연수입니다.
  • my_string에는 연산자가 적어도 하나 포함되어 있습니다.
• return type 은 정수형입니다.
• my_string의 숫자와 연산자는 공백 하나로 구분되어 있습니다.

▶ 내가 푼 방식

function solution(my_string) {
    let my_number = my_string.split(' ');
    let answer =0
    answer += Number(my_number[0]);
    my_number.forEach((v, i) => {
        if (my_number[i+1] === "+"){
            answer += Number(my_number[i+2]);
        }
        if (my_number[i+1] === "-"){
            answer -= Number(my_number[i+2]);
        }
    })
    return answer;
}

▶ 다른 유저가 푼 방식

// 유저 1
function solution(my_string) {
    const stack = [];

    let sign = 1;
    for (const ch of my_string.split(" ")) {
        if (ch === "+") {
            sign = 1;
        } else if (ch === "-") {
            sign = -1;
        } else {
            stack.push(ch * sign);
        }
    }

    return stack.reduce((a,b) => a + b, 0);
}

문제(출처: 프로그래머스)

영어가 싫은 머쓱이는 영어로 표기되어있는 숫자를 수로 바꾸려고 합니다. 문자열 numbers가 매개변수로 주어질 때, numbers를 정수로 바꿔 return 하도록 solution 함수를 완성해 주세요.

제한사항

• numbers는 소문자로만 구성되어 있습니다.
• numbers는 "zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine" 들이 공백 없이 조합되어 있습니다.
• 1 ≤ numbers의 길이 ≤ 50
• "zero"는 numbers의 맨 앞에 올 수 없습니다.

▶ 내가 푼 방식

const stringToNumber = {
    "zero": 0,
    "one" : 1,
    "two": 2,
    "three": 3,
    "four" : 4, 
    "five" : 5,
    "six" :6 , 
    "seven" : 7, 
    "eight" : 8, 
    "nine" :9  
}

function solution(numbers) {
    var answer = [];
    var temp = ''
    for (let i of numbers){
        temp += i
        if(stringToNumber[temp] === 0 | stringToNumber[temp] ){
            answer.push(stringToNumber[temp])
            temp = ''
        }
    }
    return Number(answer.join(''))
}

▶ 다른 유저가 푼 방식

// 유저 1
function solution(numbers) {
    const obj = {
        zero: 0, one: 1, two: 2, three: 3, four: 4,
        five: 5, six: 6, seven: 7, eight: 8, nine: 9
    };

    const num = numbers.replace(/zero|one|two|three|four|five|six|seven|eight|nine/g, (v) => {
        return obj[v];
    });

    return Number(num);
}

// 유저 2
function solution(numbers) {
    let numStr = [ "zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine" ];
	
    // zero 라는 문자를 가진 모든 문자를 idx(0) 으로 변경
    numStr.forEach((str, idx) => {
        numbers = numbers.replaceAll(str, idx);
    });
    return Number(numbers);
}

// 유저 3
function solution(numbers) {
    let d = ['zero', 'one','two','three','four','five','six','seven','eight','nine'];
    for (let i in d) numbers = numbers.replace(new RegExp(d[i], 'g'), +i);
    return +numbers;
}

▶  배운 것들

     -  replace의 새로운 사용방법

     -  만약에 const number = '1234' ->  +number 하면 1234 가 출력된다.   

불변 객체

자바스크립트에서 객체의 상태(즉, 프로퍼티의 값)가 생성 후 변경될 수 없는 객체를 의미

객체의 불변성을 유지한다는 것

사용하는 경우

• 객체에 변화를 가해도 원본이 그대로 남아있어야 하는 경우
• 특히, 메모리(데이터베이스)에 저장 되어 있는 객체를 다루는 경우
• 불변객체를 이용하여 상태변화를 추적해야하는 경우

사용하는 이유

• 오류감소 : 객체의 상태가 변경되지 않기 때문에 예기치 않은 상태 변경으로 인한 버그감소
• 성능최적화 : 복제나 비교를 위한 조작을 단순화 할 수 있고 성능 개선에도 도움

불변객체를 만드는 방법

Object.freeze() [ ref ]

const user= {
   name: "JJ",
   age : 38,
   address : {
     nation: "Korea",
     city: "JinJu"
   }
}

Object.freeze(user) // 상위레벨에 있는 것만 보호

user.name = "KK"
user.address.city = "Seoul"

console.log(user.name) // "JJ"
console.log(user.address.city) // "Seoul"


// deep freeze
const deepFreeze = obj => {
  Object.keys(obj).forEach(prop => {
    if (typeof obj[prop] === 'object') deepFreeze(obj[prop]);
  });
  return Object.freeze(obj);
};

Spread 연산자 [ ref ]

- 새로운 객체를 만들 때 사용

const obj1 = { type: 'data' }
const arr1 = [1, 2, 3]

const obj2 = { ...obj1, subtype: 'stuff' } // 원본 유지하면서 새로운 프로퍼티 추가
const arr2 = [ ...arr1, 'cheese' ] // 새로운 요소 추가


const data = { type: 'data', age: 55 }
const data2 = { ...obj1, age: data.age + 1 }// 원본 유지하면서 기존의 데이터 변경

꼭 변환을 해야한다면 깊은 복사를 하여  복사본을 변경을 하는 것을 추천한다.

// 스프레드 연산자

const originalArray = [ 1,2, 3]
const deepCopyArray = [ ... originalArray]

const user= {
   name: "JJ",
   age : 38,
   address : {
     nation: "Korea",
     city: "JinJu"
   }
}

// 1 단으로만 이루어진 객체에서는 가능
// spread
const copyUser = { ...user}
copyUser.name = "N"
copyUser.address.city = "Seoul"

// 원본 user 가 변경되었는지 확인
console.log(user.name) // "JJ" : 변경 안됨
console.log(user.address.city) // "Seoul" : "JinJu" 에서 "Seoul" 로 변경

// Object.assign 도 동일
const copyUserObjectAssign = Object.assign({}, user);


/* 1단 이상인 경우 */

// JSON 이용
const userCopyJSON = JSON.parse(JSON.stringify(user));


// 재귀함수 이용
function CopyObjectDeeply(target) {
  var result = {};

  if (typeof target === "object" && target !== null) {
    for (var prop in target) {
      result[prop] = copyObjectDeep(target[prop]); // 재귀적 호출
    }
  } else {
    result = target;
  }

  return result;
};

const userCopyFunction = CopyObjectDeeply(user)

참고자료

https://velog.io/@jujusnake/JavaScript-%EB%B6%88%EB%B3%80-%EA%B0%9D%EC%B2%B4-immutable-objec#%EA%B9%8A%EC%9D%80-%EB%B3%B5%EC%82%AC

https://velog.io/@gusdh2/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8JavaScript-%EA%B0%9D%EC%B2%B4%EC%99%80-%EB%B6%88%EB%B3%80%EC%84%B1#%EB%B6%88%EB%B3%80%EC%84%B1%EC%9D%B4%EB%9E%80

https://developer.mozilla.org/ko/docs/Glossary/Deep_copy

https://www.freecodecamp.org/news/immutable-javascript-improve-application-performance/

https://www.freecodecamp.org/news/javascript-immutability-frozen-objects-with-examples/

https://dev.to/glebec/four-ways-to-immutability-in-javascript-3b3l

문제(출처: 프로그래머스)

머쓱이는 친구들과 369게임을 하고 있습니다. 369게임은 1부터 숫자를 하나씩 대며 3, 6, 9가 들어가는 숫자는 숫자 대신 3, 6, 9의 개수만큼 박수를 치는 게임입니다. 머쓱이가 말해야하는 숫자 order가 매개변수로 주어질 때, 머쓱이가 쳐야할 박수 횟수를 return 하도록 solution 함수를 완성해보세요.

제한사항
1 ≤ order ≤ 1,000,000

▶ 내가 푼 방식

function solution(order) {
    let strings = String(order)
    let numberArray = Array.from(strings)
    return numberArray.filter(v => (v%3 === 0 && v!=0) ).length
}

▶ 다른 유저가 푼 방식

// 유저 1
function solution(order) {
    var answer = [...order.toString().matchAll(/[3|6|9]/g)].length;
    return answer;
}

// 유저 2
function solution(order) {
    const mySet = new Set([3,6,9]);
    return String(order).split('')
                        .filter(num => mySet.has(Number(num)))
                        .length;
}

// 유저 3
function solution(order) {
    return (order + '').replace(/[0,1,2,4,5,7,8]/g, '').length
}
function solution(order) {
    return (order + '').replace(^/[3,6,9]/g, '').length
}

▶  배운 것들

     -  순서에서 10, 1000 과 같이 0이 들어간 경우를 생각하지 못하여서 시간이 걸렸다.

     - matchAll 와 set/ Has 를 이용하여서 푸는 방식도 있다. 이걸 사용하면 0을 생각할 필요가 없어진다.

     - 정규표현식으로 하는 사람도 있었다.