我的问题库

1. 一个JS组件不能绑定多个方法吗？

• 可以绑定多个方法。在JavaScript中，可以通过多种方式为一个组件或事件绑定多个方法。
• 使用addEventListener：对于DOM事件，可以使用addEventListener为同一个事件添加多个处理函数。
• 在框架中：如React、Vue等，通常可以在组件的方法中直接调用多个函数，或者在事件处理中组合多个函数。

2. 前端路由技术是什么？

• 前端路由是一种允许前端通过URL变化来更新页面部分内容的技术，而无需重新加载整个页面。
• 实现方式：通常通过监听URL的hash变化（如hashchange事件）或使用HTML5的History API（如pushState和replaceState）来实现。
• 应用场景：在单页应用（SPA）中广泛使用，提供无刷新页面切换体验。

3. node_modules文件夹处理

• 直接复制：可以将以前项目编译完成的node_modules文件夹复制到新项目中，这确实比重新安装所有依赖要快。
• 注意事项：

  确保新项目的package.json与旧项目的依赖版本兼容。

  可能需要运行npm install或yarn install来确保所有依赖正确链接，即使复制了node_modules。

4. JS文件引入语句的位置

• 最佳实践：将JS文件引入语句放在<body>标签的底部，以减少页面加载时的阻塞。
• 缺点：如问题描述中所述，可能导致加载顺序问题和性能问题。
• 解决方案：使用模块加载器如RequireJS，或现代前端构建工具如Webpack、Rollup等，它们可以处理依赖关系和优化加载。

5. CSS padding与line-height问题

• 问题描述：当设置padding: 5px 0px时，上下padding看起来比5px多。
• 解决方案：设置line-height: 1可以解决这个问题，因为它确保了行高与字体大小相同，从而减少了额外的空间。

6. CSS优先级与覆盖问题

• 优先级规则：CSS选择器的优先级决定了哪个样式会被应用。ID选择器（#id）的优先级高于类选择器（.class），类选择器的优先级高于标签选择器（div）。
• 覆盖问题：如果后加载的CSS文件中的样式没有足够的优先级来覆盖先前的样式，那么先前的样式将保持不变。
• 调试方法：使用浏览器的开发者工具检查元素的计算样式，以确定哪个样式正在被应用。

7. 字体大小与div高度问题

• 问题描述：当在外层div设置字体大小时，可能会导致外层div的高度大于内层div。
• 解决方案：在内层div也设置相同的字体大小，或者调整padding/margin来确保高度一致。
• 居中问题：设置padding-top或padding-bottom为很小的值（如0.1px）可以帮助解决字体不居中的问题。

8. JS服务器端编程与浏览器端编程的区别

• 服务器端编程：JS在服务器端（如Node.js）用于处理数据、与数据库交互、处理HTTP请求等。
• 浏览器端编程：JS在浏览器中用于增强用户体验、处理DOM事件、实现动态效果等。
• 主要区别：执行环境（服务器 vs 浏览器）、可用API（如文件系统、网络请求等）、性能考虑（如并发处理）。

9. 匿名函数

• 定义：匿名函数是没有名称的函数，通常用于需要函数作为参数传递的场景（如回调函数）。
• 示例：function() { console.log('This is an anonymous function'); }。

10. JS定义方法可以不写方法名吗？

• 可以：如匿名函数所示，可以定义没有名称的函数。
• 参数传递：匿名函数可以接受参数，并在函数体内使用这些参数。
• 使用场景：常用于事件处理、回调函数、立即执行函数表达式（IIFE）等。

11. 框架的work配置

• 配置示例："work": "cd rs && fis3 release -w"是一个npm脚本配置，用于在项目目录中执行一系列命令。
• 解释：cd rs进入rs目录，&&用于连接两个命令，fis3 release -w使用FIS3工具进行构建并监视文件变化。
• 使用：可以通过npm run work来执行这个脚本。

12. jQuery的append方法与JS的append

• jQuery的append：用于向选定的元素内部追加内容（可以是HTML字符串、DOM元素、文本节点等）。
• JS的append：原生JavaScript没有直接的append方法，但可以通过appendChild、innerHTML或insertAdjacentHTML等方法实现类似功能。
• 渲染问题：如果使用字符串拼接并尝试通过innerHTML添加，确保字符串是有效的HTML，并且没有语法错误。

13. 两种函数调用方式的区别

• 直接调用：web.on_hash_change(get_lists(init_view));会立即执行get_lists(init_view)并将其结果作为参数传递给on_hash_change。
• 匿名函数包装：web.on_hash_change(function () { get_lists(init_view); });会在on_hash_change事件触发时执行匿名函数内的代码，即调用get_lists(init_view)。
• 主要区别：执行时机和参数传递方式。

14. TPL模板文件报错处理

• 问题描述：TPL模板文件可能因重复字段或其他语法错误而报错。
• 解决方案：

  检查模板文件中的语法错误。

  注释掉引入模板的地方或简化模板内容以进行测试。

  确保模板引擎正确配置并支持所有使用的语法特性。

15. JS调试工具

• 浏览器开发者工具：大多数现代浏览器都内置了强大的开发者工具，包括JavaScript调试器。
• Node.js调试：可以使用Node.js内置的调试器或第三方工具如VS Code的调试功能。
• 日志输出：使用console.log、console.error等输出调试信息。

16. ES5与ES6

• ES5：ECMAScript 5，是JavaScript的一个版本，于2009年发布，引入了许多新特性如严格模式、JSON支持、数组方法等。
• ES6（ECMAScript 2015）：是JavaScript的下一个主要版本，引入了类、模块、箭头函数、解构赋值、模板字符串等许多新特性，极大地增强了语言的能力。
• 后续版本：ES6之后，ECMAScript每年发布一个新版本（如ES7/ES2016、ES8/ES2017等），继续引入新特性和改进。