인터뷰에서 승리할 수 있도록 소규모 프로그램을 기반으로 몇 가지 인터뷰 질문을 요약하고 공유하세요!-미니 프로그램 개발-php.cn

본 글은 여러분이 확실하게 면접에 합격할 수 있도록 작은 프로그램을 바탕으로 몇 가지 면접 질문을 정리하고 공유해드리도록 하겠습니다!

인터뷰에서 승리할 수 있도록 소규모 프로그램을 기반으로 몇 가지 인터뷰 질문을 요약하고 공유하세요!

미니 프로그램 로그인 프로세스

1단계: wx.login은 사용자의 임시 로그인 자격 증명 코드를 가져옵니다.

2단계: wx.getUserInfo는 암호화된 데이터를 가져옵니다. 1, 2단계의 코드, 암호화된 데이터, iv를 개발자 자체 서버로 전송합니다. 4단계: 서버가 암호화된 데이터 및 iv 코드를 얻은 후 get 메소드를 사용하여 다음 WeChat 인터페이스 개인 프로젝트를 요청합니다. 클라우드 개발

미니 프로그램에서 로그인 프로세스에 응답하는 백엔드 인터페이스가 없습니다. 페이지 선언 주기 ● onLoad()는 페이지가 로드될 때 트리거되며 현재 페이지 경로의 매개변수를 얻기 위해 한 번만 호출됩니다.

● onShow()는 페이지가 전경에 표시되거나 잘릴 때 트리거되며 일반적으로 데이터 요청을 보내는 데 사용됩니다.

● onReady()는 페이지의 초기 렌더링이 완료될 때 트리거되며 한 번 호출되어 페이지가 뷰 레이어와 상호 작용할 수 있음을 나타냅니다.

● onHide()는 페이지가 숨겨지거나 배경으로 전환될 때 트리거됩니다(예: 하단 탭이 다른 페이지로 전환되거나 애플릿이 배경으로 전환됨).

● onUnload()는 페이지가 언로드될 때 발생합니다(예: 다른 페이지로 이동하기

애플릿) 일반적으로 사용되는 프레임워크WeUI WeUI는 WeChat의 기본 시각적 경험과 일치하는 기본 스타일 라이브러리입니다. WeChat 공식 디자인 팀은 WeChat 웹페이지와 WeChat 미니 프로그램을 맞춤 제작하여 사용자의 사용 인식을 더욱 통일시켰습니다. 미니 프로그램 개발에서 가장 일반적으로 사용되는 프레임워크로 개발자들 사이에서 인기가 높습니다. Meituan 미니 프로그램 프레임워크 mpvue 공식 소개: mpvue는 Vue.js를 사용하여 작은 프로그램을 개발하는 프런트 엔드 프레임워크입니다. 프레임워크는 Vue.js의 핵심을 기반으로 합니다. mpvue는 미니 프로그램 환경에서 실행될 수 있도록 Vue.js의 런타임 및 컴파일러 구현을 수정하여 미니 프로그램 개발을 위한 완전한 Vue.js 개발 경험 세트를 도입했습니다. .

컴포넌트 개발 프레임워크 wepy 공식 소개: 컴포넌트 기반 개발은 컴포넌트 격리, 컴포넌트 중첩, 컴포넌트 통신 등의 문제를 완벽하게 해결합니다. 타사 npm 리소스 사용을 지원하고 npm 리소스 간의 종속성을 자동으로 처리하며 모든 npm 리소스 패키지와 완벽하게 호환됩니다. 플랫폼 종속성. 공식 프레임워크 MINA 공식 소개: 프레임워크는 자체 뷰 레이어 설명 언어인 WXML 및 WXSS와 JavaScript 기반 로직 레이어 프레임워크를 제공하고, 뷰 레이어와 로직 레이어 사이에 데이터 전송 및 이벤트 시스템을 제공하여 개발자가 쉽게 집중할 수 있도록 합니다. 데이터와 논리적으로.

