javascript 13

[배열 다루기] shift와 slice의 차이점

오늘 알고리즘의 재귀 문제를 풀면서 배열을 다룰 일이 있었다. 배열에서 한 요소씩 잘라내는 것이 핵심이였는데, 익숙하게 사용하던 slice메서드가 생각나지 않아 shift를 썼다. 두 메서드 다 배열의 요소를 줄인다는 공통점이 있지만 어떤 것이 다른지 궁금해졌다. shift() 배열에서 첫 번째 요소를 제거하고, 제거된 요소를 반환합니다. 이 메서드는 배열의 길이를 변하게 합니다. arr.shift() slice() 어떤 배열의 begin부터 end까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환합니다. 원본 배열은 바뀌지 않습니다. arr.slice([begin[, end]]) 차이점 무엇을 반환하나? shift: 제거된 (첫 번째) 요소 slice: 추출한 요소를 포함한 새로운 배열..

Javascript 2022.10.30

옵셔널 체이닝 연산자 (.?)

Javascript Info | 옵셔널 체이닝 MDN | 옵셔널 체이닝 옵셔널 체이닝 연산자란? ?.은 ?.'앞’의 평가 대상이 undefined나 null이면, 평가를 멈추고 undefined를 반환. 그렇지 않으면 뒤의 프로퍼티 참조를 이어감 let user = {}; // 주소 정보가 없는 사용자 alert( user?.address?.street ); // undefined, 에러가 발생하지 않습니다. 옵셔널 체이닝이 필요한 이유 사례1 사용자가 여러 명 있는데 그중 몇 명은 주소 정보를 가지고 있지 않다고 가정해봅시다. 이럴 때 user.address.street를 사용해 주소 정보에 접근하면 에러가 발생할 수 있습니다. let user = {}; // 주소 정보가 없는 사용자 alert(use..

Javascript 2022.08.10

콜백함수

//각각의 원소를 보여주는 콜백함수 만들기 const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; function callback(element){ console.log(element) } words.filter(callback); 콜백함수란? 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수 함수를 합성하여 변하지 않는 공통로직은 미리 정의해두고, 변경되는 로직은 추상화해서 함수 외부에서 함수 내부로 전달 자바스크립트는 함수의 일급 객체이므로 함수의 매개변수를 통해 함수를 전달 할 수 있음 용도 : 순차적으로 실행하고 싶을 때 특징 DB에서 데이터를 가져올 때 많이 사용 다른데서 만든 함수도 콜백함수로 ..

Javascript 2022.06.14

[알고리즘]strs은 단어가 담긴 배열 공통된 시작 단어(prefix)를 반환

