用JavaScript构建从两个绝对路径得到的相对路径

Question

给定两个绝对路径，例如：

/var/data/stuff/xyz.html
/var/data

如何创建一个以第二个路径为基础的相对路径？在上面的例子中，结果应该是: stuff/xyz.html

另一个例子：

/relative/sub/foo/sub/file
/relative/path
../../../path 

这类似于 这个问题，但我正在寻找最佳的JavaScript解决方案，而不是Java。

- Adam Jimenez

---

使用URI.js。 - zzzzBov

你所说的“最优”是什么意思？在代码大小、运行时间还是内存使用方面的最优？ - beatgammit

代码大小。无法想象内存使用或运行时间会对如此微不足道的事情产生重大影响。 - Adam Jimenez

Answer 1

如果您在使用node.js服务器上运行此代码，请参考以下链接：http://nodejs.org/api/path.html#path_path_relative_from_to 这是他们的实现代码：https://github.com/joyent/node/blob/master/lib/path.js#L233 如果您想在浏览器中使用此代码，无需进行任何更改即可正常工作。该代码已经经过了实战检验，已经处理了边缘情况。虽然它不是一行代码，但它可以完美地运行，我认为这更重要。如果您只需要支持POSIX版本，则该版本也不错。

- beatgammit

---

我正在运行客户端，但看起来可行。看看能否让它工作。 - Adam Jimenez

Answer 2

在处理URL时很容易犯错，因此我强烈建议使用库来处理所有细节。

URI.js使这变得简单：

URI('/var/data/stuff/xyz.html').relativeTo('/var/data');

- zzzzBov

---

看起来这样做可以工作，但是有没有比包含整个库更简洁的方法？ - Adam Jimenez

可能是这样，但你有多关注自己的表现呢？ - zzzzBov

@AdamJimenez，那不是一个答案。你应该先让你的网站正常工作，然后使用性能优化器进行测试，以确定在性能方面可以获得最大的收益。过早地进行优化只会阻碍你的进展。 - zzzzBov

URI.js 的 GitHub 页面现在建议使用 JS URL API: https://developer.mozilla.org/en-US/docs/Web/API/URL - s6mike

Answer 3

JS URL API现在应该在浏览器中处理此问题：https://developer.mozilla.org/en-US/docs/Web/API/URL/URL

new URL（url，base）

// Base urls
let m = 'https://developer.mozilla.org';
let a = new URL("/", m);                                // => 'https://developer.mozilla.org/'

- s6mike