12.객체

부트캠프를 통해 얻고 싶은 나의 목표.

- 하루 평균 3시간 자기주도학습능력(몰입의 경험) -> 블로그 작성/ 플래너 작성 

-앤트리 개발자 수준의 프론트 개발 실력 쌓기 -> 부트캠프 과제 기한 밀리지 않기!!!(매우 중요)

- 주니어 개발자 수준의 협업능력과 커뮤니케이션 능력 -> 스터디 클럽 운영

- 자바스크립트 딥다이브 책 정독 1회 -> 자바스크립트 딥다이브 스터디 가입

되돌아보며.

오늘은 페어프로그래밍 역할을 네비게이터가 아닌 드라이버로 진행하니 확실히 힘든 부분이 많이 없었고 마지막 문제까지 쉽게 도달할 수 있었다. 하지만 페어분께서 문제를 정확히 파악하지 못한 상태에서 간략한 의사 코드만 주고받고 실제 코드구현은 내가 다 작성하니 같이 프로그래밍을 한다라는 측면에 보았을 때 많이 아쉬운 부분이 남았다.  

 

성장한 부분

내면적 측면 

길종님이 말씀해주신 아하모먼트라는 부분이 인상깊었다. "아하모먼트"란 지금 당장 이해가 어렵더라도 n회독 하면 언젠가는 이해가 된다. 그러니 지금 이해못해도 괜찮다.라는 말을 담고 있었다. 

기타

-run code : ctrl alt n 

-윈도우 브라우져 내 이동 :윈도우키 + 좌/우 방향키 

-vscode Terminal  창 띄우기 ctrl shift `

-리액트에서는 함수이름을 항상 대문자로 시작

-리액트에서 map filter 함수 많이 사용

지식적 측면

3/1 프로그래머스 (배열유사도)

내 풀이

// 두 배열이 얼마나 유사한지 확인해보려고 합니다. 문자열 배열 s1과 s2가 주어질 때 
//같은 원소의 개수를 return하도록 solution 함수를 완성해주세요.

function solution(s1, s2) {
    var answer = 0;
    for(let i of s1){
        for(let j of s2){
            if(i === j){
                answer++;
            }
        }
    }
    return answer;
}

다른 사람 풀이

function solution(s1, s2) {
    const intersection = s1.filter((x) => s2.includes(x)); // s2배열에  x가 포함되있으면 true 반환
//filter 안 조건문이 ture에 해당되는 요소들을 원본 훼손없이 배열로 복사 저장 
    return intersection.length;
}

filter 함수

nums.filter(number⇒number>3);  
//number 배열의 요소 >3가 ture 라면
//원본훼손 없이 배열 복사

*nums 배열이름

*number 배열의 요소

.includes() 함수

string.includes( searchString, length ) //있으면 true, 없으면 false 반환

*string 배열 이름

*searchString 검색할 문자열로 필수 요소. 대소문자를 구분

*length 배열 검색을 시작할 위치. 선택 요소.

 

더나아가기(길종님문제)

solution( arr, n) {
//배열 arr와 양의 정수 n이 매개변수로 주어지면 arr[n]의 인덱스를 제외하여 새로 만든 배열을 반환하라

//arr = [1,4,3,2,5,6,7,8,10] n = 5  일때 

let newArr = arr.filter((x,index)=>index!==n);
//두개 이상 인자를 사용시 (x,index)처럼 ()로 묶어줘야 함.

//(x,index,source)-> 변수명과는 상관없이 순서대로 
//요소값, 요소의 인덱스, 순회하는 대상 arr 

}

https://7942yongdae.tistory.com/49

스코프 -길종님

let scope = 'Global';

function scoper() {
  let scope = 'Local';
  bar();
}

function bar() {
  console.log(scope);
}

scoper(); // Local Global
bar(); // Global

// 렉시컬 스코프 lexical = 어휘적인

// 함수는 호출된곳이아니라 정의된곳을 기준으로 생각한다.

// 반대로 함수가 호출된곳을 기준으로 생각하는 것 === 다이나믹 스코프 /

/ 상위는 하위를 참조할수없지만

// 하위는 상위를 마음껏 참조할수있다.

 

let scope = 0; let previuskey = '';
function ob() { 
previuskey = 'Oprater'; 
} 
function bar() { 
// 외부함수 let scope = 10; 
// 원래 죽었어야되는데 산 변수들을 "자유변수" let death = 0; 
// 얜 죽어요 
function Eunhe() { scope += 1; console.log(scope); } return { increase() { scope += 1; console.log(scope); }, decrease() { scope -= 1; console.log(scope); }, }; } //캡슐화 까지는 // 클로저는 함수를 반환하는 함수여야한다. OOO // 클로저는 외부함수의 변수를 참조해야한다. OOO // 2가지 조건만 만족하면 그것은 클로저다. // 어떤 것에 의해서 참조되는 변수는 살려준다. // 클로저는 뭐냐? -> 죽었어야되는애들을 어거지로 살려서 써먹는거 let Eunhe = bar(); /* 가비지 콜렉터 쓰레기 수집가 지역변수인애들은 코드 실행을 마치면 가비지 콜렉터가 저 지역변수들을 버려요 변수의 정의 : 메모리에 공간을 할당하고 이 공간을 쓸것이다 이 공간을 가리키는 이름은 변수다 변수를 정의 => 메모리에 공간을 차지한다 안쓰는 코드 안쓰는 변수가 메모리에 공간을 계속 차지하면 안쓰는건 버려야된다 안쓰는 거의 정의 지역변수인데 실행을 다 한 */ /* Eunhe = function() { console.log(scope) } */ console.log(scope); Eunhe.increase(); Eunhe.increase(); Eunhe.increase(); Eunhe.decrease();

단어 정리

⭐ 배열 리터럴.

: let myArr=[’a’, ‘b’]일 때 초기화하는 변수의 형을 정하는 데이터 그자체. [”a”, “b”]를 의미합니다.

리터럴이란? 데이터 그 자체이며 변수의 형을 정합니다.

리터럴 종류

: 불리언/숫자/부동소수점/문자열/정규식/객체/배열 리터럴이 있습니다.

문제가 되는 부분 

시도해야할 부분 

-리액트전에 자바스크립트를 확실히 집고 넘어가자.

-이해해야할 포인트 : 화살표 함수 활용 을 못해서 쉽게 까먹었따. 스코프 공부를 하자.