Motihall 질문을 통해학습 js(입문자 대상)

개시하다


몬테틸 문제를 아십니까?
미국의 텔레비전 프로그램에는 다음과 같은 게임이 있다.
사회자와 도전자가 있습니다.
회의장에는 문이 세 개 있다.
세 개 중 하나는 사은품(고급차)이다.나머지 두 개 뒤에는 염소가 있다.
우선 도전자는 3개 중 1개를 선택한다.
이어 진행자(몬티홀)가 도전자가 선택하지 않은 두 문 중 하나를 열었다.그곳에 염소가 있을 거야.그러니까 편차가 있다는 거야.
도전자는 처음 선택한 문을 열 수도 있고, 다시 문을 선택해 다른 문을 열 수도 있다.그럼 어떤 걸 열어볼까요?
...직감적으로 어느 문을 선택하든 확률은 5점 5점으로 둘 다 같다. 실제로 여기서 다른 문을 다시 선택하면 경품(고급차) 당첨 확률이 배로 높아진다.
도대체 진짜야?
나는 진짜인지 확인하기 위해 먼저 집에 있는 그릇 3개와 콩으로 실험을 했는데, 확실히 다시 선택하면 정확도가 높아진다.
여러분도 해보고 싶지 않으세요?
그래서 우리는'수동으로 몬티동 문제를 검증하는'사이트를 만들었다.

몬디홀 문제를 수동으로 테스트하다



(step1 선택문/)

(step 버튼을 2번 누르면...)

(step3 염소가 나타났어요. 다른 문을 선택해서 문을 열어...)

(step4 오류!)
근접 역기 검증 방법인데 필사적으로 30번 정도(수동) 반복하면
  • 문을 다시 선택하지 않은 경우
    정답:11,오답수:19,정답률:36.7%
  • 문을 다시 선택한 경우
    정답:24, 오답수:6, 정답률:80%
  • 이런 결과.이론적으로 재선한 사람은 33.3%, 재선한 사람은 66.6%였다.

    기술적 측면


    위 페이지의 소스 코드는 다음과 같습니다.
    Vue.js를 사용했습니다.예쁜 코드는 아닐지 모르지만, Vue.js의 기초 수준으로서 다음과 같은 기술을 사용했다.
  • 계산 속성 및 모니터링
  • 바인딩 클래스 및 스타일
  • 조건부 렌더링
  • 목록 렌더링
  • 구성 요소의 기본
  • props를 통해 부모component에서 아이component로 데이터 전달
  • emit를 통해 자component에서 부component의 함수를 호출
  • store로 데이터 저장
  • 베입니다.js를 공부할 때 먼저'읽어봐'공식 사이트로 신경 쓰이는 부분은 입력을 해서 동작을 시도하는 것이지만 글을 읽는 것만으로는'어디에 쓰일지 상상하기 어렵다.
    모티홀 문제의 검증 사이트를 손수 제작함으로써 각 기술의 사용법을 파악할 수 있고 어느 정도 Vue도 파악할 수 있다.나는 js에 익숙해졌다.
    SPA의 초기 학습 단계에서 상술한 사이트를 직접 제작하는 것을 추천합니다!

    겸사겸사 말씀드리겠습니다.


    다른 사람들도 몬티동 문제를 해결하는 다양한 샘플이 있는 것 같다.참고로 제공하다.

    좋은 웹페이지 즐겨찾기