为什么用Java引号引起来的加号？

Question

我偶然发现了一些我无法完全理解的东西。假设有一个产品对象：

let product = {
  img: "../image.jpg"
}

现在，如果要访问URL中的product.img，可以执行以下操作：

const getProductImage = product => ({
  backgroundImage: 'url(' + product.img +')'
});

我的问题是：这是怎么回事？：

' + product.img + '

编辑：好的，这个问题是从错误的前提开始的，请参见下面的答案。

Answer 1

有两组引号：

'url('

和

')'

不是

' + product.img + '

Answer 2

您的代码只是将字符串加在一起，所以结果是串联的新字符串：

'url(' + product.img +')'. 

例如，如果product.img包含图片的网址，例如：'http:example.com/image1.png'，则backgroundimage最终将包含：

'url(http:example.com/image1.png)';

Answer 3

因为这是将字符串从变量连接为单个字符串的方式。 可以将其重写如下：

let first = 'url('
let last = ')'
let final_string = first + product.img + last

或使用模板文字（在可能的情况下更好）

`url(${product.img})`