분류 전체보기 (662) 썸네일형 리스트형 [2023 신입부원 기초 스터디] 이총명 5주차 - JS 입문 1 . JS란 JS는 Jeongmyeong is Sexy의 약자로 윙크 회장의 섹시함을 알리기 위해 만들어진 언어이다. (그럼 JMS 아님?) 2. JS 사용법 let 변수명; 이렇게 변수를 선언 할 수 있고 같은 변수명을 재선언 할 수 없다. (그냥 변수에 다른값을 넣는건 당연히 됨) const 상수명; 이렇게 상수를 선언 할 수 있고 이름 그대로 값을 바꿀 수 없다. console.log(내용); live server을 열고 개발자 도구를 연 뒤 콘솔창에서 로그를 볼 수 있다. 배열 const 이름 = [값] 이렇게 선언 할 수 있고 파이썬의 리스트와 유사한듯하다. 객체 const 이름 = {key : value} 이렇게 선언 할 수 있고 파이썬의 딕셔너리와 유사한듯하다. 3. 원시 데이터 타입 객체.. [2023 신입부원 기초 스터디] 조상혁 5주차 - JS가 뭐야? JavaScript란? 웹 브라우저에서 HTML 문서에 내장한 JavaScript 를 읽으면 즉시 해석되어, 소스코드가 실행된 결과를 눈으로 볼 수 있는 클라이언트 사이드( 프론트 엔드 ) 언어이다. 웹페이지에서 특정 부분을 클릭하거나 입력했을 때, '팝업 창 띄우기', '애니메이션 효과', '통신' 등의 다양한 기능들을 추가할 수 있다. html에 js 연결하는 방법 변수 let 변수명; 동일한 변수명으로를 재할당하면 오류가 생긴다. 상수 const 상수명; 상수는 선언후에 재할당이 불가하다 const 선언은 반드시 초기화를 해야한다 예시 const potato; #선언불가 올바른 예시 const potato = ''; console.log(변수명); 로그를 볼 수 있다 변수,상수 주의할 점 변수 상수.. [2023 신입부원 기초 스터디] 최종은 #5주차 JS 입문 1. 변수와 상수 변수: 변할 수 있는 값 let: 변수 작성 상수: 변할 수 없는 값(변수와 다르게 수정 불가능) const: 상수 선언 *변수 이름 규칙* 1.첫글자는 영어,$,_만 가능 2.첫글자 이외에는 숫자도 사용 가능 (Ex: _1234, &1234 등) 3.대소문자 구분 4.예약어 (Ex: let,const)사용 불가능 5.공백 불가능 기본적으로 const를 사용하고 값 변경이 필요하다면 let 사용 권장 var을 사용하지 않는 이유: var에서 개선된 const,let이 있기에 딱히 사용할 이유가 없음 2.원시 데이터 타입 number: 정수 bigint: -(2^53-1) ~ (2^53-1) 까지의 범위 표현 string: 문자열 문자열 따옴표: "" , '' 둘 다 사용 가능 백틱(ba.. [2023 신입부원 기초 스터디] 정찬우 4주차 안녕.js. html이랑 css은 살짝 맛을 봤고, 드디어 js를 배웠다. 프리코스때 살짝 했었어서 강의 듣는데 반가웠다 가장 먼저 js에서 변수 선언하는 방법은 3가지가 있다. 1. var(요즘에는 잘 안쓴다고 한다) 2. let - let은 말 그대로 우리가 평소에 사용하는 int, string처럼 사용하는 js용어이다. 하지만 let은 변수가 선언된 블록, 구문 또는 표현식 내애에서만 유효한 변수를 선언한다. 3. const -블록 범위의 상수를 선언한다. (let과 같은 블록 유효범위) 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없다. 그래서 처음 선언할 때, 반드시 초기화를 해야한다. 원시 데이터타입 vs 참조 데이터타입 원시 데이터타입 변수에 할당될 때, 메모리의 고정 크기로 원시 값을 저장하고 해.. [2023 신입부원 심화 스터디] 이정욱 #4주차 - 예제 만들기(연습 문제) 1. modal창 만들기 const openButton = document.querySelector(".open"); //open 버튼 불러오기 const container = document.querySelector(".container"); // close 버튼을 담은 container const closeButton = document.querySelector(".close"); // close 버튼 openButton.addEventListener("click", () => { //openButton 에서 click 이벤트 발생하면 container.style.display = "flex"; //container를 보여주고 openButton.style.display = "none"; //open.. [2023 신입부원 심화 스터디] 김윤희 #4주차 - Part 6(예제만들기) 1. modal 만들기 const openButton = document.querySelector(".open"); const container = document.querySelector(".container"); const closeButton = document.querySelector(".close"); openButton.addEventListener("click", () => { container.style.display = "flex"; openButton.style.display = "none"; }); closeButton.addEventListener("click", () => { container.style.display = "none"; openButton.style.display .. [2023 신입부원 심화 스터디] 황현진 #4주차 - 예제 만들기(연습 문제) 1️⃣ 모달 만들기🔘 const openButton = document.querySelector(".open"); const container = document.querySelector(".container"); const closeButton = document.querySelector(".close"); openButton.addEventListener("click", () => { // open 버튼을 눌렀을 경우 container.style.display = "flex"; openButton.style.display = "none"; // open 버튼을 없애주는 기능 }); closeButton.addEventListener("click", () => { // close 버튼을 눌렀을 경우 c.. [2023 신입부원 심화 스터티] 박지민 #4주차 Part. 6 예제 만들기 (연습문제) 그동안 강의를 통해 배운 js를 이용하여 예제 만들기 1. 모달 만들기 👉 Click 버튼을 누르면 모달 내용만 보이고 Close 버튼 누르면 👉 Click 버튼만 보이기 - index.html 👉 Click Lorem, ipsum dolor. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Reiciendis, excepturi? Close - style.css ... .container { position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; display: none; // 기본 container 클래스의 display는 none 속성 -> 첫 화면에 보임 X flex-directi.. 이전 1 ··· 57 58 59 60 61 62 63 ··· 83 다음
