面试题：JavaScript模板字符串与标签函数在复杂数据格式化中的深度应用

Question

给定一个包含多层嵌套对象的数据结构，例如`const data = { name: 'John', age: 30, address: { city: 'New York', street: '123 Main St' } }`。要求使用模板字符串结合标签函数实现一个格式化输出，将数据以特定的文本格式展示，如'Name: John, Age: 30, Address: New York, 123 Main St'。详细说明实现思路、标签函数的工作原理以及如何确保代码的可维护性和扩展性。

Answer 1

实现思路

1. 利用标签函数接收模板字符串的各个部分以及对应插值的值。
2. 递归遍历嵌套对象，将其展开为需要的文本格式。
3. 拼接各部分文本，形成最终格式化输出。

标签函数工作原理

标签函数在模板字符串前被调用，它的第一个参数是一个数组，包含模板字符串中不包含插值的部分。后续参数是模板字符串中插值表达式的值。标签函数可以根据这些参数进行自定义处理，返回最终的字符串。

代码实现

function formatData(template,...values) {
    let result = '';
    for (let i = 0; i < template.length; i++) {
        result += template[i];
        if (i < values.length) {
            if (typeof values[i] === 'object') {
                result += Object.values(values[i]).join(', ');
            } else {
                result += values[i];
            }
        }
    }
    return result;
}

const data = { name: 'John', age: 30, address: { city: 'New York', street: '123 Main St' } };
const output = formatData`Name: ${data.name}, Age: ${data.age}, Address: ${data.address}`;
console.log(output);

确保可维护性和扩展性

1. 模块化：将格式化逻辑封装在一个函数中，便于复用和修改。
2. 注释：在关键代码处添加注释，说明代码功能和作用，提高可读性。
3. 错误处理：添加必要的错误处理，如处理values中可能出现的非对象或非基本类型值，防止程序崩溃。
4. 扩展性：对于更复杂的嵌套结构，可以进一步优化递归逻辑，使其能够处理多层嵌套，并且支持不同类型嵌套对象的格式化。例如，对于数组嵌套也能正确处理。