Tất cả câu hỏi

Đáp án đúng: "Geolocation". Geolocation API là giao diện chuẩn để lấy vị trí địa lý của thiết bị (vĩ độ, kinh độ, độ chính xác) qua các hàm getCurrentPosition và watchPosition; trong React Native nó có trong thư viện @react-native-community/geolocation và chỉ trả dữ liệu sau khi người dùng cấp quyền vị trí. "LocationPicker" sai vì đây không phải API có sẵn, chỉ là tên thường dùng cho component tự viết để chọn địa điểm trên bản đồ. "Location" là tên module của Expo trong gói expo-location, một gói riêng chứ không phải tên chuẩn của API định vị mà câu hỏi nhắc tới. "Picker" sai vì đây là component chọn một giá trị trong danh sách thả xuống, không liên quan tới định vị.

Trong lập trình di động, đặc biệt là Android, việc xử lý chạm (touch) là một phần quan trọng của giao diện người dùng. Để giúp các view phản ứng đúng cách với các chạm, chúng ta cần sử dụng một thành phần cụ thể. Trong các lựa chọn đã cho, thành phần nào là một wrapper giúp các view này phản ứng đúng cách với các chạm?

Khi gọi hàm saveData('username', 'john_doe') và sau đó gọi hàm readData('username'), chúng ta sẽ thấy output là 'Retrieved value: john_doe'. Điều này là vì hàm saveData sẽ lưu trữ giá trị 'john_doe' vào AsyncStorage với key là 'username'. Sau đó, hàm readData sẽ đọc giá trị từ AsyncStorage và in ra console với giá trị vừa được lưu trữ. Nếu không có lỗi xảy ra, hàm readData sẽ trả về giá trị được lưu trữ, vì vậy output sẽ là 'Retrieved value: john_doe'.

Đáp án đúng: "horizontal". ScrollView mặc định cuộn theo chiều dọc; đặt prop boolean horizontal bằng true (hoặc chỉ viết horizontal) thì các con được xếp thành hàng ngang và cuộn sang trái phải. "scrollDirection" không phải prop của ScrollView, React Native không đọc tới nó. "scrollEnabled" có tồn tại nhưng chỉ bật hoặc tắt khả năng cuộn, ví dụ khoá cuộn khi đang kéo một phần tử, không đổi hướng. "direction" là thuộc tính style quy định hướng bố cục trái sang phải hay phải sang trái (ltr, rtl) cho chữ và Flexbox, không phải prop điều khiển hướng cuộn.

JSX (JavaScript XML) là một tính năng của React giúp bạn viết mã HTML và JavaScript cùng một lúc. Tuy nhiên, không phải tất cả các lợi ích của JSX đều đúng. Trong các lựa chọn trên, câu trả lời đúng là "It requires less memory consumption compared to traditional JavaScript syntax". Điều này là sai vì JSX thực sự đòi hỏi nhiều bộ nhớ hơn so với syntax JavaScript truyền thống. JSX được biên dịch thành JavaScript trước khi được chạy, điều này có thể dẫn đến việc sử dụng nhiều bộ nhớ hơn. Các lợi ích khác của JSX bao gồm việc giúp bạn viết mã nhanh hơn và dễ dàng hơn, cũng như giúp bạn bắt lỗi sớm hơn trong quá trình tích hợp.

Để định nghĩa hướng chính của một hộp flex trong React Native, bạn cần sử dụng thuộc tính flex-direction. Thuộc tính này cho phép bạn xác định hướng chính của hộp flex, có thể là từ trái sang phải (tương tự như dòng văn bản), từ phải sang trái, từ trên xuống dưới hoặc từ dưới lên trên. Ví dụ, nếu bạn muốn hộp flex có hướng chính từ trái sang phải, bạn có thể sử dụng thuộc tính flex-direction với giá trị 'row'. Nếu bạn muốn hộp flex có hướng chính từ trên xuống dưới, bạn có thể sử dụng thuộc tính flex-direction với giá trị 'column'.

Đáp án đúng: "onValueChange". Switch là công tắc bật tắt, nhận prop value kiểu boolean và gọi onValueChange với giá trị boolean mới mỗi khi người dùng gạt; cách dùng điển hình là truyền onValueChange bằng hàm set của useState rồi đưa state đó trở lại vào value để Switch thành controlled component. "onChange" là prop nhận đối tượng sự kiện native thô chứ không trả thẳng giá trị mới, nên không phải prop được dùng để xử lý thay đổi trạng thái công tắc. "onToggle" không phải prop của Switch, chỉ là tên đoán theo nghĩa bật tắt. "onPress" thuộc các component bấm được như Button, Pressable, TouchableOpacity, không dùng để nhận giá trị mới của Switch.

