24년 08월 30일

오전

부트스트랩 사용법 배우는 중

부트스트랩 만으로 만든 웹페이지 양식

 

부트스트랩 만으로 레이아웃 만들어보기 하는 중

---

 

<table>

tr td

</table>

테이블 생성

---

오전 마지막 시간 자바스크립트 시작

---

오후

javascript

• undefined
• null
• 둘의 차이 *** : undefined은 변수를 선언하고 값을 할당하지 않은 상태, null은 변수를 선언하고 빈 값을 할당한 상태(빈 객체)이다. 즉, undefined는 자료형이 없는 상태이다.

변수이름 선언할 때 보통 카멜표기법 많이씀 , 함수 이름도

(첫글자 소문자. 단어 시작할 때 대문자)

defer :

defer 속성

defer 속성은 스크립트를 '백그라운드'에서 다운로드한다.

그리고 defer 스크립트는 일반 스크립트와 마찬가지로, 순서를 지키며 실행되므로 앞선 script가 무겁고 뒤의 스크립트가 가볍다고 해도 순서대로 실행된다.

---

자료형

js도 일단 언어

• string : 문자열 자료형
• number : 숫자형
• object : 객체
• null : 없는 값을 지정한 것
• undefined : 값을 아직 지정하지 않음
• boolean : 참, 거짓 판별 (값이 없다면 false)

---

또한 null 에는 유명한 버그가 존재한다.

console.log(typeof null); // "object"

typeof 연산자를 사용하게 되면 object 를 반환한다. 이는 명백한 버그이지만, 수정하게되면 null 을 사용하는 수많은 스크립트에 문제가 발생할 것으로 예상되어 고칠 수 없게 되었다.

(js null 에 대해 검색하다 나온 신기한 지식..)

---

document.write()

말 그대로 괄호 안에 들어가있는 것을 페이지에 "쓰는(출력하는)" 함수이다

console.log()

콘솔 창에서만 나옴

let 과 const

• const : const 선언은 블록 범위의 상수를 선언합니다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없습니다 ,, 그러니까 이거 한번 선언하면 못바꾼다는 뜻임

// 문자열 선언
const myString = "Hello, World!";

// 숫자 선언
const myNumber = 42;

// 불리언 선언
const myBoolean = true;

// 배열 선언
const myArray = [1, 2, 3];

// 객체 선언
const myObject = { name: "John", age: 30 };

// 함수 선언
const myFunction = function() {
console.log("Hello, World!");
};

// 객체의 속성 변경 가능
[myObject.name](<http://myobject.name/>) = "Jane"; // 가능

// 배열의 요소 변경 가능
myArray.push(4); // 가능

java나 파이썬이랑은 약간 다른 느낌?

const 하나에 모든 자료형이 선언가능한데 ? 그러면 그냥 선언할때는 다 const 로 선언해버리면 되겠네? 편한듯?

• let : 변수에 재할당이 가능함

재선언은 불가능 재할당이 안됨.

선언할때는 기본적으로 const를 사용하는게 좋다고함

근데 재할당이 필요한 경우에 한정해서 let을 사용하는 것이 좋음.

        console.log('Test : ${1+2+3} ');
        console.log(`Test : ${1+2+3}`);
        let tmp = "value";
        console.log(`Test : ${tmp}`);

	/따옴표와 백틱의 차이

따옴표와 백틱의 차이

• 따옴표 :

보통 스트링(String) 값을 선언할 때 따옴표를 아래와 같이 많이 쓴다.

• 백틱 :

백틱의 경우 ${}를 통해 변수를 넣어 사용할 수 있는데 이를 템플릿 리터럴이라 부른다. ( ES6 이후 )
한번 아래 코드를 확인해보자

---

(근데 파이썬이나 자바에서는 그냥 그런거 없이 막 재할당하지 않나?)

Object : 객체

    const poppi = {
            // 속성(필드)
            name: "뽀삐",
            kind: "포메라니안",
            age: 1
        }
					 //poppi 라는 속성 지정 ,, 파이썬의 딕셔너리 같은 객체 지정
					 

화살표 함수

선언 할 때 = 가 아니라 : 로 함수를 만든다 why ?

            accel: () => {
       
                    // myCar.owner + "속도를 증가합니다";
                    alert(
                    myCar.speed = myCar.speed+10
            )
            },
            break: () => {
                alert(
                    
                    myCar.speed = myCar.speed-10
                );
            },
            toString: () => {
                alert(
                    "소유자 :" + myCar.owner + "\\n차종 :" + myCar.cat + "\\n유종 :" + myCar.fuelkind + "\\n속도" + myCar.speed);

            }

여기서 accel 은 함수 이름이 아니고 myCar 객체 안의 또 다른 accel 이라는 객체이기 때문에 = 대입연산자가 아닌 : 을 사용한다.

배열 배우는중 (4시)

자바스크립트 배열도 다양한 데이터 타입 사용 가능

인덱스 사용가능

배열도 const 로 선언

---

console.log() 할 때 + 아니고 , 로 붙임

 console.log("속도", myCar.speed);

---

오늘 js를 배우면서 느낀 점 : 내가 전에 배우던 java와 파이썬과 다르게 const 라는 변수선언법이 범위가 매우 추상적인 느낌이라 많이 헷갈린다. int나 string 같은 자료형을 콕 집어서 변수를 선언하는 것이 아니라 그냥 const 를 붙여서 전부다 변수를 선언해버리니까 편하다면 편한데 헷갈린다면 헷갈린다..