위챗 미니 프로그램을 아시나요? 미니 프로그램의 원리를 간략하게 설명해주세요. WeChat 애플릿은 JavaScript, WXML, WXSS의 세 가지 기술을 사용하여 개발되었습니다. 기본적으로 모든 페이지 렌더링 및 이벤트 처리가 한 페이지 내에서 수행됩니다.

WeChat의 아키텍처는 UI와 데이터가 분리되어 있습니다. 변경 사항을 구현하려면 모든 페이지 업데이트를 처리해야 합니다.

⼼미니 프로그램은 두 부분으로 나뉩니다. 웹뷰와 appService. 그 중 webview는 주로 UI를 표시하는 데 사용되며 appService는 비즈니스 로직, 데이터 및 인터페이스 호출을 처리하는 데 사용됩니다. 두 가지 프로세스로 실행되며 시스템 계층 JSBridge를 통해 통신하고 UI 렌더링 및 이벤트 처리를 구현합니다. 미니 프로그램 프로젝트의 기본 디렉터리 파일은 project.config.json 프로젝트의 구성 파일 역할을 합니다. 인터페이스 색상, 편집 구성 등; app.json은 미니 프로그램의 모든 페이지 경로 구성, 인터페이스 성능, 네트워크 시간 초과, 하단 탭 등을 포함하는 현재 미니 프로그램의 전역 구성입니다. sitemap.json은 미니 프로그램과 해당 페이지가 WeChat에 의해 색인화되도록 허용할지 여부를 구성합니다. 페이지에는 특정 페이지가 포함되어 있습니다. wxml(WeiXin Markup Language)은 프레임워크에 의해 설계된 태그 언어 집합으로, 기본 구성 요소 및 이벤트 시스템과 결합되어 페이지의 구조를 구축할 수 있습니다. wxss(WeiXin Style Sheets)는 WXML 구성 요소 스타일을 설명하는 데 사용되는 스타일 언어입니다. app.wxss는 글로벌 스타일로서 현재 애플릿의 모든 페이지와 로컬 페이지 스타일에 적용됩니다. page.wxss는 현재 페이지에만 적용됩니다. app.js 애플릿 로직 js 논리 처리, 네트워크 요청 json 페이지 구성

