JavaScript函数传递字符串参数的基础语法

在 JavaScript 开发中，向函数传递字符串参数是最基础也是最频繁的交互方式。掌握形参（Parameter）与实参（Argument）的对应关系、字符串字面量的不同书写形式，以及传递过程中的求值机制，是编写稳健代码的前提。

一、形参与实参的基础定义与调用流程

函数在声明阶段定义的变量称为“形参”，用于在函数体内部占位；而在调用函数时实际传入的具体数据称为“实参”。当实参为字符串类型时，可以直接传递字符串字面量，也可以传递存储了字符串的变量。

// 1. 声明接收字符串参数的函数
function showMessage(message) {
  // 在函数内部直接使用形参 message
  console.log("接收到的消息内容：" + message);
}

// 2. 方式 A：直接传入字符串字面量
showMessage("Hello World");

// 3. 方式 B：传入保存了字符串的变量
const currentTopic = "函数参数基础";
showMessage(currentTopic);

在调用 showMessage("Hello World") 时，JavaScript 引擎会为形参 message 赋值。在整个函数作用域内，message 作为一个局部变量存在，其生命周期跟随当前函数的执行周期。

二、实参传入的三种字符串字面量形式

在向函数传递字符串实参时，JavaScript 提供了三种字面量表达方式：单引号、双引号与模板字面量（反引号）。理解它们各自的语法规则有助于避免转义冲突并提高代码可读性。

1. 单引号与双引号

单引号（'...'）和双引号（"..."）在语法功能上完全等价。它们的主要区别体现在嵌套引号时的转义处理：如果字符串内部包含与外层定界符相同的引号，必须使用反斜杠 \ 进行转义；若包含不同种类的引号，则无需转义。

function logText(text) {
  console.log(text);
}

// 单引号内含双引号：无需转义
logText('这是包含 "双引号" 的字符串');

// 双引号内含双引号：必须使用反斜杠转义
logText("这是包含 \"双引号\" 的字符串");

// 换行与特殊字符
logText("第一行内容\n第二行内容");

2. 模板字面量（反引号）

ES6 引入的反引号（`...`）为字符串参数提供了更强大的支持。通过 ${expression} 语法，可以直接在传入实参时嵌入变量或表达式，字符串解析完成后再交付给函数。此外，模板字面量原生支持多行排版，无需显式书写 \n。

const userName = "张三";
const currentRole = "前端工程师";

// 使用模板字面量直接完成动态拼接并传参
logText(`用户 ${userName} 的当前岗位是：${currentRole}`);

// 传递包含自然换行的长字符串
logText(`系统提示：
- 任务执行成功
- 状态码：200`);

三、底层机制：按值传递与字符串不可变性

初学者容易产生一个疑问：“如果在函数内部修改了传入的字符串参数，外部的原始变量会不会改变？”在 JavaScript 中，答案是绝对不会。这是由语言层面的“按值传递”和“字符串不可变性”两条基本规则决定的。

1. 按值传递（Pass by Value）

JavaScript 中所有原始类型（Primitive Types：字符串、数值、布尔值、null、undefined 等）在作为函数参数传递时，传递的都是该值在内存中的独立副本。形参接收到的是值本身，而非变量的内存地址指针。

function modifyString(str) {
  // 对形参重新赋值
  str = "修改后的新文本";
  console.log("函数内 str:", str); // 输出："修改后的新文本"
}

let originalText = "原始文本";
modifyString(originalText);

// 外部变量完全不受影响
console.log("外部 originalText:", originalText); // 输出："原始文本"

2. 字符串的不可变性（Immutability）

在 JavaScript 中，字符串的值一旦创建便无法原地修改。所有看似“修改”字符串的原生方法（例如 toUpperCase()、trim()、replace()），实际上都是在底层创建并返回了一个全新的字符串，原始字符串保持只读。

function formatGreeting(text) {
  // toUpperCase() 返回新字符串，text 本身的值未变
  text.toUpperCase(); 
  console.log("未接收返回值:", text); // 依然是原始大小写

  // 必须通过变量接收操作结果
  const formatted = text.toUpperCase();
  return formatted;
}

四、常见问题：默认值、类型校验与特殊场景

在实际编码中，由于调用方可能遗漏参数或传入非预期类型，需要结合现代语法为字符串参数设置合理的防御策略。

1. 处理未传参：ES6 默认参数语法

如果调用函数时未提供实参，形参的值将为 undefined。为防止出现 "undefined" 的尴尬拼接结果，可以在声明形参时使用赋值符号 = 赋予默认字符串。

// 设置默认字符串参数 "游客"
function welcomeUser(username = "游客") {
  console.log(`欢迎光临，${username}！`);
}

welcomeUser("李四");  // 输出：欢迎光临，李四！
welcomeUser();        // 未传参，触发默认值，输出：欢迎光临，游客！
welcomeUser("");      // 传入空字符串也是有效实参，输出：欢迎光临，！

2. 防御性类型校验：确保参数为字符串

JavaScript 是弱类型语言。如果调用方传入了对象、数值或布尔值，直接调用 str.trim() 等字符串特有方法会导致程序抛出 TypeError 异常。使用 typeof 进行前置断言是保证健壮性的通用模式。

function sanitizeInput(input) {
  // 校验参数类型是否为 string
  if (typeof input !== "string") {
    console.warn("参数非字符串，已进行强制转换或容错处理");
    // 可以选择抛出错误，或通过 String() 进行类型转换
    input = String(input ?? "");
  }

  return input.trim();
}

五、全文要点回顾

• 形参与实参角色分明：形参是函数声明时的占位符，实参是函数调用时传入的具体值。
• 三种传递字面量：单引号和双引号功能一致但需注意内部引号转义；模板字面量支持 ${} 变量插值与多行排版，是现代开发的首选。
• 按值传递与不可变性：字符串参数以独立值副本的形式传入函数，函数内部任何赋值与方法调用均不会改变外部原变量。
• 默认参数与类型保护：善用 ES6 默认参数 (str = "默认") 兜底未传参场景，并使用 typeof str === "string" 进行防御性校验以确保程序健壮性。