Front-End78 [JavaScript] Math.random() 함수 Math.random() 랜덤 값(난수)를 생성하기 위한 함수입니다. const random = Math.random() : 0 ~ 1 까지의 실수값을 반환합니다. Math.random을 정수로 만들기 let random = Math.random(); console.log(random); // 0.4651739512038373 //random * 10 // 4.651739512038373 // 1 ~ 10이 나오고 싶다면 let result = Math.floor(random * 10) + 1; // floor(버림), ceil(올림), round(반올림) console.log(result); //5 출력값이 나온다. 위 코드블럭을 보면 Math.floor라는 메소드를 많이 사용한다. Math.floor.. 2020. 12. 21. [JavaScript] 자바스크립트 제어문, 조건문, if문, switch문 제어문 제어문에는 조건문과 반복문 2가지의 종류가 있다. 1.조건문 프로그램 내에서 주어진 조건문의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문입니다. if문 switch문 1) if문 👈🏻 if로 시작한다고 해서 if문이다 조건식이 있기때문에 무조건 결과는 true / false 가 나와야한다. 범위에 대한 조건을 줄 때 유리합니다.(어디서부터 ~ 어디까지) 1. if문 if(조건식){ 조건식의 결과가 참(ture)일 때 실행할 문장; } ❓허나 꼭 중괄호{}가 필요한 것은아니다. if(조건식) 실행할문장; if문의 조건에 맞으면 그 다음 문장(한 문장)을 무조건 실행시켜주기때문이다. 중괄호{}를 사용하는 이유는 실행할 문장이 여러줄일 경우에는 중괄호를 써야한다. if(조건문); 세미콜론을 여.. 2020. 12. 20. [HTML] div 태그 대신 li 태그를 사용하는 이유 웹페이지를 코딩하다 보면 div태그가 매우 많을 것을 볼 수 있을 것이다. 항목을 나열하기 위해서 div태그를 많이 사용하는데, 최근 대기업이나 잘나가는 스타트업들의 홈페이지를 들어가보면 div 태그 대신 ul-li태그를 이용하여 항목을 나열해놓은 사이트들을 볼 수 있다. 왜? 태그가 아니라 태그를 사용한 걸까? 예전에는 (아마도 여전히) 각 브라우저가 공백, 여백 등과 같은 요소를 나열하는 데 고유한 작은 서식을 추가했기 때문에 많은 사람들이 div를 사용하는 것을 선호합니다. 아무도 서식을 없애거나 브라우저를 감지하기 위해 많은 코드를 추가하기를 원하지 않기 때문입니다. 허나 요즘은 웹의 중요성이 올라갔습니다. 전가기기들의 기술들이 올라가면서 웹을 사용하는 사람들이 굉장히 많아졌죠. 이 말은 즉슨 장.. 2020. 12. 18. [JavaScript] 자바스크립트 연산자 모든 것 연산자(Operator) 1. 산술 연산자 산술 연산자는 사칙연산 및 기본적인 연산을 하는 연산자입니다. + : 덧셈 - : 뺄셈 * : 곱셈 / : 나눗셈 % : 나눗셈을 하고 난 나머지 값 ( 예 : 10 % 3 = 1 ) ** : 거듭제곱 2.비교 연산자 비교 연산자는 피연산자 사이의 상대적인 크기를 판단하여 참 또는 거짓을 반환합니다. > : 왼쪽 값이 오른쪽 값보다 크면 참을 반환한다. = : 왼쪽 값이 오른쪽 값보다 크거나 같으면 참을 반환한다. num2; console.log(`num1 > num2 : ${result}`); result = str2 num2 ? num1 : num2; console.log(`입력한 두 수 중 큰 수는 $.. 2020. 12. 18. [JavaScript] 자바스크립트 대화상자 (prompt, alert, confirm) 자바스크립트의 대화상자 window.alert( ) : 사용자에게 메시지를 보여주고, 확인을 기다린다. alert( ) 👈🏻 window는 생략 가능하다 alert window.confirm( ) : 사용자에게 메세지를 보여주고, 확인이나 취소를 누르면 그 결과를 불린값으로 반환한다. ok를 눌리면 true no를 눌리면 false로 반환된다. confirm( ) 👈🏻 window는 생략가능하다 const result = confirm('확인 또는 취소를 눌려주세요.'); console.log(result); confirm window.prompt( ) : 사용자에게 메세지를 보여주고, 사용자가 입력한 문자열을 반환한다. prompt( ) 👈🏻 window는 생략가능하다 const name = promp.. 2020. 12. 18. [JavaScript] 자바스크립트 타입변환, 묵시적 타입변환, 명시적 타입변환 자바스크립트의 타입 변환 자바스크립트의 변수는 타입이 고정되어 있지 않으며, 같은 변수에 다른 타입의 값을 대입할 수 있습니다. a = 10; // 숫자형 a = "10"; // 문자열형 👉🏻 a의 값이 숫자형에서 문자열형으로 바뀌어버린다. 1. 묵시적 타입 변환 자바스크립트에서는 특정 타입의 값을 기대하는 곳에 다른 타입의 값이 오면, 자동으로 타입을 변환해서 사용한다. const a = "10"; const b = "20"; const result = a + b; console.log(result); // 1020 result = a - b; console.log(result); // -10 result = a * b; console.log(result);// 200 const c = "문자"; re.. 2020. 12. 13. [JavaScript] 자바스크립트 데이터 타입 자바스크립트 데이터 타입 타입이란 프로그램에서 다룰 수 있는 값의 종류를 의미합니다. 1. 숫자형(number) 자바스크립트는 다른 언어와 달리 정수와 실수를 따로 구분하지 않습니다. 모든 수를 실수 하나로만 표현한다. 최고👍🏻 2.문자열형(string) 자바스크립트에서는 문자열을 쌍따옴표나 따옴표로 둘러싸인 문자의 집합을 의미합니다. const str1 = "오석민 : '여러분 반갑습니다!'"; const str2 = '오석민 : "여러분 반갑습니다!"'; const str3 = "＼"안녕하세요. ＼n자바스크립트＼""; const str4 = `자바스크립트에서는 문자열을 쌍타옴표나 따옴표로 둘러싸인 문자의 집합을 의미합니다.`; // `(백쿼트) 문자열을 혼합해서 사용할 때 백쿼트를 사용하면 편해진다... 2020. 12. 13. [JavaScript] 변수 let, 상수 const, var 차이 💻프로그래밍 컴퓨터의 프로그램을 작성하는 일. 일반적으로 프로그램의 작성 방법의 결정, 코딩, 디버깅 등의 작업 모두를 가리킵니다. 변수(Variable) 변수 란 데이터를 저장할 수 있는 메모리 공간을 의미합니다. 값이 변경될 수 있으며 자바스크립트에서는 let 키워드를사용하여 변수를 선언하고 선언되지 않은 변수를 사용하려고 하거나 접근하려고 하면 오류가 발생합니다. 자바스크립트는 변수 자체가 객체화 되어있다. 나중에 값을 바꿀 수 있다면 다 변수이다. 객체는 자기가 혼자서 뭔가 할 수 있는 것들이다. let 변수명; // 변수를 선언 let a; // 프로그램은 오른쪽부터 읽는다 변수명 = 값; // 변수의 초기화 a = 10; console.log(a); let ECMA Script 6 부터 변수 .. 2020. 12. 11. SASS(SCSS) 란 ? CSS Preprocessor 란? HTML, CSS를 다루는 분이라면 한 번은 Sass에 대해 들어봤을 것이다. Sass는 CSS 전(예비)처리기 이고, 보통 CSS Preprocessor 라고 부른다. CSS가 동작하기 전에 사용하는 기능으로, 웹에서는 분명 CSS만 동작하지만 CSS의 불편함을 이런 확장 기능으로 편하게 사용할 수 있다. 사스는 기초 언어에 힘과 우아함을 더해주는 CSS의 확장이다. 어떻게 사용하나요? 웹에서는 CSS만 동작한다. Sass, Less, Stylus 같은 전처리기는 직접 동작시킬 수 없다. CSS는 불편하니 일단 배제하고 우선 전처리기로 작성(코딩)한다. 단, 웹에서는 직접 동작하지 않으니 이렇게 작성한 전처리기를 웹에서 동작 가능한 표준의 CSS로 컴파일(Compil.. 2020. 12. 10. 이전 1 ··· 4 5 6 7 8 9 다음