애플릿의 양방향 바인딩이 vue와 어떻게 다른가요?애플릿에 있는 this.data의 속성은 뷰와 동기화될 수 없으며 다음과 같이 호출되어야 합니다. this.setData({ //여기서 설정 })

애플릿 페이지의 수명주기 기능onLoad은 페이지가 로드될 때 트리거됩니다. 페이지는 한 번만 호출됩니다. onLoad 매개변수에서 현재 페이지를 여는 경로의 매개변수를 가져올 수 있습니다(페이지 로딩 모니터링)

onShow()는 페이지가 포그라운드로 표시되거나 잘릴 때 트리거됩니다(모니터링 페이지). 디스플레이)

onReady()는 페이지의 초기 렌더링이 완료되면 트리거됩니다. 페이지는 한 번만 호출됩니다. 이는 페이지가 준비되었으며 뷰 레이어와 상호 작용할 수 있음을 의미합니다(페이지의 초기 렌더링 완료 모니터링).

onHide()는 페이지가 숨겨지거나 배경으로 전환될 때 트리거됩니다. . NavigateTo 또는 하단 탭을 사용하여 다른 페이지로 전환, 애플릿이 배경으로 전환 등(페이지 숨김 모니터링) 페이지가 언로드될 때

onUnload()가 트리거됩니다. 예를 들어 리디렉션 또는 탐색다른 페이지로 돌아가기(페이지 제거 모니터링)

WeChat 미니 프로그램의 장점과 단점

장점: 즉시 사용 가능, 설치 불필요, 트래픽 절약, 설치 시간 절약, 데스크탑 점유 없음 WeChat 트래픽, 자연스러운 홍보 및 커뮤니케이션 이점에 의존 개발 비용은 앱보다 저렴합니다. 단점 : 사용자 유지, 즉시 사용이 장점이지만 몇 가지 문제점도 있습니다. 입구가 기존 앱보다 훨씬 깊습니다. 제한 사항이 많고 페이지 크기가 2M를 초과할 수 없으며 레벨이 10개를 초과하는 페이지는 열 수 없습니다. 미니 프로그램에서 wxss와 css의 차이점은 무엇입니까? WXSS는 CSS를 기반으로 합니다. 추가 및 수정

차원 단위 rpx rpx는 화면 너비에 적응하는 반응형 픽셀입니다. 지정된 화면 너비는 750rpx입니다. 예를 들어 iPhone6에서는 화면 너비가 375px이고 총 750개의 물리적 픽셀이 있으며, 750rpx = 375px = 750개의 물리적 픽셀이 있습니다.외부 스타일을 가져오려면 @import 식별자를 사용하세요. @import 뒤에는 가져와야 하는 외부 스타일 시트의 상대 경로가 옵니다. ;는 명령문의 끝을 나타냅니다

미니 프로그램 페이지 간에 데이터를 전송하는 방법은 무엇입니까

(1) 전역 변수를 사용하여 app.js에서 데이터 전송을 구현합니다. 파일에 전역 변수 globalData를 정의하고 여기에 저장해야 하는 정보를 저장합니다. 사용시 getApp()을 직접 사용하여 저장된 정보를 가져옵니다

(2) wx.navigateTo 및 wx.redirectTo 사용시 데이터의 일부를 url에 넣고 새 페이지가 onLoad일 때 초기화할 수 있습니다. 참고할 문제: wx.navigateTo 및 wx.redirectTo는 탭에 포함된 페이지로 이동하는 것을 허용하지 않습니다. onLoad는 한 번만 실행됩니다. (3) 로컬 캐시 사용 저장소 관련 미니 프로그램을 WeChat 공식 계정과 연결하여 사용자의 고유성을 확인하는 방법

개발자가 여러 모바일 애플리케이션, 웹 사이트 애플리케이션 및 공개 계정(포함)을 가지고 있는 경우 미니 프로그램), 동일한 WeChat 오픈 플랫폼 계정에 모바일 애플리케이션, 웹사이트 애플리케이션 및 공개 계정(미니 프로그램 포함)이 있는 한 사용자의 유니온 ID는 고유하기 때문에 사용자의 고유성은 Unionid로 구별됩니다. 즉, 동일한 사용자의 경우 동일한 WeChat 오픈 플랫폼의 다른 애플리케이션에 대해 Unionid가 동일합니다. 풀다운 새로 고침을 구현하는 방법은 무엇입니까? 먼저 전역 구성 창에서 활성화PullDownRefresh를 구성합니다. Page에서 onPullDownRefresh 후크 함수를 정의합니다. 풀다운 새로 고침 조건에 도달한 후 후크 함수가 실행되고 요청 메서드가 시작됩니다. 요청이 반환된 후 wx.stopPullDownRefresh를 호출하여 풀다운 새로 고침을 중지합니다.

bindtap과 catchtap의 차이점은 무엇입니까

같은 점: 우선 둘 다 클릭 이벤트 함수이며 트리거됩니다. 클릭하면. 이 함수에서는 동일하며 구별할 필요가 없습니다. 차이점: 가장 큰 차이점은 Bindtap은 버블링 이벤트를 방지하는 반면, catchtap은 버블링 이벤트를 방지한다는 것입니다. ) ', 'wx.redirectTo()', 'wx.switchTab()', 'wx.navigateBack()', 'wx.reLaunch()' 차이점

wx.navigateTo(): 현재 유지 페이지, 점프 앱 내 페이지로 이동합니다. 하지만 탭바 페이지로 이동할 수는 없습니다wx.redirectTo(): 현재 페이지를 닫고 애플리케이션 내 페이지로 이동합니다. 단, 탭바 페이지로 점프는 허용되지 않습니다

