js 同时有单引号和双引号表示什么意思？

Question

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"'
})

代码出处：https://juejin.cn/post/702588...

比如上面的 NODE_ENV: '"development"' 为什么外面是单引号，里面又要用双引号？

Answer 1

在你这个例子下，打包过程中 NODE_ENV 的值会被替换到打包后的代码中

源代码

const NODE_ENV = process.env.NODE_ENV;

替换后

const NODE_ENV = "development";

去除表示字符串的引号会导致当做变量处理

Answer 2

意思应该不难理解，我觉得为什么要这样可能是你更想知道的。
https://webpack.docschina.org...

Answer 3

双引号是字符串的一部分。

就是说，NODE_ENV 的值是 "development" ，而不是 development。

Answer 4

下面回答中，分割线以下的部分解释了同时使用单引号和双引号的问题，但是恐怕解释不了对问题中的这段代码的理解。而要解释代码中的问题，可能得看分隔线之上的这一部分。回答中涉及到“字符串内容”的说法，请参考阅读分隔线之后的部分。

从你给的链接看看 —— 一般这种排版的文章我是懒得看的，代码和非代码都没排清楚，中间肯定存在各种错误信息，除非你对语法非常熟，不然看这种文章就是给自己找茬。

从源代码定义（赋值）和使用来分析：

// 变量赋值
module.exports = {
    NODE_ENV: '"development"', // 开发环境
    API_ROOT: '"http://192.168.1.1:5000"' // 填上自己的接口的网址
}


// 使用
import dev from '../config/dev.env.js'
import pro from '../config/pro.env.js'
const NODE_ENV = process.env.NODE_ENV;

if (NODE_ENV === 'production') {
    axios.defaults.baseURL = pro.API_ROOT;
} else {
    axios.defaults.baseURL = dev.API_ROOT;
}

可以看出来，导出的 NODE_ENV 有导入（在 dev 或 pro 中），但根本没有使用，使用的是 process.env.NODE_ENV，环境变量。而 API_ROOT 是赋值给 baseURL 的，从 Axios 的文档来看，baseURL 的值是一个纯粹的 URL，而不是一个 URL 字符串的 JSON 表示（或字符串表示），所以内容中不含引号。

Axios 文档最开始就有示例：

axios.defaults.baseURL = 'https://api.example.com';

不知道是抄的人的问题，还是写的人的问题，这里应该是直接把 Webpack 的 DefinePlugin 的内容直接搬过来用了。而 DefinePlugin 要求的值是一个 JSON，所以需要在字符串内容中带引号，'"development"' 和 JSON.stringify("development") 的结果是一样的

---

JS 中单引号和双引号都是用来描述字符串的语法，二者等效。但这里注意一点：字符串的内容本身是不带引号的，引号只是一个语法标识，比如 "development"，用引号标识了字符串 development，这个字符串的内容是 development 而不是 "development"。或者简单的说，这个字符串是从 d 开始 t 结束的，而不是 " 开始 " 结束的。

那么问题来了：引号本身也是一个合法字符，如果要字符串的内容里包含引用怎么办？我们从解释器的角度去理解这个问题：如果直接写引号，比如我们希望字符串的内容是 string is "dev".，直接加引号（双引号）就会变成 "string is "dev"."，当解释器遇到第 2 个 " 的时候它会认为这是字符串结束符（字符串内容 string is ），造成后面的内容解析失败。为了让解释器知道里面的引号是内容而不是字符串结束符，需要进行转义，于是约定了使用 \ 作为转义符来进行转义，所以正确的描述是 "string is \"dev\"."。同理，如果我们想用单引号来表示字符串，而字符串内容中又恰好有单引号的时候，也需要转义：'string is \'dev\'.'。

接下是一个新问题：这样写的字符串不好看（不好识别）。如果字符串中有单引号，那就用双引号来描述字符串是不是就可以不需要转义了呢？确实可以，像这样："string is 'dev'."。解释器会认为 " 才是字符串结束符，所以遇到 ' 的时候就会正确识别为字符串内容。反之亦然（交换单/双引号的情况）。

然后又产生了一些新问题：如果字符串内容中即有单引号又有双引号怎么办？本来只能顾一头，也就是说，单/双引号总有一个需要转义。不过 ES6 里有了模板字符串（插值字符串）语法，使用 ` 来描述。所以可以这样 `this is 'a' and "b"` 。

但解决问题总会带来新问题：如果字符串内容中有 ` 怎么办？！没办法，真的只能转义了！