回答編集履歴

2

new URL

2020/09/24 01:01

投稿

think49
think49

スコア18194

test CHANGED
@@ -10,7 +10,7 @@
10
10
 
11
11
 
12
12
 
13
- ### ルートディレクトリ
13
+ ### URL#hostname
14
14
 
15
15
 
16
16
 
@@ -31,6 +31,10 @@
31
31
 
32
32
 
33
33
  hostnameの値に応じて、消費するディレクトリ数を可変して下さい。
34
+
35
+
36
+
37
+ - [URL.hostname - Web API | MDN](https://developer.mozilla.org/ja/docs/Web/API/URL/hostname)
34
38
 
35
39
 
36
40
 
@@ -60,4 +64,60 @@
60
64
 
61
65
 
62
66
 
67
+ ### new URL()
68
+
69
+
70
+
71
+ 前章では、hostname(絶対パス)を得る形式でしたが、URLのインスタンスを持つ形式にしておくと、今後、URL関連の操作が必要になった際に拡張が楽になります。
72
+
73
+
74
+
75
+ ```JavaScript
76
+
77
+ 'use strict';
78
+
79
+ function toColorUrl (urlString) {
80
+
81
+ const url = new URL(urlString);
82
+
83
+ const map = new Map([['test.jp', 1],['kokyaku.net',0]]);
84
+
85
+
86
+
87
+ url.pathname = url.pathname.replace(new RegExp('^(/(?:[^/]*/){' + map.get(url.hostname) + '})'), '$1color/');
88
+
89
+ return url;
90
+
91
+ }
92
+
93
+
94
+
95
+ const srcList = ['https://test.jp/test/foo/index.html', 'https://test.jp/test2/bar/index.html', 'https://kokyaku.net/piyo/index.html'];
96
+
97
+ const colorList = ['https://test.jp/test/color/foo/index.html', 'https://test.jp/test2/color/bar/index.html', 'https://kokyaku.net/color/piyo/index.html'];
98
+
99
+ const resultList = [];
100
+
101
+
102
+
103
+ for (let src of srcList) {
104
+
105
+ resultList.push(toColorUrl(src));
106
+
107
+ }
108
+
109
+
110
+
111
+ console.log(JSON.stringify(colorList)); // ["https://test.jp/test/color/foo/index.html","https://test.jp/test2/color/bar/index.html","https://kokyaku.net/color/piyo/index.html"]
112
+
113
+ console.log(JSON.stringify(resultList)); // ["https://test.jp/test/color/foo/index.html","https://test.jp/test2/color/bar/index.html","https://kokyaku.net/color/piyo/index.html"]
114
+
115
+ console.assert(JSON.stringify(colorList) === JSON.stringify(resultList));
116
+
117
+ ```
118
+
119
+
120
+
121
+
122
+
63
123
  Re: meli さん

1

ルートディレクトリ

2020/09/24 01:01

投稿

think49
think49

スコア18194

test CHANGED
@@ -1,3 +1,7 @@
1
+ ### 前質問
2
+
3
+
4
+
1
5
  前質問の回答をそのまま使えると思いますが、pathnameを覚えていますか。
2
6
 
3
7
 
@@ -6,4 +10,54 @@
6
10
 
7
11
 
8
12
 
13
+ ### ルートディレクトリ
14
+
15
+
16
+
17
+ 前提条件を下記として、
18
+
19
+
20
+
21
+ |環境|URL|ルートディレクトリ|
22
+
23
+ |:--|:--|:--|
24
+
25
+ |開発環境1|https://test.jp/test/|/test/|
26
+
27
+ |開発環境2|https://test.jp/test2/|/test2/|
28
+
29
+ |客用環境|https://kokyaku.net/|/|
30
+
31
+
32
+
33
+ hostnameの値に応じて、消費するディレクトリ数を可変して下さい。
34
+
35
+
36
+
37
+ ```JavaScript
38
+
39
+ function toColorPathname (urlString) {
40
+
41
+ const url = new URL(urlString);
42
+
43
+ const map = new Map([['test.jp', 1],['kokyaku.net',0]]);
44
+
45
+
46
+
47
+ return url.pathname.replace(new RegExp('^(/(?:[^/]*/){' + map.get(url.hostname) + '})'), '$1color/');
48
+
49
+ }
50
+
51
+
52
+
53
+ console.log(toColorPathname('https://test.jp/test/foo/index.html')); // "/test/color/foo/index.html"
54
+
55
+ console.log(toColorPathname('https://test.jp/test2/bar/index.html')); // "/test2/color/bar/index.html"
56
+
57
+ console.log(toColorPathname('https://kokyaku.net/piyo/index.html')); // "/color/piyo/index.html"
58
+
59
+ ```
60
+
61
+
62
+
9
63
  Re: meli さん