wx.switchTab(): 탭바 페이지로 점프하고 탭바가 아닌 다른 모든 페이지를 닫습니다

wx.navigateBack(): 현재 페이지를 닫고 이전 페이지로 돌아가거나 다단계 페이지. getCurrentPages()를 통해 현재 페이지 스택을 가져오고 반환해야 하는 레이어 수를 결정할 수 있습니다. wx.reLaunch(): 모든 페이지를 닫고 애플리케이션에서 페이지를 엽니다.

typeof 연산자, instanceof 연산자 및 isPrototypeOf( ) 메소드의 차이점

typeof는 기본 데이터 유형인 null, 정의되지 않음, 문자열, 숫자, 부울, 등의 데이터 유형을 감지하는 데 사용되는 연산자입니다. 참조 데이터 유형인 객체 및 함수는 물론 정규식, 날짜, 배열과 같은 참조 데이터 유형의 경우 모두 객체로 인식됩니다. instanceof도 특정 유형의 데이터를 쉽게 식별할 수 있는 연산자입니다. . 참조 유형. 그것과 isPrototypeOf의 차이점은 다음과 같습니다. 지정된 객체의 프로토타입 체인에 생성자의 프로토타입이 존재하는지 여부를 검색하는 데 사용됩니다. isPrototypeOf는 이 메소드를 호출하는 객체가 지정된 객체의 프로토타입 체인에 존재하는지 여부를 감지하는 데 사용되므로 본질적으로 감지 대상이 다릅니다.

call()과 Apply()의 차이점

사실 Apply와 Call의 기능은 동일하지만, 전달된 매개변수 목록의 형태가 다릅니다. apply(this 객체, [매개변수 1, 매개변수 2,...]) 매개변수가 하나만 있어도 배열에 써야 합니다. call(이 개체, 매개변수 1, 매개변수 2,...) 여러 개의 임의 매개변수를 허용할 수 있습니다. 첫 번째 매개변수는 적용과 동일하며 그 뒤에는 매개변수 목록이 옵니다

WeChat 애플릿은 값을 어떻게 전송합니까? to events

HTML 요소에 data-* 속성을 추가하여 필요한 값을 전달한 다음 e.currentTarget.dataset 또는 onload의 param 매개변수를 통해 값을 얻습니다. 하지만 데이터 이름은 대문자를 사용할 수 없으며 객체를 저장할 수 없습니다.

WeChat 애플릿과 vue의 차이점

• 라이프 사이클이 다르며, WeChat 애플릿의 라이프 사이클은 비교적 간단합니다. • 데이터 바인딩도 다릅니다. WeChat 애플릿 데이터 바인딩은 {{}}, vue를 직접 사용해야 합니다. • 요소의 표시 및 숨기기를 제어합니다. vue에서 요소의 표시 및 숨기기를 제어하려면 wx-if 및 숨기기를 사용하고, v-if 및 v-show를 사용합니다. • 이벤트 처리는 다릅니다. 이벤트를 바인딩하려면 bintap(bind+event) 또는 catchtap(catch+event)을 사용합니다. Vue: 이벤트를 바인딩하려면 v-on:event를 사용하거나 이벤트를 바인딩하려면 @event를 사용합니다. • 데이터의 양방향 바인딩도 다릅니다. vue에서는 양식 요소에 v-model을 추가한 다음 양식 요소의 내용이 변경되면 해당 값을 데이터에 바인딩하면 됩니다. 그에 따라 데이터도 변경될 것입니다. 이는 vue에 대한 매우 좋은 점입니다. WeChat 애플릿은 양식 요소의 변경된 값을 얻은 다음 데이터에 선언된 변수에 값을 할당해야 합니다.

WeChat 미니 프로그램의 적용 속도를 향상시키는 데 사용할 수 있는 방법

페이지 로딩 속도 향상 사용자 행동 예측 기본 데이터 크기 줄이기 컴포넌트화된 솔루션

미니 프로그램의 비동기 요청 문제를 해결하는 방법

