2022.9.5.월요일 TIL: 코어자바스크립트 - 클로저, 프로그래머스 신규아이디 추천 JS풀이, SQL 복습 & 리트코드 풀이, 네트워크 ip (1),

Dorito·2022년 9월 5일

공부기록

공부 기록

목록 보기

18/71

하루 개요

코어 자바스크립트 챕터 4 복습
코어 자바스크립트 챕터 5 공부
운영체제 챕터 7 공부
알고리즘 1문제 풀기
SQL 개념 복습하기
네트워크 공부하기 (1강)
Node.js 구현

만약 시간이 된다면 자료 구조 공부

코어자바스크립트: 클로저

https://developer.mozilla.org/ko/docs/Web/JavaScript/Closures
클로저는 여러 함수형 프로그래밍 언어에서 등장하는 보편적인 특성.

클로저는 함수와 그 함수가 선언될 당시의 Lexical environment의 상호관계에 따른 현상,

어떤 함수에서 선언한 변수를 참조하는 내부함수에서만 발생하는 현상
(외부 함수의 LexicalEnvironment가 가비지컬렉팅되지 않는 현상)

어떤 함수 A에서 선언한 변수 a를 참조하는 내부함수 B를 외부로 전달할 경우 A의 실행컨텍스트가 종료된 이후에도 변수 a가 사라지지 않는(gc되지 않는) 현상

LexicalEnvironment의 environmentRecord와 outerEnvironmentReference에 의해 변수의 유효범위인 스코프가 결정되고 스코프 체인이 가능해짐.

어떤 컨텍스트 A에서 선언한 내부함수 B의 실행 컨텍스트가 활성화된 시점에서는 B의 outerEnvironmentReference에 의해 변수의 유효범위인 스코프가 결정되고 스코프가 가능해짐.

어떤 컨텍스트 A에서 선언한 내부함수 B의 실행 컨텍스트가 활성화 된 시점에는 B의 outerEnvironmentReference가 참조하는 대상인 A의 LexicalEnvironment에도 접근이 가능! (A에서는 B변수에 접근 못하지만 반대는 가능)

outer 실행 컨텍스트 종료된 후에도 inner 함수 호출하는 경우 (외부 함수의 변수를 참조하는 내부 함수)

inner함수 실행 시점에 outer함수는 이미 실행이 종료된 상태인데 어떻게 outer함수의 LexicalEnvironment에 접근 할 수 있는걸까?
가비지 컬렉터는 어떤 값을 참조하는 변수가 하나라도 있다면 그 값은 수집 대상에 포함하지 않기 때문임!
따라서 inner 함수의 실행 컨텍스트가 활성화되면 outerEnvironmentReference가 outer 함수의 LexicalEnvironment를 필요로 할 것이므로 gc수집 대상에서 제외됨.

클로저는 어떤 데이터(어휘적 환경)와 그 데이터를 조작하는 함수를 연관시켜주기 때문에 유용하다. 이것은 객체가 어떤 데이터와(그 객체의 속성) 하나 혹은 그 이상의 메소드들을 연관시킨다는 점에서 객체지향 프로그래밍과 분명히 같은 맥락에 있다.

결론적으로 오직 하나의 메소드를 가지고 있는 객체를 일반적으로 사용하는 모든 곳에 클로저를 사용할 수 있다.

클로저와 메모리 관리

메모리 누수라는 표현은 개발자 의도와 달리 참조카운트가 0이 되지 않아 gc 수거대상의 되지 않는 경우!
클로저는 어떤 필요에 의해 의도적으로 함수의 지역변수가 사용하는 메모리를 소모하도록 함으로써 발생함 -> 참조 카운트를 0으로 만들자!
식별자에 참조형이 아닌 기본형 데이터 (보통 null, undefined를 할당)

함수가 살아있는 동안엔 이론상으론 모든 외부 변수 역시 메모리에 유지된다.
그러나 실제로는 자바스크립트 엔진이 이를 지속해서 최적화한다. 자바스크립트 엔진은 변수 사용을 분석하고 외부 변수가 사용되지 않는다고 판단되면 이를 메모리에서 제거함.

디버깅 시, 최적화 과정에서 제거된 변수를 사용할 수 없다는 점은 V8 엔진(Chrome, Opera에서 쓰임)의 주요 부작용임

let outer = function () {
  let a = 1;

  const inner = function () {
    return a++;
  };
  return inner;
};

const outer2 = outer();

console.log("1", outer2());
console.log("2", outer2());

outer = null; // outer 식별자의 inner 함수 참조를 끊음

클로저 활용

https://ko.javascript.info/closure
https://basemenks.tistory.com/185
https://meetup.toast.com/posts/86

정리 완전 잘 되어있음

렉시컬 환경 제대로 이해하기!
책 보고 공부함

프로그래머스 신규아이디 추천 JavaScript 풀이