Đáp án đúng: "keyExtractor". FlatList gọi keyExtractor với item và index cho từng phần tử để lấy chuỗi key duy nhất; React dùng key đó khi đối chiếu danh sách cũ với mới, giữ đúng state của từng ô và tránh vẽ lại thừa. Không cung cấp thì FlatList dùng item.key, thiếu nữa thì dùng index. "extractKey" sai vì FlatList không có prop này, nó chỉ là đảo trật tự tên keyExtractor. "itemKey" sai vì đây không phải prop của FlatList; tên gần giống chỉ xuất hiện ở một số thư viện danh sách trên web. "getKey" sai vì FlatList không có prop getKey; các prop dạng hàm của nó mang tên như renderItem, keyExtractor, getItemLayout. Chỉ prop đúng tên mới được VirtualizedList, lớp nền của FlatList, đọc tới.

Đáp án đúng: "AsyncStorage.clearAll()". Câu hỏi tìm phương thức KHÔNG có trong AsyncStorage. Phương thức xoá toàn bộ dữ liệu của AsyncStorage tên là clear(), không có clearAll(), nên gọi AsyncStorage.clearAll() sẽ báo lỗi hàm không tồn tại. "AsyncStorage.mergeItem(key, value)" là phương thức có thật, gộp một chuỗi JSON mới vào giá trị JSON đang lưu ở khoá đó, nên không phải đáp án. "AsyncStorage.removeItem(key)" có thật, xoá một cặp khoá–giá trị, nên cũng bị loại. "AsyncStorage.getAllKeys()" có thật, trả về mảng mọi khoá mà ứng dụng đã lưu, nên không phải phương thức bị hỏi.

Đáp án đúng gồm hai ý: "renderSectionHeader" và "renderItem". SectionList nhận prop sections là mảng các nhóm, mỗi nhóm có tiêu đề và mảng data; renderItem được gọi cho từng mục trong data để vẽ nội dung của mục, còn renderSectionHeader được gọi một lần cho mỗi section để vẽ tiêu đề nhóm nằm phía trên các mục của nó, và hai hàm này cùng tạo nên phần hiển thị của từng section. "renderRow" là prop của ListView cũ, component đã bị gỡ khỏi React Native và được thay bằng FlatList cùng SectionList. "renderComponent" không phải prop của SectionList; ngoài hai hàm trên, SectionList chỉ có các prop hiển thị khác như renderSectionFooter, ListHeaderComponent, ItemSeparatorComponent hay SectionSeparatorComponent.

Để truy cập các tham số của đường dẫn trong một thành phần chức năng trong React Navigation, bạn nên sử dụng hook 'useRoute'. Hook này cho phép bạn truy cập vào các tham số của đường dẫn hiện tại và sử dụng chúng trong thành phần của bạn. Ví dụ, nếu bạn có một đường dẫn như '/users/:id', bạn có thể sử dụng 'useRoute' để truy cập vào tham số ':id' và sử dụng nó để tải dữ liệu người dùng từ cơ sở dữ liệu. Điều này giúp bạn có thể xây dựng các ứng dụng di động phức tạp và linh hoạt hơn.

Để quản lý dữ liệu trong một ứng dụng React Native, có nhiều phương pháp khác nhau. Trong số các lựa chọn trên, "Storage" không phải là một phương pháp quản lý dữ liệu. "useReducer", "Redux", và "MobX" là các thư viện phổ biến được sử dụng để quản lý trạng thái trong ứng dụng React Native. "useReducer" là một hook trong React giúp quản lý trạng thái bằng cách sử dụng một hàm giảm giá. "Redux" là một thư viện quản lý trạng thái tập trung, giúp phân chia ứng dụng thành các phần nhỏ hơn và dễ quản lý hơn. "MobX" là một thư viện quản lý trạng thái dựa trên phản ứng, giúp ứng dụng phản ứng với các thay đổi trong dữ liệu. Ngược lại, "Storage" là một phương pháp lưu trữ dữ liệu, chẳng hạn như bộ nhớ đệm hoặc cơ sở dữ liệu, mà không liên quan trực tiếp đến việc quản lý trạng thái trong ứng dụng.

Khi sử dụng React Native, có hai phương thức quản lý trạng thái quan trọng là useReducer và useState. useReducer được thiết kế để quản lý trạng thái phức tạp và các chuyển đổi trạng thái, trong khi useState phù hợp cho việc quản lý trạng thái đơn giản. Điều này có nghĩa là useReducer có thể xử lý các trạng thái phức tạp hơn, chẳng hạn như các trạng thái phụ thuộc vào nhau, trong khi useState chỉ phù hợp cho các trường hợp đơn giản. Ví dụ, nếu bạn cần quản lý một trạng thái có nhiều thuộc tính và các quy tắc phức tạp để chuyển đổi trạng thái, thì useReducer sẽ là lựa chọn tốt hơn. Ngược lại, nếu bạn chỉ cần quản lý một trạng thái đơn giản, chẳng hạn như một checkbox hoặc một input text, thì useState sẽ đủ.

