[스파르타코딩] 앱개발 종합 1주차 정리

 

처음이라 그런지 1주차는 기본 방향및 소계와 JS 기본 문법 등을 배운다.

기본 문법은 어느정도 지식이 있어서 넘어간 느낌인데 

 

초반부에 안드로이드에 대해 설명하는 부분은 몰랐던 부분을 알게 되어서 좋았던거 같음

강의 하시는분이 설명 되게 잘하는거 같구, 언어 배울떄 사용하는 법이나 이런걸 찾아야되는게 많은데 

찾는 방법도 알려주는거 보니 좋은거 같음.

 

 

안드로이드, iOS 각각 개발언어(JAVA, Korlin, Swift)로 하는 건 네이티브 앱
웹 사이트를 만들고 껍데기를 씌워 간단히 배포하는 건 하이브리드 앱
크로스 플랫폼 앱 개발은 네이티브 앱과 하이브리드 앱 개발의 장점들을 모은것

 

언어는 변수, 리스트&딕셔너리, 조건문, 반복문, 기본 함수랑 함수 생성 하는것을 배움

실습은 크롬 브라우저에서 Devtools(Ctrl + Alt +i)를 열고 Console 에서 연습함

 

앱개발에 자주 쓰이는 Javascript 흠냥

리액트 네이티브는 항상 최신 버전의 자바스크립트 문법(ES6)을 사용한답니다! 
그렇기 때문에 여러분들이 공식문서를 볼때 당황하지 않고 적용하기 위해서!
그리고 기존 자바스크립트 보다 더 함축적이고 간결한 문법을 사용하기 위해! 배워봅니다.

 

[기존 방식]

let a = function() {
  console.log("function");
}
a();

[최신 방식]

let a = () => {
  console.log("arrow function");
}
a();.

 

딕셔너리에 있는 값을 꺼내 변수에 담을 때, 할당 과정을 거치기 않으면서 딕셔너리의 키 값 그대로 변수사용이 가능합니다.

//객체 
let blog = {
	owner : "noah",
	url : "noahlogs.tistory.com",
	getPost() { 
		console.log("ES6 문법 정리"); 
	}
};

//기존 할당 방식
let owner = blog.owner
let getPost = blog.getPost()

//비구조 할당 방식
let { owner, getPost } = blog;       
//각각 blog 객체의 owner , getPost() 의 데이터가 할당
//blog의 키 값과 이름이 같아야 해요!
//(예 - owner가 아니라 owner2를 넣어보세요! 아무것도 안 들어온답니다.)

** 앞으로 리액트 네이티브 앱을 만들며 가장 많이 사용할 방식**

//함수에서 비구조 할당 방식으로 전달된 딕셔너리 값 꺼내기
let blogFunction = ({owner,url,getPost}) => {
	console.log(owner)
	console.log(url)
	console.log(getPost())
}

blogFunction(blog)

 

최신 방식에서는 키보드에서 느낌표 옆에 있는 키인 백틱 ( ` ) 을 이용하여 문자열을 + 기호 없이 간단히 처리할 수 있습니다.
또한 백틱 ( ` ) 안에서는 여러 줄의 줄바꿈도 자유롭게 사용 가능합니다.

const id = "myId" ;
const url = `http://noahlog.tistory.com/login/${id}` ;

const message = "줄바꿈을 하려면 \n 이 기호를 써야 했죠!"

const message = ` 줄바꿈도 마음대로
사용이 가능합니다. `

 

 

기존에는 객체(딕셔너리)를 생성할 때, 필드명과 대입할 변수명이 같은 상황에서 다음과 같이 코드를 작성하였습니다.

[기존 방식]

var name = "스파르타";
var job = "developer";

var user = {
  name: name,
  job: job
}

console.log(user);
//{name: "스파르타", job: "developer"}

 

최신 방식으로는 다음과 같이 간결하게 작성할 수 있습니다.

[최신 방식]

var name = "스파르타";
var job = "developer";

var user = {
  name,
  job
}

console.log(user);
//{name: "스파르타", job: "developer"}

key: value 형태에서 단순히 변수명만 작성해주면 변수명과 동일한 필드가 생성되며, 그 변수값이 대입됩니다.

 

 

export는 자바스크립트의 값, 함수, 딕셔너리(객체) 또는 자바스크립트 파일 자체를 외부로 내보내는 키워드 이고 

import는 반대로 자바스크립트 파일 안으로 가져오는 키워드 입니다.

외부로 내보낸다는 건 밖에서 쓸 수 있게 준비한다는 의미이고, 내부로 가져온다는 것은 외부로 내보낸 것들을 가져온다는 의미입니다.

예컨대 util.js 파일이 있다고 가정해보겠습니다.

 

 

 

 

다시 정리할것 들만 ㅎㅎ...

---

사칙 연산, 변수 

 

리스트, 딕셔너리

---

 

 

 

합을 구하는 함수 만들기

---

 

 

리스트 안에 특정 값 찾기

---

 

 

 

숙제 하.. 

---

문제를 잘못 이해한건지... indexOf 는 정규식 사용 안되는거 같은데..

아 같이 하는게 아닌가 시브레... 일단 나눠서 올리긴했는데 찝찝하네.. 뭔가 삽질한 느낌인데...

function checkEmail(email){//1번
    if(email.indexOf('@') != -1){
        console.log('이메일이 맞습니다')
    }else console.log('이메일이 아닙니다.')
        
}

checkEmail('gunhee21@gmail.com') // 이메일이 맞습니다
checkEmail('gunhee21$gmail.com') // 이메일이 아닙니다.
//========================================
/* 문제가 indexof 이용 풀기, 정규식 사용 이라 해서 하는데.. 혹시..  1번2번 따로 해보시라 한건가여?? 묶어서 하시라는건지..
 indexOf 메서드 이용 정규식 사용은 안되거 같은데??? 사용 못하는게 맞나여? */ 


function checkEmail(email){//2번?
	regExp = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i
    if(email.indexOf(regExp) != -1){
        console.log('이메일이 맞습니다')
    }else console.log('이메일이 아닙니다')
        
}
//========================================
// match로 사용 하면 되긴하는뎅... 숙제 재대루 했나  모르겠네... 이번 건에 대해 답변해주심 감사하겠습니다!!
checkEmail('gunhee21@gmail.com') // 이메일이 맞습니다
checkEmail('gunhee21$gmail.com') // 이메일이 아닙니다.

function checkEmail(email){
	regExp = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;
    if(email.match(regExp) != null){ 
        console.log('이메일이 맞습니다')
    }else console.log('이메일이 아닙니다')
        
}

checkEmail('gunhee21@gmail.com') // 이메일이 맞습니다
checkEmail('gunhee21$gmail.com') // 이메일이 아닙니다.