1. ¿Qué tipos de datos tiene Javascript? ¿Dé ejemplos de los dos tipos de datos de objetos integrados más comunes?
常用的数据类型:Number,String,Boolean,Null,Undefined,Object
常见内置对象:Array,Function
2. ¿Cuál es el resultado del siguiente código?
let a = [];
a[10] = 10;
console.log(a.length);
console.log(a[0]);
a[200] = undefined;
console.log(a.length);
console.log(a['10']);
El resultado es el siguiente:
console.log(a.length); //11
console.log(a[0]); //undefined
a[200] = undefined;
console.log(a.length); //201
console.log(a['10']); //10
3. ¿Cuál es el resultado del siguiente código?
console.log(null==undefined);
console.log("1"==1);
console.log(0.3 == 0.1+0.2);
let obj1 = {
a:1}; let obj2 = {
a:1};
console.log(obj1==obj2);
let obj3 = obj1; obj3.a=100;
console.log(obj1==obj3);
El resultado es el siguiente:
console.log(null==undefined); //true
console.log("1"==1); //true
console.log(0.3 == 0.1+0.2); //false //这是因为浮点数在计算机中以二进制表示，而一些语言对十进制小数无法精确地表示为有限的二进制小数。0.1 和 0.2 都是十进制小数，但在计算机中以二进制表示时会有一些近似值，但不是完全相等的。 //0.3==0.3 是对的
console.log(obj1==obj2); //false 引用地址不等
console.log(obj1==obj3); //true 引用地址相等
4. ¿En qué circunstancias document.addEventListener y document.removeEventListener se borrarán y dejarán de ser válidos?
Respuesta:
//错误实例
document.addEventListener('click', boundHandleClick.bind(this)); //错误
// 在某个时刻尝试移除事件监听器
document.removeEventListener('click', boundHandleClick.bind(this)); //错误
/*
*当我们尝试使用 removeEventListener 移除事件监听器时，由于绑定后的函数与原始函数不同，它们无
法匹配，因此无法正确移除监听器。因此，绑定 this 后的函数无法通过绑定后的函数来移除事件监听器。
*/
//正确案例
function handleClick(event) {
console.log('点击事件处理程序', this);
}
const boundHandleClick = handleClick.bind({
name: 'Example' });
document.addEventListener('click', boundHandleClick);
// 在某个时刻尝试移除事件监听器
document.removeEventListener('click', boundHandleClick);
5.js, dada una matriz de tipo numérico Array<number>, varias formas de devolver el valor máximo o mínimo
第1种、使用 Math.max() 和 Math.min() 函数：
let arr = [1, 2, 3, 4, 5];
let max = Math.max(...arr);
let min = Math.min(...arr);
第2种、使用 reduce() 函数：
let arr = [1, 2, 3, 4, 5];
let max = arr.reduce((max, val) => Math.max(max, val), -Infinity);
let min = arr.reduce((min, val) => Math.min(min, val), Infinity);
第3种、使用 for 循环：
let arr = [1, 2, 3, 4, 5];
let max = -Infinity;
let min = Infinity;
for(let i = 0; i < arr.length; i++) {
if(arr[i] > max) {
max = arr[i];
}
if(arr[i] < min) {
min = arr[i];
}
}
6.js eliminación de cadenas de caracteres repetidos.
(1) Utilice Establecer estructura de datos:
const str = "Hello World";
const uniqueStr = [...new Set(str)].join("");
console.log(uniqueStr); // Output: "Helo Wrd"
Este método aprovecha las propiedades de la estructura de datos Set, que solo almacena valores únicos. Después de convertir la cadena en un objeto Set, conviértala nuevamente en una cadena para obtener el resultado sin los caracteres duplicados.
(2), utilice expresiones regulares y método de reemplazo:
const str = "Hello World";
const uniqueStr = str.replace(/(.)(?=.*\1)/g, "");
console.log(uniqueStr); // Output: "Helo Wrd"
Este método utiliza expresiones regulares y anticipación positiva para hacer coincidir y eliminar caracteres duplicados. La expresión regular /(.)(?=.*\1)/gcoincide con cualquier carácter y coincide si al carácter le sigue el mismo carácter.
.: Coincide con cualquier carácter.(?=.*\1): Mire hacia adelante para asegurarse de que exista el mismo carácter después de la posición actual.g: Coincidencia global, elimina todos los caracteres coincidentes.
Eliminación de cadenas 7.js de ciertos caracteres
(1), utilice expresiones regulares y método de reemplazo:
const str = "Hello, World!";
const charToRemove = ",";
const removedStr = str.replace(new RegExp(charToRemove, "g"), "");
console.log(removedStr); // Output: "Hello World!"
Este método utiliza expresiones regulares para hacer coincidir y reemplazar los caracteres que desea eliminar. Todos los caracteres coincidentes en una cadena se pueden eliminar pasando los caracteres que se eliminarán como argumentos al RegExpconstructor y especificando la bandera para la coincidencia global."g"
(2), utilice métodos de división y unión:
const str = "Hello, World!";
const charToRemove = ",";
const removedStr = str.split(charToRemove).join("");
console.log(removedStr); // Output: "Hello World!"
Este método hace uso de los métodos splity de la cadena join. Primero, use splitel método para dividir la cadena en una matriz de acuerdo con los caracteres que se eliminarán, y luego use joinel método para fusionar los elementos de la matriz en una nueva cadena para lograr el propósito de eliminar los caracteres especificados.
8. Elimine los valores duplicados de la matriz js
(1), use Establecer estructura de datos:
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [...new Set(array)];
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]
Este método aprovecha las propiedades de la estructura de datos Set, que solo almacena valores únicos. Después de convertir la matriz en un objeto Set, volver a convertirla en una matriz eliminará los valores duplicados.
(2), utilice el método de filtro e indexOf:
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.filter((value, index, self) => {
return self.indexOf(value) === index;
});
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]
(3) Este método utiliza filterun método combinado con indexOfun método para filtrar los valores únicos en la matriz. En la función de devolución de llamada, determine si el índice del elemento actual es igual al índice de la primera aparición para determinar si es un valor único.
//使用 reduce 方法：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.reduce((accumulator, currentValue) => {
if (!accumulator.includes(currentValue)) {
accumulator.push(currentValue);
}
return accumulator;
}, []);
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]
Este método utiliza reduceel método para iterar a través de la matriz y determinar si se debe agregar a la matriz resultante en función de si el valor actual ya está contenido.
La matriz 9.js elimina un determinado valor
(1), utilice el método de filtrado:
const array = [1, 2, 3, 4, 2, 5];
const valueToRemove = 2;
const filteredArray = array.filter((value) => value !== valueToRemove);
console.log(filteredArray); // Output: [1, 3, 4, 5]
Este método utiliza filterel método para filtrar los elementos de la matriz que no son iguales al valor específico que se va a eliminar, lo que da como resultado una nueva matriz.
(2), utilice el método de empalme:
const array = [1, 2, 3, 4, 2, 5];
const valueToRemove = 2;
for (let i = array.length - 1; i >= 0; i--) {
if (array[i] === valueToRemove) {
array.splice(i, 1);
}
}
console.log(array); // Output: [1, 3, 4, 5]
Este método utiliza spliceel método para eliminar directamente elementos de una matriz que son iguales a un valor específico. Cabe señalar que atravesar y eliminar elementos de atrás hacia adelante puede evitar el problema de la desalineación del índice.
(3) Utilice el método de reducción:
const array = [1, 2, 3, 4, 2, 5];
const valueToRemove = 2;
const filteredArray = array.reduce((accumulator, currentValue) => {
if (currentValue !== valueToRemove) {
accumulator.push(currentValue);
}
return accumulator;
}, []);
console.log(filteredArray); // Output: [1, 3, 4, 5]
Este método utiliza reduceel método para iterar sobre la matriz y decidir si agregar a la matriz resultante en función de si el elemento actual es igual a un valor específico que se eliminará.
10. ¿Cuál es el problema de esto?
Por ejemplo: el video de Bilibili explica
que Baidu Yibo tiene muchos
11. Comprensión de cierres y escenarios de uso
como: análisis de video de Bilibili
12.js aplanamiento de matriz
function flattenArray(arr) {
let result = [];
arr.forEach(item => {
if (Array.isArray(item)) {
result = result.concat(flattenArray(item));
} else {
result.push(item);
}
});
return result;
}
// 示例输入
const nestedArray = [1, [2, [3, 4], 5], 6, [7, 8]];
// 调用扁平化函数
const flattenedArray = flattenArray(nestedArray);
// 输出结果
console.log(flattenedArray); //[1, 2, 3, 4, 5, 6, 7, 8]
new13. ¿Cuántas cosas principales suceden durante el proceso de construcción ?
(可以百度网上有详细说明)
1.创建一个空对象
2.将函数的显示原型赋值给空对象的隐式原型
3.将函数的this指向空对象
4.返回新对象
注意当构造函数返回不是对象时，返回的还是this
14. ¿Cuáles son las similitudes y diferencias entre js apply, bind y call?
Aplicar, vincular y llamar son métodos utilizados para cambiar el contexto de ejecución de una función. Tienen algunas similitudes y diferencias, así como diferentes principios de implementación.
Mismo punto:
Cambiar el contexto de ejecución de una función: aplicar, vincular y llamar se utilizan para cambiar este puntero dentro de la función, es decir, especificar el objeto de contexto cuando se ejecuta la función.
diferencia:
Método de paso de parámetros: tanto la aplicación como la llamada pueden pasar parámetros a funciones, pero de diferentes maneras. apply acepta una matriz o un objeto similar a una matriz que contiene parámetros, mientras que call acepta parámetros enumerados uno por uno. bind puede vincular algunos parámetros y devolver una nueva función. La nueva función se puede llamar más tarde y pasar los parámetros restantes.
Valor de retorno: los métodos de aplicación y llamada ejecutarán la función inmediatamente cuando se llamen y devolverán el resultado de la función. El método de vinculación devuelve una nueva función y no ejecuta la función original inmediatamente.
Preguntas del creador de Cocos
1. ¿Cuál es el principio de adaptación de la pantalla?
(1) Resolución de diseño. Para los exámenes de diseño artístico, se necesita un tamaño de resolución para proporcionar una referencia para el desarrollo y el diseño y para adaptarse a diferentes resoluciones de teléfonos móviles.
(2).Estrategia de adaptación: Adaptación de altura/Adaptación de ancho.
Por ejemplo, en la pantalla horizontal del juego, si adaptamos la altura, necesitamos hacer una conversión de proporción entre la altura del diseño en el borrador del diseño y la altura de la ventana gráfica. de modo que en la pantalla del juego, el efecto de visualización es el efecto de visualización convertido en proporción.
Para diferentes modelos de teléfonos móviles, la altura y el ancho de los teléfonos móviles son diferentes, lo que puede no coincidir necesariamente con la relación alto-ancho del borrador del diseño.¿Cómo lograr efectos de diseño y posición?
①Puntos de acoplamiento: en el juego, puedes mover o centrar los puntos superior, inferior, izquierdo y derecho a través del script del componente Widget; ②Ajustar el
tamaño y el ancho del área del borde;
③Escalar o diseñar el contenido a través del Diseño;
2. ¿Cuál es el ciclo de vida y el uso de cocos creador?
(1) Descripción general del ciclo de vida:
onLoad: se llama inmediatamente después de cargar el nodo y se utiliza para inicializar algunas configuraciones del nodo y los componentes.
inicio: se llama después de ejecutar onLoad y se utiliza para realizar operaciones que deben esperar hasta que se inicialicen todos los nodos y componentes.
actualización: se llamará en cada cuadro para actualizar la lógica y el estado del juego.
lateUpdate: llamado después de la actualización, utilizado para realizar algunas operaciones que deben realizarse después de la actualización.
onDestroy: se llama antes de que se destruya el nodo para realizar algún trabajo de limpieza.
Cómo utilizar el ciclo de vida:
En Cocos Creator, puede utilizar estas funciones del ciclo de vida definiéndolas en componentes de script.
Escriba las funciones correspondientes en el componente del script, como onLoad (), start (), update (), etc., e implemente la lógica correspondiente dentro de la función.
Estas funciones se llamarán automáticamente en el momento correspondiente. Puede realizar configuraciones de inicialización, carga de recursos, actualizaciones de la lógica del juego, etc. dentro de las funciones.
Si necesita montar un componente de secuencia de comandos en un nodo y utilizar su función de ciclo de vida, puede seleccionar el nodo a través de la interfaz del editor y agregar el componente correspondiente.
Consideraciones sobre el ciclo de vida:
El orden de ejecución de las funciones del ciclo de vida es fijo y puedes confiar en estas órdenes para gestionar correctamente los objetos y el estado del juego.
Evite realizar operaciones que requieran mucho tiempo en las funciones del ciclo de vida para evitar afectar el rendimiento del juego.
Realice trabajos de liberación y limpieza de recursos en la función de ciclo de vida onDestroy para evitar pérdidas de memoria y desperdicio de recursos.
3. ¿Cuáles son las diferencias y funciones de onLoad y start en el ciclo de vida de cocos Creator?
(1), función de ciclo de vida onLoad:
Función: se llama inmediatamente después de cargar el nodo y se utiliza para inicializar algunas configuraciones del nodo y los componentes. Es un punto de entrada a la fase de inicialización.
Cuándo llamar: la función onLoad se llamará cuando se cree una instancia del nodo y sus componentes y se agreguen a la escena. Antes de ejecutar la función onLoad, se han asignado valores a las propiedades de los nodos y componentes, pero en este momento no hay garantía de que se hayan ejecutado las funciones onLoad de otros nodos y componentes relacionados.
Escenarios de uso: en onLoad, puede realizar operaciones como configuraciones de inicialización, obtener referencias y registrar detectores de eventos. En esta función también se pueden realizar operaciones asincrónicas, como carga de recursos y solicitudes de red, pero se debe prestar atención al tiempo de ejecución y al orden de las operaciones asincrónicas.
(2), iniciar la función del ciclo de vida:
Función: después de ejecutar onLoad, se llamará a la función de inicio. Es el punto de entrada después de que los nodos y componentes hayan completado la inicialización.
Tiempo de llamada: cuando el nodo y sus componentes se inicializan, se llamará a la función de inicio. Antes de ejecutar la función de inicio, se han ejecutado las funciones onLoad de todos los nodos y componentes.
Escenarios de uso: al inicio, puede realizar algunas operaciones que deben esperar a que todos los nodos y componentes se inicialicen antes de poder ejecutarse, como reproducción de animación, inicio del temporizador, inicialización de la lógica del juego, etc.
4. ¿Cuáles son las funciones y usos del ciclo de vida del creador de cocos ondisable y ondestroy?
Se utilizan para gestionar el proceso de desactivación y destrucción de los objetos del juego.
(1), función de ciclo de vida onDisable:
Función: se llama cuando el nodo está deshabilitado y se utiliza para realizar algunas operaciones que deben realizarse cuando el nodo está deshabilitado.
Tiempo de llamada: la función onDisable se llamará cuando el nodo esté deshabilitado (como eliminar el nodo de la escena o deshabilitar el nodo principal del nodo).
Escenarios de uso: en onDisable, puede pausar alguna lógica relacionada con los nodos, detener temporizadores, cancelar detectores de eventos y otras operaciones.
Nota: La función onDisable no se llamará cuando se cree el nodo por primera vez, solo se activará cuando el nodo se activó y deshabilitó previamente.
(2), función del ciclo de vida onDestroy:
Función: se llama antes de que se destruya el nodo y se utiliza para realizar algunos trabajos de limpieza y operaciones de liberación de recursos.
Tiempo de llamada: cuando se destruye el nodo (como eliminar el nodo de la escena o llamar directamente al método de destrucción del nodo), se llamará a la función onDestroy.
Escenarios de uso: en onDestroy, puede liberar recursos de nodos y componentes, cancelar detectores de eventos, limpiar temporizadores y otras operaciones.
Nota: La función onDestroy se llama cuando el nodo está a punto de ser destruido. En este momento, las propiedades y métodos del nodo y los componentes aún están disponibles, pero es posible que se hayan destruido otros nodos y componentes relacionados.
Cabe señalar que deshabilitar un nodo no activa la función onDestroy inmediatamente. Si necesita realizar algunas operaciones antes de que se destruya el nodo, puede realizar el procesamiento relacionado en onDisable o llamar al método de destrucción del nodo externamente para activar activamente la función onDestroy.
5. ¿Cómo funciona la actualización en caliente de Cocos Creator?
La función de actualización en caliente de Cocos Creator permite actualizar el código y los recursos mientras el juego se ejecuta sin tener que volver a publicar el juego completo. El siguiente es el principio básico de la actualización en caliente de Cocos Creator:
Almacenamiento de recursos del lado del servidor:
Durante el proceso de actualización en caliente, se requiere un servidor para almacenar los archivos de recursos actualizados del juego. Generalmente se utilizan HTTP u otros protocolos de red para descargar y actualizar los recursos.
Gestión de versiones:
En el juego, es necesario definir un número de versión para identificar la versión actual del juego. Puede utilizar un archivo de configuración o los datos devueltos por la API del servidor para obtener el número de versión más reciente del juego.
Comprobación de actualización de recursos:
Cuando se inicia el juego, envía una solicitud al servidor para verificar si hay una nueva versión disponible para actualizar. Por lo general, el número de versión del juego local se compara con el número de versión más reciente en el servidor.
Descargue recursos actualizados:
Si hay una nueva versión disponible para actualizar, el juego obtendrá la lista de recursos que deben actualizarse según el archivo de lista de recursos proporcionado por el servidor (normalmente un archivo JSON).
El juego descargará los archivos de recursos al dispositivo de almacenamiento local uno por uno de acuerdo con la lista de recursos. Puedes usar el descargador proporcionado por Cocos Creator o personalizar la lógica de descarga.
Actualizar archivos de recursos:
Una vez completada la descarga, el juego reemplazará los archivos de recursos locales antiguos con los archivos de recursos nuevos. De esta manera, el juego cargará los archivos más recientes cuando utilice recursos.
Comprobaciones y reemplazos de actualización de código:
Para actualizaciones del código JavaScript, puede utilizar la función eval o crear dinámicamente
6. ¿Cuál es la diferencia entre xml y json?
XML (lenguaje de marcado extensible) y JSON (notación de objetos JavaScript) son dos formatos de intercambio de datos comúnmente utilizados y tienen las siguientes diferencias:
Estructuras gramaticales:
XML utiliza una estructura jerárquica de etiquetas y atributos para representar datos, como el contenido.
JSON utiliza la estructura de pares clave-valor para representar datos, como { "clave": "valor" }.
Soporte de tipo de datos:
XML no admite directamente tipos de datos y todos los datos se representan en forma de cadenas. Debe analizarse y convertirse según las necesidades de la aplicación.
JSON admite una variedad de tipos de datos, incluidas cadenas, números, valores booleanos, matrices, objetos, etc.
legibilidad:
XML se describe a sí mismo y las etiquetas y atributos pueden denominarse de manera más legible y comprensible.
La sintaxis de JSON es más concisa y puede resultar más fácil de leer y escribir para estructuras de datos complejas.
Tamaño del archivo:
Los archivos XML suelen ser más grandes que los archivos JSON porque XML utiliza más etiquetas y atributos.
Los archivos JSON son relativamente pequeños porque utilizan una estructura clave-valor concisa.
Análisis y serialización:
El análisis y la serialización de XML requiere el uso de bibliotecas adicionales o analizadores personalizados.
El análisis y la serialización JSON son compatibles de forma nativa con JavaScript y se pueden operar directamente usando JSON.parse() y JSON.stringify().
Interacción de datos:
XML se usa más comúnmente en campos como SOAP, RSS y archivos de configuración en transmisión e interacción.
JSON se usa más comúnmente en aplicaciones web, especialmente para la interacción y transferencia de datos con el lenguaje JavaScript.
La elección de utilizar XML o JSON depende de las necesidades y escenarios específicos. XML es más adecuado para datos con estructura compleja y requisitos autodescriptivos, mientras que JSON es más adecuado para el intercambio de datos ligero y la interacción con JavaScript. Además, también se deben considerar factores como la compatibilidad con otros sistemas, herramientas y lenguajes, así como la eficiencia de la transferencia de datos.
7. ¿El grupo de objetos consume CPU o GPU?
El grupo de objetos es un patrón de diseño que se utiliza para administrar instancias de objetos reutilizables para mejorar el rendimiento y la utilización de recursos. Los grupos de objetos generalmente se implementan manteniendo un conjunto de objetos creados previamente en la memoria y recuperando objetos del grupo cuando es necesario, en lugar de crear y destruir objetos con frecuencia.
El grupo de objetos en sí no implica directamente el consumo de CPU (Unidad central de procesamiento) o GPU (Unidad de procesamiento de gráficos). Es un patrón de diseño de software que se centra en la reutilización y gestión de recursos.
Sin embargo, en determinados contextos, el uso de grupos de objetos puede tener cierto impacto en el consumo de CPU o GPU. Por ejemplo, en el desarrollo de juegos, el uso de grupos de objetos puede reducir la creación y destrucción frecuentes de objetos, reduciendo así la sobrecarga de la CPU. Esto se debe a que la creación y destrucción de objetos implica operaciones como la asignación y liberación de memoria, y el grupo de objetos puede evitar estos gastos generales y mejorar el rendimiento.
Por otro lado, el uso de grupos de objetos también puede tener cierto impacto en la GPU, especialmente en escenarios que involucran renderizado de gráficos. El grupo de objetos puede administrar recursos de renderizado reutilizables (como texturas, modelos, etc.), reduciendo así el costo de carga y liberación de recursos y mejorando la eficiencia de la GPU.
En general, la agrupación de objetos en sí misma es un patrón de diseño de software que no implica directamente el consumo de CPU o GPU. Sin embargo, al optimizar la reutilización y gestión de recursos, los grupos de objetos pueden tener un impacto positivo en el consumo de CPU y GPU en contextos específicos, mejorando el rendimiento y la utilización de recursos.