미니 프로그램은 대부분의 ES6 구문을 지원합니다. • 성공을 반환하는 콜백에서 Promise 로직을 비동기식으로 처리합니다

애플릿 wxml과 표준 html의 유사점과 차이점은 무엇입니까?

동일함: • 페이지의 구조를 설명하는 데 사용됩니다. • 태그, 속성 등으로 구성됩니다. 다른: • 레이블 이름이 다르며 미니 프로그램 레이블이 적고 단일 레이블이 더 많습니다. • wx:if와 같은 추가 속성과 {{ }}와 같은 표현식이 있습니다. • WXML은 WeChat 애플릿 개발자 도구에서만 미리 볼 수 있는 반면 HTML은 브라우저에서 미리 볼 수 있습니다. • 구성 요소 캡슐화는 다릅니다. WXML은 구성 요소를 다시 캡슐화합니다. • 애플릿은 JS Core에서 실행되며 DOM 트리 및 창 개체가 없습니다. 창 개체와 문서 개체는 애플릿에서 사용할 수 없습니다.

애플릿에서는 세 가지 이벤트 객체의 속성 목록을 간략하게 소개하나요?

기본 이벤트(BaseEvent) • 유형: 이벤트 유형 • timeStamp: 이벤트가 생성된 타임스탬프 • target: 이벤트를 발생시킨 컴포넌트의 속성값 모음 • currentTarget: 현재 구성요소의 속성 모음 커스텀 이벤트(CustomEvent) • 세부 사항 터치이벤트 • 접촉 • ChangeTouches

애플릿은 wx:if 및 Hidden의 사용을 어떻게 이해합니까?

• wx:if의 전환 비용이 더 높습니다. • 숨김은 초기 렌더링 비용이 더 높습니다. • 따라서 빈번한 전환이 필요한 경우 런타임 중에 조건이 변경될 가능성이 없으면 wx:if를 사용하는 것이 좋습니다.

WeChat 애플릿과 H5의 차이점

실행 환경 : 전통적인 HTML5 운영 환경은 webview를 포함한 브라우저인 반면, WeChat 미니 프로그램의 운영 환경은 완전한 브라우저가 아니며 WeChat 개발팀이 브라우저 커널을 기반으로 완전히 재구성한 내장 파서입니다. 자체 정의된 개발 언어 표준과 함께 최적화는 미니 프로그램용으로 특별히 설계되었습니다. • 개발 비용의 차이: WeChat에서만 실행되기 때문에 브라우저 호환성이나 제작 환경에서 예측할 수 없는 버그에 대해 걱정할 필요가 없습니다. • 시스템 수준 권한 획득의 차이점

app.json은 현재 애플릿의 전역 구성입니다. 세 가지 구성 항목 각각의 의미는 무엇입니까?

• 페이지 필드 - 현재 미니 프로그램의 모든 페이지 경로를 설명하는 데 사용됩니다. 이는 WeChat 클라이언트에게 미니 프로그램 페이지가 현재 정의되어 있는 디렉터리를 알려주기 위한 것입니다. • 창 필드 - 미니 프로그램의 모든 페이지의 상단 배경색, 텍스트 색상은 여기에서 정의됩니다. • 탭 필드 - 미니 프로그램의 전역 상단 또는 하단 탭

미니 프로그램의 onPageScroll 메소드를 사용할 때 주의해야 할 점은 무엇인가요?

이 메서드는 자주 호출되므로 필요하지 않을 때 제거될 수 있습니다. onPageScroll을 사용할 때는 setData() 사용을 피하고 setData() 사용 빈도를 최소화하세요.

미니 프로그램 보기 렌더링 종료 콜백?

setData(data, callback)를 사용하고 콜백 메소드에 후속 연산 코드를 추가합니다

미니 프로그램의 동기 API와 비동기 API를 사용할 때 주의할 점은 무엇인가요?

