전체 글 139

연산자

연산자+더하기 연산자우선순위는 문자열console.log(1+1); // 2console.log(1+"1"); // 11 -빼기 연산자우선 순위는 숫자console.log(1 - "2"); // -1console.log(1 - 2); // -1 *곱하기 연산자우선 순위는 숫자console.log(2*3)  // 6console.log(2:*3); // 6 / 나누기 연산자console.log(4/2); // 2console.log("4"/2); // 2  %나머지 연산자나누기 연산자 (/) vs 나머지 연산자 (%) console.log(5/2); // 2.5 console.log(5%2; // 1 등호연산자 (=) let x = 10; 더하기 등호 연산자(+=)x += 5;x = x+5와 같음 빼기 등..

데이터 타입, 문자열( 길이 확인, 결합, 자르기, 검색, 대체, 분할, 형 변환)

숫자 (정수)let num = 10;console.log(10);  // 10 console.log(typeof num);  // number실수 (float)let num2 = 3.14; console.log(num2); // 3.14 console.log(typeof num2); // number 지수형(Exp)let num3  = 2.5e5; console.log(num3); // 250000 console.log(typeof num3); // number NAN(: Not a Number)let num4 = "Hello" / 2; // NAN Infinity: 무한대let num5 = 1 / 0; console.log(num5); // Infinity console.log(typeof num5);..

변수와 상수

콘솔 보는방법: 상단 Terminal → New Terminal → node 파일명 입력 콘솔창 모두 지우는 방법: clear 입력  주석사용 방법: //코드를 처리하지 않음 변수값을 메모리에 저장 및 읽어들여서 재사용 변수명:저장된 값의 고유 이름 변수의 값: 변수에 저장된 값 변수 할당: 변수에 값을 저장하는 행위 변수 선언:변수를 사용하기 위해 컴퓨터에 알리는 행위 변수 참조:변수에 할당된 값을 읽어오는 것 변수를 선언할 수 있는 세가지 방법varletconst

자바스크립트 소개

프로그래밍 언어0과 1밖만 아는 컴퓨터에게 대화를 시도한 방법브라우저 동작 스크립트 언어크롬, 마이크로소프트 엣지 객체지향 프로그래밍이 가능객체를 생성하고 관리하는데 강점이 있음복잡한 기능 구현 가능 객체지향절차지향묶어서 처리순서대로 처리한 번에 묶어서 처리(함수를 객체라는 그룹으로)(객체는 상태와 행동을 가지고있으며 상태는 객체의 속성(프로퍼티(property)라고도 함)첫번째 일 처리 후 두번째 일 처리재활용 가능-      프론트앤드(FrontEnx) + 백앤드(BackEnd) + 디비(MongoDB) = 풀스택(FullStack) UX (User Experience)사용자 경험사용자들이 얼마나 프로그램을 사용하는가

변수 var, let, const와 변수 선언 규칙

변수데이터 저장 공간사용하는 방법: 적절한 변수 이름 = 할당해 줄 데이터; 1. 암시적 선언자바스크립트에서 제공하는 변수 선언 키워드 (var, let, const)를 사용하지 않고 선언하는 것- 권장하지 않음 2. 명시적 선언자바스크립트에서 제공하는 변수 선언 키워드 (var, let, const)를 사용하여 선언하는 것   var초창기 변수 선언 키워드변수의 중복 선언/ 재정의 가능대규모 프로젝트 시, 위험성이 발생할 가능성이 높음같은 프로젝트를 진행하는 개발자 A와 B가 있다.개발자 A가 var 키워드로 num변수를 사용했는데B개발자가 var 키워드로 똑같은 num 변수를 재정의를 했다.... var num1 = 5; console.log(num1); // 5 var num1 = 10; conso..

다시 공부 2024.07.27

자바스크립트로 <div> 만들기

html에서 의 부모를 생성한다.                            내가 만들 태그의 위치 -->                      → 자바스크립트에서 를 생성한다.const card = document.createElement('div');let imgTag = document.createElement('img'); imgTag.src= `https://image.tmdb.org/t/p/w300${movie.poster_path}`; card.innerHTML = `${movie.original_title}`; card.appendChild(imgTag);  movieContainer.appendChild(card); →  css 설정/* 영화 목록 전체 div */.movie-con..

로그인 기능 구현하기

1. 아이디 한글입력 방지// 아이디 텍스트 박스에 한글 입력 방지// 입력 방지할 문자열 종류 선택const korean = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/;// 입력 요소 선택const idTbx = document.querySelector('.login-id_Tbx');idTbx.addEventListener('input', funtion() {    if (korean.test(idTbx.value)) {        // 한글을 제거        idTbx.value = idTbx.value.replace(korean, ' ');        alert('아이디에는 한글을 입력할 수 없습니다.');   }});   2. 비밀번호 암호화 .클래스명 {                           -..

한글 입력 제한하기

한글: /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/const check_Korean = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/;       if (check_Korean.test(값)) alert('한글입니다.');       // 아이디 텍스트 박스에 한글 입력 방지      // 1. 입력 방지할 문자열 종류 선택const korean = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/;      // 2. 입력 요소 선택const idTbx = document.querySelector('.login-id_Tbx');idTbx.addEventListener('input', funtion() {    if (korean.test(idTbx.value)) {        // 3. 한글을 제거        idTbx.value = idTbx.valu..

1차 수업

변수 (= 변하는 수)변수는 값을 넣고 재활용하는 용도로 쓰인다.Hello World를 10번째, 100번째 줄에 치거나,1,000개, 10,000개를 쓰거나,Hello를 My로 변경해야 한다면엄청 많이 변경을 해야한다.하지만, 변수를 사용한다면 그럴 필요가 없다. const word = "Hello World";console.log(word); 변수명: word변수 값: Hello World변수 선언: const word변수 참조: console.log(word)메모리에 저장하는 과정변수 할당: const word = "Hello World"; 데이터 타입숫자 ( = 정수, 실수)문자열 문자열의 길이변수.length; 문자열 대체변수.replace("변경 전 문자열", "변경 후 문자열"); 문자열 반..

시나리오, 코드 및 기본 화면 구성 질문

개인 프로젝트 과제가 하나 나왔다!'영화 검색하기'!작년에 포트폴리오 작성 이후로오랜만이다.그래서 설레기도 하고 기대되기도 한다.화면 구상과 시나리오를 짜기 전,궁금한게 생겨서 튜터님한테 질문을 하러갔다.내가 아이멕에서 일 하면서 궁금하기도 했다.왜? 싶었지만 그 때는 물어보지 못했다. 1. 코드는 무조건 짧고 간결하게 짜야하는가. 정답은 No! 꼭 그럴 필요는 없고 무조건 짧고 간결하게 짜야한다 라는건 강박적인 생각이다.게다가 너무 줄이면 가독성이 떨어지는 경우도 있다고 한다. 2. 디자인은 사람들이 자주 이용하는 사이트를 참고하는 것이 좋은가. 정답은 Yes! (네이버, 구글, 한글, 엑셀, ppt등)하지만 지금은 자바스크립트 공부가 우선이기 때문에 너무 디자인에 집중하지 않아도 된다고 하셨다. 3...

질문 2024.07.22