Đáp án đúng: "The purpose of SafeAreaView is to render content within the safe area boundaries of a device". SafeAreaView tự thêm phần đệm sao cho nội dung nằm trong vùng an toàn, tránh bị tai thỏ, thanh trạng thái, góc bo màn hình và home indicator che mất (bản lõi của React Native chỉ có tác dụng trên iOS 11 trở lên). Phát biểu "automatically adjusts the font size of text elements" sai vì SafeAreaView chỉ đổi phần đệm quanh nội dung, cỡ chữ do style và cài đặt trợ năng của máy quyết định. Phát biểu "provides a secure environment for rendering sensitive user data" hiểu nhầm chữ safe là an toàn bảo mật, trong khi ở đây safe chỉ vùng hiển thị không bị che. "All of the above" sai vì hai phát biểu vừa bác không đúng.

Trong kiến trúc Bridge, có bốn luồng chính trong kiến trúc React Native. Đó là luồng JavaScript, luồng Native, luồng Shadow và luồng Render. Tuy nhiên, luồng Render không phải là một trong những luồng chính trong kiến trúc Bridge. Luồng Render được sử dụng để thực hiện các tác vụ liên quan đến giao diện người dùng, trong khi các luồng khác được sử dụng để thực hiện các tác vụ khác nhau trong ứng dụng. Vì vậy, câu trả lời đúng là "Render Thread".

Đáp án đúng: "Native Thread". Trong kiến trúc Bridge (cầu nối) của React Native, ứng dụng chạy trên vài luồng tách biệt: Native Thread, còn gọi là main thread hay UI thread, là nơi mã gốc Java/Kotlin trên Android hoặc Objective-C/Swift trên iOS được thực thi, vẽ giao diện và nhận sự kiện chạm. "JavaScript Thread" là nơi engine JavaScript chạy mã nghiệp vụ và React, nó chỉ gửi thông điệp qua Bridge chứ không tự thực thi mã native. "Shadow Thread" chuyên tính bố cục bằng Yoga từ các style flexbox rồi chuyển kết quả cho luồng chính, không chạy mã native của ứng dụng. "ReactNative Thread" không phải tên một luồng trong mô hình này, nghe giống thật nhưng không tồn tại trong kiến trúc Bridge.

Đáp án đúng: "Platform module". Module Platform import từ react-native cho biết ứng dụng đang chạy trên nền tảng nào qua Platform.OS với giá trị 'ios' hoặc 'android', cho biết phiên bản hệ điều hành qua Platform.Version, và có Platform.select để chọn giá trị hay style theo từng nền tảng. "Device module" không có trong lõi React Native; thông tin thiết bị như model, hãng thường lấy qua thư viện ngoài như react-native-device-info hay expo-device. "PlatformDetect module" không tồn tại, chỉ là một tên ghép đoán. "OS module" là module os của Node.js dùng trên máy tính hay máy chủ, không có trong app React Native; thứ gần nhất chỉ là thuộc tính Platform.OS bên trong module Platform.

Để thực hiện việc render điều kiện dựa trên nền tảng, chúng ta có thể sử dụng phương thức Platform.select. Phương thức này cho phép chúng ta chọn một trong nhiều mã nguồn dựa trên nền tảng mà ứng dụng đang chạy. Ví dụ, nếu chúng ta muốn hiển thị một biểu tượng khác nhau trên Android và iOS, chúng ta có thể sử dụng Platform.select để chọn biểu tượng phù hợp cho nền tảng hiện tại. Ngoài ra, chúng ta cũng có thể sử dụng Platform.select để điều chỉnh giao diện ứng dụng dựa trên nền tảng, chẳng hạn như thay đổi màu sắc hoặc font chữ.

Để xây dựng và chạy một ứng dụng React Native trên thiết bị Android hoặc máy ảo, bạn cần có một số công cụ đặc biệt. Trước hết, bạn cần cài đặt Android SDK và Android Virtual Device (AVD). Android SDK là bộ công cụ cần thiết để xây dựng và chạy ứng dụng Android, trong khi AVD là một phần mềm mô phỏng thiết bị Android để bạn có thể thử nghiệm ứng dụng của mình mà không cần phải có thiết bị thực tế. Ngoài ra, bạn cũng cần có một trình biên dịch như Gradle để xây dựng ứng dụng của mình. Vì vậy, đáp án đúng là Android SDK và Android Virtual Device (AVD).

Đáp án đúng: "backgroundColor". Style trong React Native là đối tượng JavaScript nên tên thuộc tính viết theo kiểu camelCase (viết liền, viết hoa chữ đầu mỗi từ từ từ thứ hai) thay cho dấu gạch ngang của CSS; màu nền khai báo là backgroundColor, ví dụ backgroundColor: 'tomato' hoặc 'rgb(255, 255, 255)'. "background-color" sai vì đây là cú pháp CSS trên web; React Native không nhận tên có gạch ngang làm thuộc tính style. "bg-color" sai vì đây là cách viết tắt không tồn tại trong style của React Native. "bg" sai vì đây là kiểu tên lớp tiện ích của Tailwind hay NativeWind, không phải thuộc tính style; StyleSheet sẽ coi nó là thuộc tính không hợp lệ.