wx.setStorageSync는 동기화 API인 Sync로 끝나는 API입니다. API를 사용할 때 예외를 보려면 try-catch를 사용하세요. API가 비동기식으로 확인되면 해당 콜백 메서드인 성공, 실패 및 완료에서 다음 단계를 수행할 수 있습니다.

WeChat 애플릿의 데이터 요청을 어떻게 캡슐화하나요?

1. 모든 인터페이스를 통합된 js 파일에 넣고 내보냅니다.

2. app.js에서 요청 데이터를 캡슐화하는 메서드를 만듭니다.

3. 하위 페이지에서 캡슐화된 메소드를 호출하여 데이터를 요청합니다.

미니 프로그램과 네이티브 앱 중 어느 것이 더 좋나요?

낮은 개발 비용, 낮은 고객 확보 비용, 공용 계정을 다운로드할 필요가 없다는 장점 외에도 미니 프로그램은 서비스 요청 지연 및 사용자 경험을 크게 개선했습니다. 이를 통해 복잡한 서비스 기능을 수행하고 사용자에게 더 나은 사용자 경험을 제공할 수 있습니다.

웹뷰 페이지에서 미니 프로그램으로 어떻게 돌아가나요?

먼저 최신 버전의 jweixin-x.x.x.js를 소개한 다음

wx.miniProgram.navigateTo({
url: &#39;/pages/login/login&#39;+&#39;$params&#39;
})

로그인 후 복사

웹뷰 페이지에서 미니 프로그램 탐색 페이지로 이동하는 방법은 무엇인가요?

애플릿으로 탐색하는 페이지는 탭으로 전환할 수 있지만 기본적으로 데이터는 다시 로드되지 않습니다. 새 데이터를 로드해야 하는 경우 성공 속성에 다음 코드를 추가하면 됩니다.

백그라운드 인터페이스를 호출할 때 미니 프로그램에 어떤 문제가 발생합니까?

1. 범위를 초과하면 미니 프로그램을 다시 시작하지 않으면 전체 미니 프로그램이 충돌하게 됩니다.

2. 미니 프로그램은 이 유형의 HTML 텍스트 콘텐츠를 직접 렌더링할 수 없습니다. 기사 콘텐츠 페이지를 표시해야 하는 경우 플러그인을 사용해야 하지만 플러그인 렌더링으로 인해 페이지 로딩이 느려지므로 백그라운드에서 기사 콘텐츠의 html을 필터링하는 것이 가장 좋습니다. 백그라운드는 p 태그와 div 태그를 뷰 태그로 일괄 교체한 다음 플러그인이 다른 태그를 처리하도록 합니다. 프런트 엔드 시간을 줄입니다

WeChat 미니 프로그램의 장점과 단점은 무엇인가요?

이점:

1. 다운로드할 필요가 없으며 검색하고 스캔하여 열 수 있습니다.

2. 좋은 사용자 경험: 빠른 열기 속도.

3. 개발 비용이 앱보다 저렴합니다.

4. 안드로이드 데스크톱에 추가할 수 있으며, 이는 기본 앱과 유사합니다.

5. 사용자에게 우수한 보안을 제공합니다. WeChat은 미니 프로그램 출시에 대해 엄격한 검토 프로세스를 갖추고 있습니다. 검토를 통과하지 못한 미니 프로그램은 온라인에 게시할 수 없습니다.

단점:

1. 제한이 더 많습니다. 페이지 크기는 1M를 초과할 수 없습니다. 레벨이 5개를 초과하는 페이지는 열 수 없습니다.

2. 싱글 스타일. 미니 프로그램의 일부 구성 요소는 이미 구성되어 있으므로 스타일을 수정할 수 없습니다. 예: 슬라이드쇼, 탐색.

3. 프로모션 범위가 좁아 친구들과 공유할 수 없으며, 근처의 미니 프로그램을 통해서만 홍보할 수 있습니다. 그 중 근처의 미니 프로그램도 위챗으로 제한됩니다.

4. WeChat에만 의존하면 백엔드 관리 기능 개발이 불가능합니다.