nninyeong
close
프로필 배경
프로필 로고

nninyeong

  • 분류 전체보기 (169)
    • JavaScript (36)
    • TypeScript (4)
    • HTML + CSS (12)
    • React (35)
    • Next.js (17)
    • 프론트엔드 아키텍처 & 설계 (1)
    • React Native (3)
    • 데이터분석 (3)
    • supabase (3)
    • 네트워크 (4)
    • 디자인패턴 (1)
    • 알고리즘 (4)
    • 실험실 (1)
    • 개인 프로젝트 (6)
      • 개인 과제 (3)
      • 포트폴리오 (2)
      • 뿌셔뿌셔 (개인) (1)
    • 팀 프로젝트 (11)
      • 마이폴라 (0)
      • 오르미 (4)
    • 일지 (17)
    • 챌린지반 (5)
    • MICE (0)
    • 아티클 & 개발 팁 (3)
    • 기술면접 준비 (2)
    • TIL, 회고 (0)
  • 홈
  • 태그
  • 방명록
[JavaScript] 깊은 복사와 얕은 복사

[JavaScript] 깊은 복사와 얕은 복사

원시타입의 깊은 복사let num = 1;let num2 = num;num = 3;console.log(num); // 3console.log(num2); // 1  1이라는 데이터가 주소값이 3001인 메모리에 있다고 가정할 때, num은 1이 저장된 주소값(3001)을 갖고있다.num2에 num의 값을 복사하기위해 num2 = num을 실행한 경우 num2은 마찬가지로 1이 저장된 주소값(3001)을 갖게된다.각 식별자가 독립적으로 데이터 1의 위치를 알고있으므로, 둘중 하나가 다른 데이터를 할당받더라도 나머지 하나는 그대로 1에 접근할 수 있다. 위 예시처럼 num = 3을 새로 대입해준 경우 num은 3이라는 데이터가 위치한 주소(ex. 3002)를 갖게되고, 이 변화는 num2가 갖고있는 정..

  • format_list_bulleted JavaScript
  • · 2024. 7. 23.
  • textsms

[JavaScript] Map과 Set

Map, Set이란?데이터의 구성, 검색, 사용을 효율적으로 처리하기 위해 등장한 자료구조 Mapkey-value 쌍을 저장한다.set(), get()Map에 자료를 추가하고, 검색할 수 있는 메서드const myMap = new Map();myMap.set('key', 'value');myMap.get('key'); keys(), values(), entries()Map의 데이터들은 반복하며 동작을 처리하기 위해 사용할 수 있음const myMap = new Map();myMap.set("one", 1);myMap.set("two", 2);myMap.set("three", 3);console.log(myMap.keys()); // { 'one', 'two', 'three' }for (const key..

  • format_list_bulleted JavaScript
  • · 2024. 7. 22.
  • textsms

[JavaScript] 일급 객체로서의 함수

자바스크립트에서 함수는 일급 객체(First-Class Object)라고 하며, 일급객체란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 의미한다. 즉, 함수를 객체처럼 여러가지 방식으로 다룰 수 있다! 변수에 함수를 할당할 수 있다const sayHello = function() { console.log("Hello");}  함수를 다른 함수의 인자로 전달할 수 있다const sayHello = function() { console.log("Hello");}function callFunction(func) { func();}callFunction(sayHello); // Hello 출력 콜백함수: 매개함수로 쓰이는 함수고차함수: 함수를 인자로 받거나 return 하는 함수더보..

  • format_list_bulleted JavaScript
  • · 2024. 7. 22.
  • textsms

[JavaScript] ES6 추가 문법들

구조분해할당 (Destructuring)배열이나 객체의 요소, 속성을 분해해서 그 값을 변수에 담을 수 있도록 함 배열let arr = [1, "new"];let [value1, value2] = arr;console.log("value1: ", value1); // value1: 1console.log("value2: ", value2); // value2: new// 분해하려는 구조보다 더 많은 변수에 할당하려는 경우let arr = [1, "new"];let [value1, value2, value3] = arr;console.log("value1: ", value1); // value1: 1console.log("value2: ", value2); // value2: newconsole.l..

  • format_list_bulleted JavaScript
  • · 2024. 7. 22.
  • textsms

[JavaScript] 객체 메서드와 객체 비교

Object.key()객체의 키를 모두 가져와 배열로 반환let person = { name: "Kim", age: 30,};let keys = Object.keys(person);console.log(keys); // ['name', 'age']  Object.values()객체의 값들을 모두 가져와 배열로 반환let values = Object.values(person);console.log(values); // ['Kim', 30]   Object.entries()객체의 key-value를 하나의 배열로 묶어 만든 배열을 반환 (2차원 배열)let entries = Object.entries(person);console.log(entries); // [['name', 'Kim'], ['ag..

  • format_list_bulleted JavaScript
  • · 2024. 7. 22.
  • textsms

[JavaScript] 삼항연산자와 단축평가 활용하기 (조건부실행, 기본값지정)

단축평가논리연산자 && 혹은 || 에서 평가식 도중에 true 혹은 false가 판명난다면 그 이후는 연산하지 않는 것을 의미한다.예를들어 &&는 양쪽 피연산자가 모두 true여야 true를 반환하는데, 첫 피연산자가 false인 경우에는 두번째 피연산자의 값에 상관없이 false를 반환하게 되므로 나머지 조건 확인을 수행하지 않는다. let answer = condition ? answer1 : answer2;위와 같이 활용할 수도 있지만 추가로 유용한 활용안들이 강의에 있어 정리해보았다. && , || 를 활용한 조건부 실행x > 0 && console.log("x는 양수입니다.");조건이 true인 경우 특정 구문을 실행해야할 때 &&를 사용할 수 있다.x가 0보다 작은 경우 && 연산자는 우항까지..

  • format_list_bulleted JavaScript
  • · 2024. 7. 22.
  • textsms
  • navigate_before
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • navigate_next
공지사항
전체 카테고리
  • 분류 전체보기 (169)
    • JavaScript (36)
    • TypeScript (4)
    • HTML + CSS (12)
    • React (35)
    • Next.js (17)
    • 프론트엔드 아키텍처 & 설계 (1)
    • React Native (3)
    • 데이터분석 (3)
    • supabase (3)
    • 네트워크 (4)
    • 디자인패턴 (1)
    • 알고리즘 (4)
    • 실험실 (1)
    • 개인 프로젝트 (6)
      • 개인 과제 (3)
      • 포트폴리오 (2)
      • 뿌셔뿌셔 (개인) (1)
    • 팀 프로젝트 (11)
      • 마이폴라 (0)
      • 오르미 (4)
    • 일지 (17)
    • 챌린지반 (5)
    • MICE (0)
    • 아티클 & 개발 팁 (3)
    • 기술면접 준비 (2)
    • TIL, 회고 (0)
최근 글
인기 글
최근 댓글
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바