All'alba vincerò

At dawn, I will win!

Javascript 77

[Coding Apple] 가격순 정렬 / array 정렬 + array 함수

array 정렬 숫자 정렬 오름차순 array.sort(function(a, b) { // a, b => array 안의 데이터 (ex. 7, 3) return a - b // (a-b)의 결과가 양수면 a는 오른쪽으로 이동 // 음수면 b가 오른쪽으로 이동 }); 내림차순 array.sort(function(a, b) { return b - a }); 문자 정렬 오름차순 array.sort(); 내림차순 array.sort(function(a, b) { if (a > b) return -1; // 음수 if (a < b) return 1; // 양수 return 0; // 같은 글자 }); array + object의 정렬 [ { }, { }, { } ] array.sort(); 사용 object.ke..

[Coding Apple] 상품 더보기 / Ajax

상품 더보기 / Ajax 서버 : 유저가 데이터 달라고 요청을 하면 데이터를 보내주는 간단한 프로그램 서버와 유저는 문자 자료만 주고 받을 수 있다. 서버에 데이터를 요청 시 확인 1. 어떤 데이터인지 url로 기재 2. 어떤 방법으로 요청할지 결정(GET/POST 등) GET 요청 : 서버에 있던 데이터 읽기 - 브라우저 주소창에 url 적으면 그 곳으로 GET요청을 날린다. POST요청 : 서버로 데이터 보내기 - 태그로 폼이 전송되었을 때 POST요청을 날린다. 단점: GET / POST 요청 시 브라우저가 새로고침 됨 => Ajax 사용 Ajax (Asynchronous JavaScript And XML = 비동기 자바스크립트와 XML) : 서버에 GET, POST 요청을 할 때, 새로고침 없이 ..

[Coding Apple] 장바구니 기능 / local Storage

local Storage 데이터를 반영구적으로 저장하기 브라우저 안에 몰래 데이터 저장 가능 Local Storage : [키 : 값] 형태로 데이터 저장 (반영구) Session Storage : [키 : 값] 형태로 데이터 저장 (일회용) IndexedDB : 구조화 된 대용량 데이터 저장 Cookies : 유저의 로그인 정보 저장 Cache Storage : html, css, js, img 파일 저장해두는 공간 local Storage [이름 : 값] 형태로 저장 가능 5MB의 문자/숫자만 저장 가능 * 차이점! Local Storage = 사이트 재접속해도 유지 (반영구) Session Storage = 사이트 나가면 자동 삭제 (일회용) local Storage에 데이터 저장하기 localSt..

JS 혼공 - 가비지 컬레션(GC), 메서드, this

가비지 컬렉션 : 도달하지 못하는 값은 삭제 * 도달 가능한 값 : 접근하거나 사용할 수 있는 값 * 루트 : 현재 함수의 지역 변수와 매개변수, 중첩 함수의 체인에 있는 함수에서 사용되는 변수와 매개변수, 전역 변수 등 - 루트가 참조하거나 루트에서 참조할 수 있는 값은 도달 가능한 값이 된다. 메서드 : 객체 프로퍼티에 행동할 능력을 부여하는 함수 사용법 : 객체.메서드명 = 함수표현식 or 선언된 함수; 새로 함수 선언 let user = { name: "Nadia" age: 23 }; user.sayHi = function() { // 함수 선언 --> 객체 프로퍼티 user.sayHi에 함수 할당 alert("안녕하세요!"); }; user.sayHi(); // 안녕하세요! -----------..

Javascript 2023.12.19

JS 혼공 - 객체 복사 Object.assign

원시값 - 값이 복사 객체값 - 참조값이 복사 객체의 동작 방식 : 객체가 저장되어 있는 메모리의 주소(참조값)이 저장, 복사된다. let user = {name: "Nadia"}; let admin = user; admin.name = "Pete"; // admin의 참조값은 user의 참조값과 같다. alert(user.name); // Pete 출력 객체 참조값 비교 참조에 의한 복사 let a = {}; let b = a; alert(a==b); // true alert(a===b); // true 독립된 개체 let a = {}; let b = {}; alert(a==b); // false 객체 복사 Object.assign : Object.assign(목표 객체, 복사 객체 1, 2...) -..

Javascript 2023.12.19

JS 혼자 공부하기 (2)

변수 : 변하는 수 변수 선언 var 변수이름 = 초기값; - 초기값은 없어도 가능 - 문자, 문자열도 넣을 수 있음 boolean : true or false 두 가지 값만 가짐 undefined : 변수를 선언했으나 값을 지정하지 않은 것 null : 값이 유효하지 않은 것 typeof(변수 이름) : 해당 변수의 자료형을 알려주는 함수var num = 1; var name = "나디아"; var man = true; var age; doucument.write(typeof(num)); // number doucument.write(typeof(name)); // string doucument.write(typeof(man)); // boolean doucument.write(typeof(age));..

Javascript 2023.12.07

JS 혼자 공부하기 (1)

prompt 함수 : 사용자가 입력창에 입력한 값을 받는 함수 (JAVA의 Scanner) 사용법 prompt("문장"); - 입력창에 문장이 표시됨 - 입력창에 내용을 입력하면 콘솔창에 입력 받은 내용이 나옴 prompt("문장", "기본값"); - 입력창에 문장이 표시되고, 기본값이 자동으로 채워져있음prompt("이름을 입력하세요.", "나디아"); alert 함수 : 알림창에 출력되는 함수 사용법 alert("문장");alert("안녕하세요"); document.write 함수 : 화면에 출력되는 함수 사용법 document.write("문장");var name = prompt("이름을 입력하세요.", "나디아"); document.write(name + " 님, 안녕하세요!"); // 출력 결과..

Javascript 2023.12.06