자바스크립트 중급 강좌 : 140분 완성

แชร์
ฝัง
  • เผยแพร่เมื่อ 4 ก.ค. 2024
  • 안녕하세요. 코딩앙마 입니다 :)
    자바스크립트 중급 강좌도 하나의 영상으로 만들어 달라는 요청이 있어서 제작하게 되었습니다.
    크롬에서 Codepen 이나 JSFiddle 같은 웹에디터를 사용했을때 alert/prompt/confirm 같은 기능이 제대로 동작하지 않습니다.
    2021.07 참고: www.chromestatus.com/feature/...
    파이어폭스등 다른 브라우저를 사용하시거나, 크롬 개발자 도구의 console 탭에 직접 작성하시길 추천 드립니다.
    ----------------------------------------
    이 수업은 중급 자바스크립트 수업으로, 자바스크립트 기초 지식이 있으신 분들 대상으로 진행합니다.
    This video is an intermediate JavaScript(ES6) tutorial.
    재생목록 링크 : • 자바스크립트 중급 강좌
    00:00 Intro
    00:09 변수
    05:04 생성자 함수
    10:40 객체 메소드(Object methods), 계산된 프로퍼티(Computed property)
    19:18 심볼(Symbol)
    25:30 숫자, 수학 method (Number, Math)
    31:41 문자열 메소드(String methods)
    40:02 배열 메소드1(Array methods)
    52:38 배열 메소드2 (sort, reduce)
    1:03:19 구조 분해 할당 (Destructuring assignment)
    1:07:48 나머지 매개변수, 전개 구문(Rest parameters, Spread syntax)
    1:18:18 클로저(Closure) 5분만에 이해하기
    1:23:33 setTimeout / setInterval
    1:26:42 call, apply, bind
    1:33:41 상속, 프로토타입(Prototype)
    1:42:59 클래스(Class)
    1:53:08 프로미스(Promise)
    2:05:35 async, await
    2:10:47 Generator
    이 영상이 어려우시면..
    왕 초보 자바스크립트 : • 왕 초보 자바스크립트
    #자바스크립트 #javascript #중급 #강좌
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 192

  • @rynjang72
    @rynjang72 3 ปีที่แล้ว +16

    1:24:26 부분에서 const tId=function showName(name); 하면 함수 이름이 tId가 되서
    setTimeout(showName, 3000, 'Mike'); 부분에서 'showName is not define' 에러가 나는것 같습니다...
    const tId를 빼던지, setTimeout(tId, 3000, 'Mike') 로 바꿔야 되는거 아닐까요??
    정확하게 아는것이 아니라 아시는분들 답변 부탁드립니다... ㅠ_ㅠ

    • @codingangma
      @codingangma  3 ปีที่แล้ว +10

      엇 강의 자료가 잘못되었네요 ㅠ
      const tId = 의 위치가 아래쪽으로 옮겨져야 합니다.
      const tId = setTimeout.. 으로 사용하는게 맞습니다.
      오류 찾아 주셔서 감사합니다!

    • @codingangma
      @codingangma  3 ปีที่แล้ว +4

      1:24:38 처럼요!

    • @rynjang72
      @rynjang72 3 ปีที่แล้ว +3

      @@codingangma오오 넵!! 질문 답변 감사합니다!!!좋은 강의도 정말감사합니다!!!!!! 총 복습하기에 정말 좋은 강의입니다!!!!

  • @ill-young
    @ill-young 3 ปีที่แล้ว +10

    내용이 함축적이며 진짜 알차고좋네요. 복습할땐 이만한 강의는 없을듯

  • @user-xy4xb2er5h
    @user-xy4xb2er5h 2 ปีที่แล้ว +1

    와 정말 감사합니다.
    호이스팅, 스코프 이런거 정말 이해가 안됐었는데 너무 쉽게 설명해주시네요.
    한번에 이해했습니다.

  • @dev_jeongdaeri
    @dev_jeongdaeri 2 ปีที่แล้ว +2

    오늘도 감사합니다! 🔥👨‍💻🏄‍♂️

  • @user-fj5lr4ow3s
    @user-fj5lr4ow3s 2 ปีที่แล้ว +1

    정말 감사합니다 아주 담백하고 딱 필요하고 단시간안에 할 수 있고 목소리도 나긋해서 너무좋습니다 ^^

  • @cindyhall8156
    @cindyhall8156 2 ปีที่แล้ว +4

    제가 봤던 기초 강의 중 가장 이해하기 쉽고 단계적으로 잘 설명을 해 주셔서 많은 도움 얻고 있습니다. 너무 감사드려요.

  • @hopejong
    @hopejong ปีที่แล้ว

    참 쉽게 설명하시고, 명료한 강의 구성에 진심으로 감사드립니다. 정말 많은 도움이 됩니다.^^

  • @airglitter6095
    @airglitter6095 2 ปีที่แล้ว +1

    자바스크립트 입문 강의만 몇 개를 듣다가 포기하다가 또 듣다가 포기하기의 반복인데 이젠 진짜 제대로 해 볼 거예요 ㅠㅠㅠㅠ 쉽게 알려주셔서 좋네요,,

  • @user-fb3gy7ph3v
    @user-fb3gy7ph3v 3 ปีที่แล้ว +1

    코딩앙마님 덕분에 공부가 재밌습니다

  • @user-ht4pt6lh4y
    @user-ht4pt6lh4y 2 ปีที่แล้ว +1

    잘보고 있습니다! 깔끔한 강의 감사드립니다! 목소리가 너무 멋지세요!!!

  • @user-ng1hs4lx4u
    @user-ng1hs4lx4u 2 ปีที่แล้ว +1

    양질의 강의 정말 감사합니다.

  • @howtopeoplesnameisumjunsik
    @howtopeoplesnameisumjunsik 2 ปีที่แล้ว

    감사합니다 선생님 재밌게 공부하고있습니다!

  • @user-vm3pk2pp2b
    @user-vm3pk2pp2b ปีที่แล้ว +2

    이야 중급 드디어 다 들었습니다.!!아직은 초보라 머릿속에 많은 기억이 나질 않지만 지속적으로 반복해서 들으면 저도 한 걸음 성장하겠죠! 감사드립니다. 코딩앙마님^^

  • @user-be9he5pk2m
    @user-be9he5pk2m 3 ปีที่แล้ว +1

    검색하다가 우연히 보게 됐는데 일단 듣기전에 구독좋아요 박고 들으러갑니다! 최신 js 강좌를 찍어주시는분이 계셨군요 :) 잘 참고하겠습니다.

  • @user-kj5ow7pu3y
    @user-kj5ow7pu3y 4 หลายเดือนก่อน

    좋은강의 올려주셔서 감사드립니다 ❤

  • @EK-rp8jp
    @EK-rp8jp 2 ปีที่แล้ว +1

    주기적으로 복습하러 오는 영상 🥰

  • @Mac-vz2lm
    @Mac-vz2lm ปีที่แล้ว

    감사합니다
    자바스크립트 기초 공부에 큰 도움이 되었습니다 !

  • @user-zx5zx6xm2s
    @user-zx5zx6xm2s 2 ปีที่แล้ว

    진짜 코딩 앙마님 감솨합니다 흑흑 ㅠㅠ 너무 유용유용해용

  • @user-mz3ig9is8u
    @user-mz3ig9is8u ปีที่แล้ว +2

    이야~ 내용이 진짜 꿀이다 꿀. 맛있다!

  • @Nallari3004
    @Nallari3004 2 ปีที่แล้ว +1

    이걸 취업하기전에 알았다면...이렇게 고생하지않았을텐데...
    정말 주말에 매일 보러 와요 최곱니다

  • @user-cq4cr7qu4b
    @user-cq4cr7qu4b 3 ปีที่แล้ว +20

    10년넘게 개발자로 일하면서 10년전의 자바스크립트 믿고 왔는데 많이 바뀌었네요 덕분에 많은 공부가 되네요

  • @user-yv5ig9jj6u
    @user-yv5ig9jj6u 7 หลายเดือนก่อน

    진심 최고입니다

  • @user-ui2wd6sz1i
    @user-ui2wd6sz1i 2 ปีที่แล้ว

    많은 도움이 되었습니다. 감사합니다.

  • @Chichi-jy6zm
    @Chichi-jy6zm 3 ปีที่แล้ว +3

    와 진짜 정리 잘 되고 설명 잘해주시는거같아요!! 나온 함수들을 다 기억할 자신이 없어가지고 문제지만 ㅠㅠ 그때그때 영상을 찾아보던지 해야겠어용 ㅠㅠ 자료도 너무 깔끔하고 좋아요!! 감사합니당 :-)

  • @elecricecooker
    @elecricecooker 2 ปีที่แล้ว

    책으로 빠르게 훑다가 call this bind가 양이 많아서 막혔었는데 영상이 깔끔하네요. 감사합니다

  • @mozzigi9503
    @mozzigi9503 ปีที่แล้ว

    크 뭔가 대박짱짱맨이네요 ㅜㅜ 감사해요 ㅜㅜ

  • @ryjun93
    @ryjun93 ปีที่แล้ว

    진짜 너무 감사드립니다.

  • @user-rp3xx6zo9c
    @user-rp3xx6zo9c ปีที่แล้ว

    진짜 좋은 강의 두번 들어야 함 ㅎ

  • @user-gg6im1pl9q
    @user-gg6im1pl9q ปีที่แล้ว +2

    6개월 전에 기초 듣고 지금 중급 듣습니다. 타 플랫폼에서 강의 돈주고 산거 있습니다. 근데 그거 듣다가 포기하고 이거 듣습니다. 코딩앙마님은 중요한거 딱 설명해주시니 공부하기 편합니다ㅠ 인기가 없을 수가 없는데...

  • @yonggalbbangsang
    @yonggalbbangsang ปีที่แล้ว

    완강했습니다. 많이 도움 되었습니다

  • @keemwanchi
    @keemwanchi ปีที่แล้ว

    덕분에 많이 배워갑니다 감사핮니다❤❤

  • @실험맨
    @실험맨 10 หลายเดือนก่อน

    덕분에 기초를 다시 튼튼하게 다졌어요

  • @devgmmm_5418
    @devgmmm_5418 2 ปีที่แล้ว

    그저 최고...

  • @user-rf4rg7iy3f
    @user-rf4rg7iy3f 2 ปีที่แล้ว +15

    유료 강의도 이 만큼의 퀄리티로 알려주지는 못할 것 같습니다. 빠른 강의 속도 + 흡입력 강한 강의력에 초급, 중급 모두 완강하고 리액트를 편하게 공부할 수 있게 되었습니다. 정말 감사드립니다.

    • @user-nl5ir3zk9i
      @user-nl5ir3zk9i ปีที่แล้ว +1

      유료 강의 찾으면 더 좋은 거 많습니다.

    • @mercy76
      @mercy76 ปีที่แล้ว +1

      @@user-nl5ir3zk9i 추천해주실만한 강의 있나요?

  • @user-wn1wb1ne8d
    @user-wn1wb1ne8d 2 ปีที่แล้ว +1

    사랑합니다.

  • @Jyellyjye
    @Jyellyjye 2 ปีที่แล้ว

    초급은 이해 잘 했는데 역시 중급은 잘 안되네여!ㅋㅋㅋㅋ여러번씩 돌려보고있어용 진짜감사합니다 ㅜㅜ 너무 도움됐어요 자바도 만들어주세요~!!! 다른언어들도 많이많이…😀😀😀😀

  • @user-nz2qf7kl5u
    @user-nz2qf7kl5u ปีที่แล้ว

    🏫 감사합니다.

  • @KRFile
    @KRFile 2 ปีที่แล้ว

    와 레알 개꿀단지 ㅋㅋ 잘 듣고 있슴다

  • @MrWibette
    @MrWibette 2 ปีที่แล้ว

    선생님 감사합니다. 너무너무요 ^^

  • @taeheek.9899
    @taeheek.9899 2 ปีที่แล้ว +1

    자바스크립트를 좀 안다 라고 말하려면 중급 강좌를 전부 이해하고 응용할 수 있어야 하지 않을까, 훌륭한 강의 감사합니다!

  • @j1min-portfoilo
    @j1min-portfoilo 2 ปีที่แล้ว +2

    5:03 책갈피
    선생님 너무 도움됩니다..
    저만 알고싶지만 같이 코딩하는 친구들한테도 홍보 하겠습니다
    타입스크립트 강의도 엮어주시길 기다리겠습니다
    유튜브 떡상하세요 감사합니다

  • @user-qc8cu6sh1e
    @user-qc8cu6sh1e ปีที่แล้ว

    최근들어 경쟁력을 갖추기 위해 자바스크립트를 공부해야겠다고 생각했습니다. 시간날때마다 보고 있는데 자바와 다른 부분들이 있어서 조금은 낯설어 어렵게 느껴지네요 ㅠㅠ.. 아무쪼록 좋은 강의 감사합니다 ㅎㅎ

  • @user-zy4ux7db1q
    @user-zy4ux7db1q 2 ปีที่แล้ว

    감사합니다!

  • @lys000626
    @lys000626 3 ปีที่แล้ว

    감사합니다.

  • @_bangna8538
    @_bangna8538 2 ปีที่แล้ว +4

    7/8 5:05시작
    7/8 7:22
    7/9 30:29
    7/10 44:09
    7/11 52:54
    7/12 1:14:06
    7/13 -
    7/14 1:35:03
    7/15 -
    7/16 1:42:14
    7/17 1:49:30
    7/21 2:05:42
    7/22 2:13:48 끝
    초급 강의는 쭉쭉 들었는데 중급강의는 여러번 돌려보느라 오래걸렸내요 ㅎㅎ 좋은 강의 감사합니다.
    아제 DOM Evt 들으러 갑니다 !

  • @heyalexxx4334
    @heyalexxx4334 3 ปีที่แล้ว

    최고!!

  • @gihyonsd
    @gihyonsd 2 ปีที่แล้ว

    강의 감사합니다.
    타임라인
    1:05:05

  • @user-lv5ow6nw3r
    @user-lv5ow6nw3r 2 ปีที่แล้ว

    목소리 개멋있어..

  • @coding_comoco
    @coding_comoco 2 ปีที่แล้ว

    좋은 강의입니다 초급보다는 어렵네요

  • @thankyouYoutube_
    @thankyouYoutube_ 8 หลายเดือนก่อน

    감사합니다!!!!!!!!!!

  • @antiquejung8846
    @antiquejung8846 2 ปีที่แล้ว +5

    저처럼 애매하게 자바스크립트에 대해 이해했던 사람들에겐 정말 주옥같은 강의네요. 정말 감사합니다.

    • @user-dc6bt8dt2g
      @user-dc6bt8dt2g 2 ปีที่แล้ว

      ㅇㅈ 저도 자스는 뒷전으로 두고 개발했었는데 다시 필요성 느끼고 왔음

  • @spk9090
    @spk9090 3 ปีที่แล้ว +1

    좋아요~!

  • @user-wh2gr3ch7r
    @user-wh2gr3ch7r ปีที่แล้ว +2

    49:00 배열 map
    57:00 배열 reduce
    1:05:47 배열구조분해 바꿔치기
    1:07:43 객체 구조 분해 새로운 변수 이름으로 할당
    1:13:39 전개구문 배열
    1:22:49 클로져 은닉화
    1:32:43 call this 적용

  • @user-ps6gp3ig9w
    @user-ps6gp3ig9w ปีที่แล้ว

    감사합니다 전부 이해하는데 좀 오래걸렸지만 도움이 정말 많이 되었습니다 ! 프론트앤드 지망자인데 이제 클론코딩을 해보려고 하는데 괜찮을까요??

  • @once_a_
    @once_a_ 3 ปีที่แล้ว

    1:12:25 에서 궁금한 점이 있습니다.
    왜 add3(2)가 실행될 떄 생성되는 Lexical 환경의 이름은 왜 makeAdder처럼 `add3의 Lexical 환경 `이라는 이름을 가지지 못하고 익명의 환경 이름을 가지게 되나요??

  • @user-tm2kw8us3q
    @user-tm2kw8us3q 7 หลายเดือนก่อน

    19:09 잘봤습니다.

  • @integerone
    @integerone ปีที่แล้ว

    초급과정을 5번 듣고 이해 했다고 생각했는데 .... 중급 과정 들으면서 뭔말인지 도통 이해가 안되서 또 초급듣고 반복중이에요. 중급도 여러번 보면 이해 하겠죠 ㅎㅎㅎㅎ

  • @user-zu4rz8ld2i
    @user-zu4rz8ld2i 2 ปีที่แล้ว

    질문이 있습니다. th-cam.com/video/4_WLS9Lj6n4/w-d-xo.html 에서 클로저(getColor)를 이용해서 color를 변경 못하게 한다고 설명해주셨는데요. 이게 bmw를 만들때 Lexical 환경이 한개 만들어지고, 이 안에서 color값은 red로 기억하기때문이겠죠? 그리고 이후에 color = "white"로 변경해도 bmw.color는 white로 변경되지만, getColor는 이미 lexical 환경에서 color은 red로 기억된다고 이해되는데요 맞나요?

  • @user-zv9sh4on6x
    @user-zv9sh4on6x ปีที่แล้ว

    정말 감사합니다. call, apply 등은 아직 만들어보지도 않아서 나중에 참고하겠습니다. 애매했던 개념들이 조금 자리를 잡아가는 느낌입니다. 선생님은 정말 복받으실겁니다. 스터디하는 분들한테도 선생님 강의 추천했습니다.
    한가지 질문이 있다면, 제이쿼리만 배우고 바닐라 자바스크립트는 안배운 상황입니다.id 얻을 때 getelementbyId였나 그런 식으로 쓴다는 것만 봤어요. 우선 제이쿼리를 통해 화면을 동적으로 구현하는 데 집중하고, 익숙해질 때쯤에 제이쿼리를 바닐라 JS로 바꾸는 걸 연습할까요?
    아니면 바닐라 JS는 1-2년 뒤로 미뤄두고 자바 상속, DB join, Node 비동기성 등을 공부할까요? 저는 국비학원 다니는 사람으로 CSS 빼고는 풀스택이 재밌어서 풀스택을 목표로 하고 있고, 다 조금씩 채워나가고 있는 중입니다.

  • @design4OOO
    @design4OOO ปีที่แล้ว +3

    안녕하세요! 양질의 강의를 무료로 공유해주셔서 덕분에 공부하는데 큰 도움이 되고 있습니다. 감사합니다 :) 질문을 하나 드리고싶은데, 실무에서 이정도의 메소드나 함수 사용법 같은 것 들은 다 외우고 있어야할까요? 아니면 실무자들도 그때 그때 찾아보면서 하는 경우가 많은지 궁금합니다!!

    • @codingangma
      @codingangma  ปีที่แล้ว +1

      실무할때 자주 사용하면 자연스럽게 외워집니다. 억지로 외울 필요는 없구요, 다 외우고 쓰는 사람도 없습니다. 저도 항상 구글링 하면서 작업합니다.

  • @mjvly948
    @mjvly948 2 ปีที่แล้ว +1

    강의가 너무 유익하고 좋습니다!
    다만 목소리가 너무 감미로워서 자꾸 눈꺼풀이 내려와요...ㅜㅜ 엉엉

  • @onieon4581
    @onieon4581 3 หลายเดือนก่อน

    선생님, 질문 있습니다. var로 선언한 경우 할당(값)도 호이스팅이 되는 경우도 있는가요? 영상 초반부에 나오는 var의 경우 선언만 호이스팅 되는 걸로 이해했는데 실제 코드를 실행결과 할당도 호이스팅이 되어 콘솔에 찍히는 경우가 있습니다. 쓰레기값이 남아 그런걸까요? 영상과 다른 변수로 작성시는 문제 없는 반면 name으로 할 경우 값도 호이스팅 되어버리네요?

  • @RR-rg8uz
    @RR-rg8uz 2 ปีที่แล้ว

    코드펜 사용하는데 new 클래스()로 객체를 만들고 console.log(오브젝트) 해서 확인하면 콘솔에 펑션은 안뜨고 constructor 내용만 뜨네요. 예를 들어 1:49:10 에서 console.log(z4); 하면 color랑 wheels만 나오고 drive(), stop(), park()는 안나와요. 가지고 있는 펑션까지 볼 수 있는 방법은 없나요?

  • @ambition6933
    @ambition6933 ปีที่แล้ว

    44:06에서 const result = arr.forEach((name,index)=>{
    console.log(`${index+1}.${name});}
    console.log(result); // 1.Mike 2.Tom 3.Jane 그리고 undefined가 나오는데 이유가 무엇인가요??

  • @u3813
    @u3813 หลายเดือนก่อน

    Computed property에서 변수(매개변수포함)를 키나 밸류로 사용할때 대괄호는 키(이름)로 사용할때만 붙이고
    밸류로 사용할때는 사용하지 않는다고 이해했는데 제가 제대로 이해한게 맞을까요?
    항상 영상 잘 보고 있습니다 감사합니다!

  • @user-nq7uo5rf6w
    @user-nq7uo5rf6w ปีที่แล้ว

    1:42:28 에서 갑자기 궁금한 점이 생겨서 질문 남깁니당.. const는 한번 입력한 값을 수정 할 수 없다고 했는데 객체 내부의 값을 왜 수정 할 수 있는걸까요? 객체라는 사실만 유지되면 그 안의 값은 수정이 되어도 상관 없는건가요? 그리구 이건 좀 부끄러운 질문이지만,, 왜 막바지에 갑자기 은닉화에 대한 언급이 되었는지도 궁금합니다. 이게 상속프로토타입과 무슨 연관이 있는 걸까? 하는 의문이 들어서용 ㅎㅎ,,constructor를 타인이 수정할 수 있다는 점에서 연결된걸로 보아 그것을 방지하려면 이것 역시 은닉화를 통해 수정하지 못하도록 입력 할 수 있다는 걸까용..?
    또 다른 질문입니당.. 자바스크립트 기초 영상에서 객체에 메소드를 추가 할 때는 user = { sayHello : funtion( ){ ~~~}}; 이런식으로 했었습니다. 그래서 저는 계속 이런 방식으로 사용했는데 이번 영상에서 부터는 sayHello(){~~~} 이런식으로 코드를 입력하시더라구요?! 그래서 그냥 두 개를 혼용하면 되나보다,,했는데,,1:48:51 영상에서 입력하신 두개의 메소드를 각자 앞에서 말한 다른 방식으로 입력했더니 첫번째 말한 방식으로 입력한 메소드는 콘솔에 z4를 찍었을 때 객체의 값이라고 노출됩니다 무슨차이인지 무엇을 사용해야 하는건지 햇갈립니다 ㅜ

  • @user-tr4gz3pu1p
    @user-tr4gz3pu1p 2 ปีที่แล้ว

    좋은 강의 감사드려요~
    1:42:39초 정도에 x5.c = "blue";라고 설정하고
    x5.c를 불러오면 이때는 변경된 blue를 출력하는데
    이때 바로 설정하거나 바로 읽어오지 못하도록
    즉 x5.c를 바로 접근하지 못하게 하는 방법이 있을까요?

    • @hodoli04
      @hodoli04 2 ปีที่แล้ว

      x5.c = 'blue'; 추가하면 x5 obj에 c라는 속성을 추가하고, blue 를 할당한 거네요. 원래의 getColor 는 red 로 유지됩니다. x5를 출력해보면 알 듯 합니다.

  • @user-ln3nh4hp9v
    @user-ln3nh4hp9v ปีที่แล้ว

    osam에서 강의를 듣다가 궁금한 점이 생겨서 질문 드립니다
    54:49 에서 말씀하신 내부로직 동작 방식이 갑자기 나온 개념이라 이해가 되지 않습니다... "arr.sort(fn)에선 fn함수는 이렇게 동작한다"이런식으로 많은 경우의 수를 그냥 외워야하는 개념인건가요? 아시는 분들있다면 답변 부탁드립니다

  • @user-ek3kd1hc8s
    @user-ek3kd1hc8s 2 ปีที่แล้ว

    19:13 11/27
    31:41 11/28
    40:00 11/29

  • @user-rm6dz2or9z
    @user-rm6dz2or9z 5 หลายเดือนก่อน +1

    쇼핑몰 만들어야 하는데 자바와 자바스크립트 중 어느게 만들게 쉽나요?

  • @user-dy8wm3hu9d
    @user-dy8wm3hu9d 2 ปีที่แล้ว +1

    강의 1:44:53 에서 나오는 class 와 prototype 간의 관계에서 아래의 코드의 경우 tom 과 jane 의 shwoName() 에 대한 prototype 이 서로 다른 이유가 뭘까요 ?
    tom 의 showName() 은 직접 관리되는 property 로 나오고,
    jane 의 showName() 은 prototype 에 나옵니다.
    class User
    {
    constructor( _name, _age )
    {
    this.name = _name;
    this.age = _age;
    this.showAge = function() { console.log( this.age ); }
    }
    showName = function() { console.log( this.name ); }
    }
    const tom = new User( 'Tom', 20 );
    tom;
    class User2
    {
    constructor( name, age )
    {
    this.name = name;
    this.age = age;
    }
    showName() {
    console.log( this.name );
    }
    }
    const jane = new User2( 'Jane', 25 );
    jane;

    • @codingangma
      @codingangma  2 ปีที่แล้ว

      showName = function(){ .. 처럼 사용하시면 객체의 프로퍼티로 들어가게 됩니다.

  • @user-xs4qc3dz3d
    @user-xs4qc3dz3d ปีที่แล้ว

    요즘 자바스크립트 사용해야할 일이 생겨서 보고 있는데 도움이 많이 되고있습니다.혹시 상속, 프로토 타입에서 사용하는 실행 환경은 어떤 건가요?프로토 타입의 프로퍼티를 상세하게보고 싶은데 VScode&CodeRunner를 사용하니까 상세하게 볼수가 없네요...ㅠㅠ

    • @dogo_1158
      @dogo_1158 ปีที่แล้ว

      이미 해결하셨는지 모르겠지만, 저는 VScode에서 live server 이용해서 구글 개발자 도구를 이용하고있어요

  • @REAL_KAILO
    @REAL_KAILO ปีที่แล้ว

    I am your 900th like!

  • @_mj_ahn6782
    @_mj_ahn6782 ปีที่แล้ว

    1:32:48
    fn(); 실행시
    this.name이 undefined 되는 이유가 name 정보 없이 함수 user.showName만 가져오기 때문에 맞나요?

  • @ambition6933
    @ambition6933 2 ปีที่แล้ว

    안녕하세요 공부하면서 질문이 있습니다. 처음보는 메소드/함수를 제가 디지털 노트로 정리하면서 강의를 보는데요. 이렇게 해도 지장이 없나요?
    아니면 강의를 여러 번 시청하는 것이 더 효율적인가요??

    • @codingangma
      @codingangma  2 ปีที่แล้ว

      하나를 여러번 보시면 좋은데요, 그보다 다른 강좌/블로그/공식 문서를 보시면 좋습니다.
      예를 들어 함수에 대한 영상을 보셨다면, 공식 문서 한번 보시고, 다른 강좌도 보시고, 구글 검색해서 함수에 대해 정리된 블로그 쭉 보시고.. 이러면 확실히 이해되실거에요.

  • @for__us
    @for__us 2 ปีที่แล้ว

    안녕하세요! 이제 막 JS 공부 시작했는데 영상이 많은 도움이 되고 있습니다😊 영상에서 질문이 하나 있는데요..! 29:56 부분에서 100대신 5를 곱하면 '1부터 5까지'의 범위가 된다고 하셨는데 Math.random()*5 의 경우만 놓고 본다면 0부터 4까지의 범위가 아닌가 해서 여쭤봅니다..!!

    • @codingangma
      @codingangma  2 ปีที่แล้ว +1

      맞아요. 그래서 뒤에 1 더해줍니다!

    • @for__us
      @for__us 2 ปีที่แล้ว

      @@codingangma 답변 감사합니다😃

  • @chichi2_2
    @chichi2_2 ปีที่แล้ว

    안녕하세요 코딩앙마님, 강의 잘 보고 있습니다. 강의를 보다가, 생성자 함수 부분에서 this.sayName의 console.log는 this.name으로 입력했는데, 8:40 의 8번째 줄에서는 this.price가 아닌 price로 기재한 이유가 궁금한데 이유를 알 수 있을까요?

    • @user-mz3ig9is8u
      @user-mz3ig9is8u ปีที่แล้ว

      위 구문에서는 아무거나 써도 상관 없는데 굳이 타자를 더 칠 이유가 없음.
      단 arrow 함수를 사용시, this는 실행 컨텍스트가 전역이므로 사용하면 안됨.

  • @TheYohan651
    @TheYohan651 2 ปีที่แล้ว

    정말 감사드립니다. 기존 파이썬 경험이 있는데다 강사님 설명이 너무 양질이어서 js도 아주 빠르게 흡수 중입니다! 다름이 아니라 소위 말하는 네카라쿠배 정도에 프론트엔드로 뚫으려면 어느정도 능력치가 있어야 가능할까요..! 경력직 말구 신입으로 뚫는다는 가정 하에요! 개인적인 생각이 궁금합니다 :)

  • @frontend_ko
    @frontend_ko 2 ปีที่แล้ว +3

    코딩앙마님, 프론트엔드 취업 목표로 독학중인데, 취업 스타트를 끊을수 있는 자바스크립트 수준이 되려면 어느정도 되어야 할까요..?

    • @codingangma
      @codingangma  2 ปีที่แล้ว +4

      일단 초급, 중급 강좌에 대한 내용을 모두 숙지하시고, React 나 Vue 같은 js 프레임워크들 중 한개 이상의 경험이 있어야 될 것 같습니다.

  • @rengerenger
    @rengerenger 2 ปีที่แล้ว +1

    내일 이어들어야징 23:24

  • @sinlee5312
    @sinlee5312 ปีที่แล้ว

    정말 잘 보고있는데 callback, promise 부터 너무 어려워서 10번은 반복해서 보는거같네요 ㅋㅋㅋ ㅠ callback죽이고싶네요

  • @400great7
    @400great7 3 ปีที่แล้ว +8

    선생님 중급강좌 이후에는 타입스크립트로 넘어가는 건가요? JS의 고급강좌 내용으로는 어떤게 있을까요? 샘 덕분에 지식의 목마름을 느낍니다^^

    • @codingangma
      @codingangma  3 ปีที่แล้ว +15

      이후에는 JS 라이브러리나 프레임워크 (리액트, 타입스크립트 등) 원하는거 골라서 공부 하시면 됩니다.
      고급 JS 는 사실 현업에서 자주 사용 되지 않는 개념들이 많아서.. 그때 그때 필요한 부분만 MDN 사이트 같은데서 읽어보시는게..

    • @codingangma
      @codingangma  3 ปีที่แล้ว +4

      @@400great7 😀

  • @user-nx6hb9vn5w
    @user-nx6hb9vn5w 2 ปีที่แล้ว +2

    이거 개발 동영상이 아무리 조회수 적게 나온다고 해도 영어로 만드시면 100만은 찍으실 듯...

  • @user-yt5hx1co8y
    @user-yt5hx1co8y 3 ปีที่แล้ว +12

    중급강좌 이후에 고급강좌는 없나요?! 없으면 무엇을 공부해야하나요? 커리큘럼좀 알려주세요~

    • @youngkim-sz4ti
      @youngkim-sz4ti ปีที่แล้ว

      typescript npm react vue는 어떠신가용

  • @JjEeOnG
    @JjEeOnG 2 ปีที่แล้ว

    33:20인데요 if(dexc.indexOf('Hi') > -1) 여기서 Hi 자체가 인덱스0인데 >-1로 한다고 인덱스가 달라져서 호출이 되나요? 이해가 안가요 ㅠㅠ

    • @JjEeOnG
      @JjEeOnG 2 ปีที่แล้ว +1

      38:57 이 부분 식이 이해가 안가면 뭐를 공부해야하나요 ㅠ if -1이 왜 트루인가요? 아흑 트루여서 왜 통과가 되는거가요?ㅠㅠ

    • @kkiial6328
      @kkiial6328 2 ปีที่แล้ว

      @@JjEeOnG 정수 0, 실수 0.0이외의 모든 숫자는 True입니다. 그리고 빈 문자열 '', ""를 제외한 모든 문자열은 True입니다. 논리 연산자 내용이에여

  • @user-or1gr3hl5j
    @user-or1gr3hl5j 2 ปีที่แล้ว

    29:04 갑자기 왜 16진수가 나오나요ㅠㅠ? 또11을 숫자로 바꾸고 2진수에서 10진수는 무슨말인가요..?
    35:18 2부터 시작인데 b는 왜 안들어가는거죠...?

  • @ambition6933
    @ambition6933 2 ปีที่แล้ว

    24:37 부분에서 질문이 있습니다. user[showName] = function(){
    console.log(this.name);}에서 this를 user로 써도 출력이 되는데 this를 쓰는 이유는 무엇인가요??

    • @codingangma
      @codingangma  2 ปีที่แล้ว

      저렇게 함수를 한번 만들어두면 아무 객체에서나 다 재활용 할 수 있죠.

    • @ambition6933
      @ambition6933 2 ปีที่แล้ว

      @@codingangma 아 그러네요!! 그래서 this가 빈 객체를 가르킨다는거군요? 감사합니다☺

  • @user-cz7xe1xg5d
    @user-cz7xe1xg5d 9 หลายเดือนก่อน

    모르고 안쓰는게 많쿠나
    하지만 계속 안써야지

  • @user-tr4gz3pu1p
    @user-tr4gz3pu1p 2 ปีที่แล้ว

    문의드립니다. 44분 26초에서 indexOf(3,3)을 실행하면 잘 되는데 배열요소가 문자타입이면 indexOf의 첫번째 인자만 고려해 서 처음부터 그 문자를 찾던데 인자를 2개 받는 indexOf 메소드는 배열요소가 숫자형식일때만 가능한건지요?

    • @codingangma
      @codingangma  2 ปีที่แล้ว

      문자일때도 가능합니다.
      var arr = ['h','e','l','l','o','w','o','r','l','d'];
      arr.indexOf('l',5); // 8
      이런식으로 사용하셨나요?

    • @user-tr4gz3pu1p
      @user-tr4gz3pu1p 2 ปีที่แล้ว

      한 문자가 아니라 문자열로 했었는데 그때는 잘 안됐는데 다시 해보니 되더라고요. 무슨 착오가 있었나봐요^^ 답변 감사합니다~

  • @yeokyeongan5081
    @yeokyeongan5081 2 ปีที่แล้ว +1

    안녕하세요~ 강의 정말 유익하게 잘 보고 있습니다~
    1:48:58 부분에서 콘솔창에 __proto__ : Car 라고 나오는데 ,
    제가 그대로 직접 콘솔창에 코드를 작성해보니 [[Prototype]] : Car 라고 나옵니다.
    __proto__와 [[Prototype]] 는 다른걸로 알고 있는데 혹시 왜그런지 아시나요?

    • @codingangma
      @codingangma  2 ปีที่แล้ว

      [[Prototype]] 이라는 프로퍼티를 __proto__ 를 통해 접근/수정 가능한것인데요, 콘솔창에 표현되는 부분이 영상 제작할 시점이랑 달라졌네요.

    • @mhr3029
      @mhr3029 ปีที่แล้ว

      해당 부분처럼 보이게 개발환경 어떻게 설정하나요? 저는 vsc에서 코드짜고 ctrl alt n 누르면 아래창에 output만 나오네요ㅠㅠ

    • @codingangma
      @codingangma  ปีที่แล้ว

      아 저건 크롬 개발자 도구입니다.

  • @user-gp5ed9mw8e
    @user-gp5ed9mw8e 2 ปีที่แล้ว

    강의 너무 잘 듣고 있습니다. 감사합니다.
    질문이 있어서요.
    코딩앙마님 처럼 바로 console에서 결과 보고 싶은데요.
    ★★vscode 동일하게 셋팅★★하는 방법 좀 알려주시면 안될까요... 잘 안되서요...
    제가 실행했을때는 아래내용이 계속 나와서 보기가 어려워서요....
    [Running] node "파일명"
    [Done] exited with code=0 in 0.107 seconds

    • @codingangma
      @codingangma  2 ปีที่แล้ว +2

      psy-hare.tistory.com/34
      VS code > Live Server 설치 > 간단한 HTML 작성 >
      사이에 작성하시면 됩니다.

  • @abrahamkim7557
    @abrahamkim7557 ปีที่แล้ว

  • @user-op7jx4wy5e
    @user-op7jx4wy5e 2 ปีที่แล้ว +1

    책갈피
    1:03:18

  • @hyelanlee3644
    @hyelanlee3644 ปีที่แล้ว

    Promise는 잘 작동을 안합니다. 2번주문완료와 3번주문완료가 안나옵니다. 흠... 다른 분들은 다 잘되는데 저만 안되는 걸까요? 앞에 강의는 다 잘 되었는데 말이죠... 좋은 강의 올려주셔서 감사합니다.

  • @user-cl7gp4jd2d
    @user-cl7gp4jd2d 7 หลายเดือนก่อน

    28:55 여기부분이 이해가안되는데 이거는 16진수를 이해해야 하는건가요?ㅠ 그 밑에 parseInt("11",2) // 3 는 어디서 나오는건지 모르겠어요 강의 흐름상 let redColor = "f3" 에서 f제외하고 3을 출력하는것 같은데 넘 헷갈리네요 ㅠ-ㅠ

    • @codingangma
      @codingangma  7 หลายเดือนก่อน

      3을 2진수로 바꾸면 11이 됩니다.
      243을 16진수로 바꾸면 f3이됩니다.
      let redColor = "f3" 에서 f제외하고 3을 출력하는건 다루지 않았어요.
      'f3' 을 10진수 숫자로 바꾸려고 하면 NaN 이 되지만
      16진수로 바꾸려고 하면 성공한다는 예제입니다.

  • @PARKCoreano
    @PARKCoreano ปีที่แล้ว

    안녕하세요 초급에 이어 중급 강좌 영상까지 보면서 공부중입니다. 영상이 너무 좋아서 글로 정리해보고 싶어졌습니다. 영상 출처를 밝히고 내용을 정리하여 개인 블로그에 올려도 괜찮을까요?

    • @codingangma
      @codingangma  ปีที่แล้ว +1

      물론입니다!

    • @PARKCoreano
      @PARKCoreano ปีที่แล้ว

      @@codingangma 감사합니다 :) 제가 글로 다시한번 정리하면 더 기억에 잘 남을거 같아요👍

  • @ywjs62
    @ywjs62 4 หลายเดือนก่อน

    28:40~31:40
    31:41, 37:00 문자열 메소드
    40:02

  • @Jeffrey9965
    @Jeffrey9965 2 ปีที่แล้ว

    Symbol 파트에서 user[showName] 이 부분이요, user.showName으로 안 하시고 대괄호로 쓰신 이유가 궁금합니다!

    • @codingangma
      @codingangma  2 ปีที่แล้ว +1

      user.showName 은 user['showName'] 과 같습니다. (따옴표가 들어감)
      user[showName] 은 따옴표가 없어요. 문자가 아니라 showName 이라는 심볼입니다.
      const user = {name:'Mike'}
      const a = 'name';
      user[a] // 'Mike'
      user['a'] // undefined
      user.a // undefined
      user.name // 'Mike'
      user['name'] // 'Mike'
      user[name] // 에러. name is not defined

  • @user-cj4dn9up7o
    @user-cj4dn9up7o 2 ปีที่แล้ว +1

    머리에 잘 안들어와서..현타 .ㅜㅜ.. 계속복습하면 괜찮아 지겟죠? ? ?

  • @kkiial6328
    @kkiial6328 2 ปีที่แล้ว +1

    2:05:00