조건
1단계 newid의 모든 대문자를 대응되는 소문자로 치환합니다.
2단계 new_id에서 알파벳 소문자, 숫자, 빼기(-), 밑줄(), 마침표(.)를 제외한 모든 문자를 제거합니다.
3단계 new_id에서 마침표(.)가 2번 이상 연속된 부분을 하나의 마침표(.)로 치환합니다.
4단계 new_id에서 마침표(.)가 처음이나 끝에 위치한다면 제거합니다.
5단계 new_id가 빈 문자열이라면, new_id에 "a"를 대입합니다.
6단계 new_id의 길이가 16자 이상이면, new_id의 첫 15개의 문자를 제외한 나머지 문자들을 모두 제거합니다.
만약 제거 후 마침표(.)가 new_id의 끝에 위치한다면 끝에 위치한 마침표(.) 문자를 제거합니다.
7단계 new_id의 길이가 2자 이하라면, new_id의 마지막 문자를 new_id의 길이가 3이 될 때까지 반복해서 끝에 붙입니다.

솔루션 봄 (내일 다시 풀어야 댐)

const solution = (new_id) => {
    const id = new_id
        .toLowerCase()
        .replace(/[^\w\d-_.]/g, '')
        .replace(/\.{2,}/g, '.')
        .replace(/^\.|\.$/g, '')
        .padEnd(1, 'a')
        .slice(0, 15)
        .replace(/^\.|\.$/g, '')        
    return id.padEnd(3, id[id.length-1])
}

코드 해석..
.replace(/[^\w\d-_.]/g, '') 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.)를 제외한 모든 문자를 제거합니다.

.replace(/\.{2,}/g, '.') 마침표(.)가 2번 이상 연속된 부분을 하나의 마침표(.)로 치환합니다.

.replace(/^\.|\.$/g, '') 마침표(.)가 처음이나 끝에 위치한다면 제거합니다.

.padEnd(1, 'a') 빈 문자열이라면, new_id에 "a"를 대입합니다.

.slice(0, 15) 16자 이상이면, new_id의 첫 15개의 문자를 제외한 나머지 문자들을 모두 제거합니다.
.replace(/^\.|\.$/g, '') 제거 후 마침표(.)가 new_id의 끝에 위치한다면 끝에 위치한 마침표(.) 문자를 제거합니다.

id.padEnd(3, id[id.length-1]) 길이가 2자 이하라면, new_id의 마지막 문자를 new_id의 길이가 3이 될 때까지 반복해서 끝에 붙입니다.

처음보는 padEnd 함수 str.padEnd(targetLength [, padString])

padEnd() 메서드는 현재 문자열에 다른 문자열을 채워, 주어진 길이를 만족하는 새로운 문자열을 반환합니다. 채워넣기는 대상 문자열의 끝(우측)부터 적용됩니다.
'abc'.padEnd(10, "foo");   // "abcfoofoof"

매개변수

targetLength
목표 문자열 길이. 현재 문자열의 길이보다 작다면 채워넣지 않고 그대로 반환.
padString Optional
현재 문자열에 채워넣을 다른 문자열. 문자열이 너무 길어 목표 문자열 길이를 초과한다면 좌측 일부를 잘라서 넣음. 기본값은 " ". (U+0020)
반환값
끝부터 주어진 문자열로 채워 목표 길이를 만족하는 String

정규식은 너무 어렵다.

정규식 정리
참고 사이트: https://hamait.tistory.com/342
https://docs.oracle.com/javase/7/docs/api/java/util/regex/Pattern.html -> regex 패턴 사이트

SQL 복습 & 리트코드 문제 복습

공부 내용.. 옵시디언에 있어서 기록만 함

리트코드 풀이

https://leetcode.com/problems/duplicate-emails/

내 쿼리

SELECT email FROM person group by email HAVING COUNT(email) > 1 ;

이론

데이터 그룹에 조건 적용하기: GROUP BY + HAVING 절
→ GROUP BY 절에 조건을 부여하고 싶을 경우! (ex. 책 2번 이상 대여한 user id만 조회)

SELECT user_id, COUNT(*) (→검색할 컬럼)
FROM rental (→ 테이블)
GROUP BY user_id (→ 그룹의 기준 컬럼)
HAVING COUNT(user_id) > 1 
--→ 조건 추가/ rental 테이블에서 user_id가 같은 1개 초과의 데이터가 몇 개 있는지 검색

네트워크 ARP 프로토콜

https://velog.io/@dorito/네트워크-ip-편

하루 마무리

완료한 것 ❌🔺✅
코어 자바스크립트 챕터 4 복습 ✅
코어 자바스크립트 챕터 5 공부 ✅
운영체제 공부 (챕터 7)✅
알고리즘 1문제 풀기 ✅
SQL 개념 복습하기 ✅
네트워크 공부하기 (1강) 🔺 (1/4 까지 들음)
Node.js 구현 ✅
만약 시간이 된다면 자료 구조 공부 || 운영체제 공부
내일 할 것
코어 자바크립트 챕터 5 복습
코어 자바크립트 챕터 6 공부
운영체제 공부 챕터 8
알고리즘 문제
하루 반성
아는 게 없다
피드백
일단 고고!...