strs은 단어가 담긴 배열입니다. 공통된 시작 단어(prefix)를 반환해주세요. 예를 들어 strs = ['start', 'stair', 'step'] return은 'st' strs = ['start', 'wework', 'today'] return은 '' 마지막 줄은 문제가 덜 쓰인건 줄 알았는데, 그게아니라 공통된 시작 단어가 없는 경우에는 '', 즉 빈 문자열을 반환하라는 이야기였다. 함께 리뷰해준 팀원분의 코드를 보면, const getPrefix = strs => { let answer=[]; if (strs[0]===undefined){ return "" } for (i=0; i< strs.length; i++){ for (j=1; j { let answer=[]; if (strs[0]=..

알고리즘 2022.05.28

[알고리즘] 중복되지 않은 알파벳으로 이루어진 제일 긴 단어의 길이 구하기

String 형인 str 인자에서 중복되지 않은 알파벳으로 이루어진 제일 긴 단어의 길이를 반환해주세요. str: 텍스트 return: 중복되지 않은 알파벳 길이 (숫자 반환) 예를 들어, str = "abcabcabc" return 은 3 => 'abc' 가 제일 길기 때문 str = "aaaaa" return 은 1 => 'a' 가 제일 길기 때문 str = "sttrg" return 은 3 => 'trg' 가 제일 길기 때문 알파벳의 길이를 반환해야하니, .length를 써야겠다는 것 외에 감이 안와 구글링을 해보았다. 아래 풀이를 공부하는 걸로 대신한다. longest substring of non repeating characters javascript - Stack Overflow 배열을 발견..

알고리즘 2022.05.26

돔(DOM), 누구냐 넌..!

DOM(Document Object Model)은.. '문서 객체 모델'의 약어이다. 문서 객체 모델이란, HTML, XML 문서의 프로그래밍 interface이다. (DOM은 브라우저에서 제공하는 기능이다. 프로그래밍 언어는 아니다) Javascript가 무엇이었던가! 동적인 HTML을 정적으로, 즉 사용자와 상호 작용하기 위해 (우리가 클릭하면 버튼이 눌린다던가 하는) 만들어진 프로그래밍 언어이다. 이를 구현하기 위하여, HTML-Javascript-웹브라우저가 삼박자로 연결이 되어야 한다. DOM은 웹브라우저에서 Javascript가(Javascript의 관점에서, 즉 객체화 되어) HTML를 사용할 수 있도록 둘을 연결한다. 즉, 저 셋을 연결을 가능하기 하는 다리와 같은 역할인 것이다. 가장 중..

Javascript 2022.05.22

[개념 문제] 09.object - 8. 객체 안의 객체 접근/9. 객체 안의 배열 접근

8. 객체 안의 객체 접근 Assignment accessObject 함수를 작성해주세요. myStorage 객체의 속성에 접근하여 glove box 프로퍼티의 값을 변수 gloveBoxContents에 대입해주세요. 함수의 리턴값은 glove box 프로퍼티의 값이 되어야 합니다. 문제 function accessObject() { // 아래의 코드를 수정하지마세요. let myStorage = { "car": { "inside": { "glove box": "maps", "passenger seat": "crumbs" }, "outside": { "trunk": "jack" } } }; // 아래의 코드를 수정해주세요. // 아래의 코드를 수정하지마세요. return gloveBoxContents; ..

Javascript 2022.05.08

[개념 문제] 09.object - 5. 객체 수정/ 6. 객체 속성 추가/ 7. 객체 속성 삭제

5. 객체 수정 Assignment updateObject 함수를 작성해주세요. myDog 객체의 "name" property를 업데이트해주세요. "name" key의 값을 "Coder"에서 "Happy Coder"로 바꿔주세요. dot notation / bracket notation 둘 중 아무거나 사용해도됩니다. 문제 function updateObject() { // 아래의 코드는 수정하지 마세요. let myDog = { "name": "Coder", "legs": 4, "tails": 1, "friends": ["freeCodeCamp Campers"] }; // 아래에 코드를 작성해주세요. // 아래의 코드는 수정하지 마세요. return myDog.name; } 풀기 1.Dot notati..

Javascript 2022.05.07

[개념 문제] 09.object - 0. 왜 객체를 써야할까요?/1. 객체 생성하기

0. 왜 객체를 써야할까요? 객체란 무엇일까요? 객체는 자바스크립트 데이터 타입 중의 하나입니다. 영어로는 object라고 표현합니다. key값과 value값을 쌍으로 이루어져 있고, 배열과는 다르게 순서가 중요하지 않습니다. 예를 들어 다음과 같은 배열이 있다고 생각해봅시다. let person1 = ['곽철용', 'AB형', 'ENFP', '바닐라라떼'] 위의 배열에는 특정 사람의 이름과 혈액형, MBTI, 좋아하는 커피에 대한 정보가 담겨있습니다. 우리가 원하는 정보를 얻기 위해서는 해당 배열에 있는 Index number를 기억해야 합니다. 또 다른 사람이 있다고 생각해봅시다. let person2 = ['아이스아메리카노', 'INTP', '홍혁팔', 'O형'] person2는 person1의 정..

Javascript 2022.05.05

내가 지금 뭘 배우고 있는거지? 자바스크립트가 뭐야?

부트캠프를 시작하기 전 사전 스터디에서 가장 먼저 배우는 것은 Javascript의 변수 선언하는 법과 console.log이다. 갑자기 replit이라는 사이트에 들어가라더니, 들어가 보니 막 영어를 쓰고 run을 누르고 있는 나를 발견하였다. 개발을 전혀 접하지 않은 상태에서는 자바스..하면 벌레퇴치제가 생각나고 변수 하면 변정수가 생각나는 수준이다. 이렇게 무지한 상태에서 큰 그림을 잡기위해 내가 도대체 지금 뭘 배우고 있는지 알아보기로 했다. 우선 나는 웹 개발을 배우고 있다. 웹을 구성하는 요소는 3가지인데, 이는 HTML, JavaScript, CSS이다. 각각은 웹에서 아래 역할을 맡고 있다. HTML: 내용, 구조 CSS: 디자인 JavaScript: 프로그래밍 언어 조금 더 자세히 보자면..

Javascript 2022.04.27