240503 TIL 열다섯번째날

// 내생각 / 색깔글씨 : 중요표시 등

공부한 내용 - [], 배열 

팀프로젝트 나의 파트 : CRUD 만든 리뷰창값을 localstorage 연동하기  

자바스크립트에서 대괄호 []는 주로 다음과 같은 용도로 사용됩니다:

1. 배열 리터럴 - 배열을 정의하고 초기화 할 때 사용 ex) const arr = [1][2][3];

2. 배열요소 접근 - 배열의 특정 인덱스에 있는 요소에 접근 할 때 사용 ex) console.log(arr);// 1

3. 객체 프로퍼티 접근 - 객체의 프로퍼티에 접근할 때 사용할 수 있음 ex) 

4. 계산된 프로퍼티 명 - 객체 리터럴 내에서 프로퍼티 키를 동적으로 생성할 때 사용

     ex) const key = 'age'; const person = {[key]: 30};

5. 배열 디스트럭처링 - 배열의 요소를 개별 변수로 할당할 때 사용 - const [a, b] = [1][2]; // a = 1, b = 2

6. 문자열 인덱싱 - 문자열을 인덱스로 접근하여 특정 문자를 가져올 수 있음 ex) const str = 'hello'; console.log(str); // 'h'

따라서 대괄호 []는 배열과 객체를 다루는 다양한 상황에서 활용되며, 자바스크립트 프로그래밍에서 필수적인 구문입니다.

 

// 배열 저장 (JSON 문자열로 변환 필요)

const items = ['apple', 'banana', 'orange'];

localStorage.setItem('items', JSON.stringify(items));

요친구를 참고삼아 로컬스토리지에 올리는 방식 생각해볼 것

 

https://8naji.tistory.com/71

240503 TIL 참고글

 

회고 - 요즘 자주 느끼는건 데 방법은 다양하다... 😂 다양한 방법을 사용해서 결과를 내볼 수 있도록 생각해볼 것

구글링을 엄청 열심히 하고 있다.. submit 구현시 새 창 로드 되는 것도 직접해보고, 리뷰창 값을 구하는 것도 해보는 중 .. 로컬스토리지에 값 가져오기도 해봤는데.. 어? 왜 되는거지? 함ㅋㅋㅋ 

const form = document.getElementById('myForm');

 

form.addEventListener('submit', function(event) {

event.preventDefault(); // 기본 동작 방지 (페이지 새로고침 방지)

const nameInput = document.getElementById('nameInput');

const name = nameInput.value;

const movieInput = document.getElementById('movieInput');

const movie = movieInput.value;

const textInput = document.getElementById('textInput');

const text = textInput.value;

 

// 입력된 값 처리

console.log('작성자 :', name, '/ 영화명 :', movie, '/ 내용 : ',text);

 

const newComment = document.createElement("li");

//const newName = document.createElement("b");

newComment.append( `${nameInput.value} - ${movieInput.value} - ${textInput.value}`); //배열로?

 

//console.log(newComment);

const commentsContainer = document.querySelector("#comments");

commentsContainer.append(newComment);

// 추가 작업 수행 (예: 서버로 데이터 전송)

});

 

//로컬스토리지 연습

const obj = {nameInput:'$(#text)'};

localStorage.setItem('user', JSON.stringify(obj));

console.log(localStorage);

 

for (let i = 0; i < localStorage.length; i++) {

const key = localStorage.key(i);

//get은 객체 읽기

const value = localStorage.getItem(key);

console.log(`${key}: ${value}`);