오늘의공부 Javascript

Javascript : 브라우저가 알아들을 수 있는 언어이다.

Q. 왜 브라우저는 Javascript만 알아들어요? HTML안에다 파이썬, Java 같은 언어를 써서 주면 안되나요?
A. 불가능한 이야기는 아닙니다. 다만, 이 "역사적인 이유 & 이미 만들어진 표준"이기 때문에, 모든 브라우저는 기본
적으로 Javascript를 알아듣게 설계되어있고, 모든 웹서버는 HTML/CSS/Javascript를 주게 되어있죠.

 

코드를 수려하게 짜는 것보따 깔끔하고 동작하게 짜는것이 핵심이다.

 

코드안에 정의해놓은 함수(hey())를 개발자도구에서 부를 수 있다.

개발자 도구가 왜 있는지 ? > 개발자도구에서 바로 수정할 수 있게 만들어둔 도구!!

*새로고침시 사용했던 것들은 사라진다@.@

 

 

[ 변수, 자료형, 함수, 조건문, 반복분 ]만 알면 원하는 로직을 다 만들 수 있다.'ㅅ'///

 

변수 ?

> 값을 담는 것

let a = 2  > a라는 박스에 2를 넣는 것

*덮어씌우기 가능!!

*문자열은 작은따옴표('')안에 넣어주기!!

*변수 이름을 지정할  때는 타인이 봐도 알아보기 쉽게 짓는다!!

다양한 변수를 사용하기 때문에 활용 목적에 맞는 이름을 주기 ('_' 사용등)

list형 자료형은 순서가 중요하다. list = [] 꺽쇠,,

 

let a_list = ['수박','참외','배']

a_list[0] = "수박"

a_list[1] = "참외"

a_list[2] = "배"

a_list[3] = undefind (값이 없다)

 

*javascript에 추가할 시 구글링 후 찾아넣기!!

a_list.push('감')

a_list =  ['수박','참외','배','감']

 

a_list[3] = "감"

 

딕셔너리형 = 자료형

일상생활에서 많이 쓴다.

너 생일이 언제니? 라고 물어보면 생일이라는 단어에 대응되는 날짜를 얘기해달라는 것

생일이라는 단어 = 키 값에 대응되는 값(value)를 얘기해달라는 것

 

let a_dict = {'name':'bob', age:27} (키:값, 키:값)

a_dict['name'] = "bob"

a_dict['age'] = 27

 

a_dict['height'] = 180 --추가하기

a_dict = {name: "bob", age: 27. height: 180} 로 결과가 나온다.

 

a_dict['fruits'] = a_list

 

a_dict

1. {name: "bob", age: 27, height: 180, truits: Array(4)}
1. age: 27
2. height: 180
3. name: "bob"
4. fruits: (4) ["수박", "참외", "배", "감"]
5. __proto__: Objec

a_dict['fruits'] =  ["수박", "참외", "배", "감"]

 

딕셔너리형과 리스트형은 서로 요소로 쓰일 수 있다는 점 꼭 알아두기'ㅅ'//

 

 

기본 함수

1. %

let a = 100

a % 7 =2 (a를 7로나눈 나머지)

a % 8 =4 (a를 8로나눈 나머지)

무엇인가 트래픽이 막 들어와 균등하게 나눌떄. 홀수 짝수를 구할때 쓰면 좋다.

 

2. >, <, >=, <=, ==, !=

크다, 작다, 같거나 크다, 같거나 작다, 같다, 같지 않다

 

3. 글씨 분리하기

let myemail = 'ran@gmail.com'

myemail.split('@') = (2) ["ran", "gmail.com"]

myemail.split('@')[1] = "gmail.com"

myemail.split('@')[1].split('.') = (2) ["gmail", "com"]

myemail.split('@')[1].split('.')[0] = "gmail"

 

*도메인 파악하기 해본 것,,, 꼭 하나하나 분리해가며 연습하기

 

함수

프로그래밍에서의 함수는 부르면 정해진 동작을 하는 것!!

예제 -sum이라는 함수의 이름은 내가 정한것 , return은 끝내고 나를 변신시켜줘! 라는 동작..

ex1.

function sum(num1, num2) {
    return num1+num2
}

 

let result = sum(2,3)

 

result = 5

 

ex2.

 

function mysum(num1, num2) {
    alert('안녕!')
    return num1+num2
}

let result2 = sum(2,3)

 

result2=팝업발생 후 더하기 진행하여 5를 결과 값으로 받아온다

 

조건문

 

if

**기본if문

 

if (   ) {

} else {

}

 

let age = 24

 

if (age > 20) {

 console.log('성인입니다')

} else {

console.log('청소년입니다')

}

 

=성인입니다

 

let sex = '남성'

if (age > 20 && sex == '남성') {

 console.log('성인입니다')

} else {

console.log('청소년입니다')

}

=성인 남성입니다.

 

*&& = and , || = or

 

if (age > 20) {

 console.log('성인입니다')

} else if (age >7) {

console.log('청소년입니다')

} else {

 console.log('아동입니다')

}

 

반복문

예를 들어 0부터 99까지 쓸 때,,반복문 사용,,

for (let i = 0; i < 10; i==) {

 console.log(i)

}

let people = ['철수','영희','민수','형준','기남','동희']

위 예제가 많이 등장하는 패턴

딕셔너리들을 이렇게 모아둔 리스트를 돌면서 필요에 맞는 딕셔너리를 if문으로 이렇게 값을 직어주는 패턴!!