JavaScript - 在对象数组中运行 forEach.想要检查字符串中的子字符串并将其替换为新的子字符串
JavaScript - Running a forEach in array of objects. Would like to check a substring in a string and replace it with a new substring
在JavaScript中,我在对象数组上运行forEch方法。想运行我的 JSON 并在满足条件时用新字符串替换字符串中的子字符串。
问题是这样的:http://www.bucketfeet.comhttps://d153fwbf2sefnf.cloudfront.net/media/artist/d/a/daniel_falsetta_headshot.jpg 和未定义。
下面是包含 JSON 数据的代码。提前感谢您的帮助。这也是 repl 链接 - https://repl.it/BQsZ/19 以便您可以运行代码。
var dataJson = [{
"created_at": "2015-03-27 11:08:00+00:00",
"city": "Pueblo",
"first_name": "daniel",
"last_name": "Falsetta",
"country": "US",
"artist_id": 6709,
"email": "8XC87gZdjX92@example.com",
"profile_image_url": "https://d153fwbf2sefnf.cloudfront.net/media/artist/d/a/daniel_falsetta_headshot.jpg"
},{
"created_at": "2015-03-27 11:08:00+00:00",
"city": "Dallas",
"first_name": "Suah",
"last_name": "Yu",
"country": "US",
"artist_id": 6708,
"email": "BATJP3mht4vd@example.com",
"profile_image_url": ""
},{
"created_at": "2015-03-27 11:08:00+00:00",
"city": "Ottawa ",
"first_name": "Makena",
"last_name": "Ablett",
"country": "CA",
"artist_id": 6710,
"email": "RTFheqUbixmy@example.com",
"profile_image_url": "/media/artist/image-4414.jpg"
},{
"created_at": "2015-03-27 10:53:40+00:00",
"city": "Pittsburgh",
"first_name": "Michelle",
"last_name": "Vecchio",
"country": "US",
"artist_id": 7388,
"email": "kpEFwMqV0Zip@example.com",
"profile_image_url": "http://d153fwbf2sefnf.cloudfront.net/media/artist/i/m/image_473.jpg"
}, {
"created_at": "2015-03-26 18:13:45+00:00",
"city": "",
"first_name": "Wendy",
"last_name": "Slavas",
"country": "",
"artist_id": 28,
"email": "aHrDLA3W5a6p@example.com",
"profile_image_url": ""
}
];
var profUrlFunc = function() {
var objTableArray = dataJson;
objTableArray.forEach(function(user) {
var httpsLinkCloudFront = "https://d153fwbf2sefnf.cloudfront.net"; //length: 37
var httpLinkCloudFront = "http://d153fwbf2sefnf.cloudfront.net"; //length: 36
var prefixLink = "http://www.bucketfeet.com";
var placeHolderForLink = user.profile_image_url;
if(user.profile_image_url) {
//if user profile image has HTTP /cloudfront prefix link remove it and add http://www.bucketfeet.com OR don't add anything
user.profile_image_url = placeHolderForLink.replace("http://d153fwbf2sefnf.cloudfront.net", "www.bucketfeet.com")
}
if (user.profile_image_url) {
//if user profile image has HTTPS /cloudfront prefix link remove it and add http://www.bucketfeet.com OR don't add anything
user.profile_image_url = placeHolderForLink.replace("https://d153fwbf2sefnf.cloudfront.net", "www.bucketfeet.com")
}
if (user.profile_image_url) {
//if no prefix(broken link:/media/artist/image-4414.jpg) add http://www.bucketfeet.com
var newModifiedLinkUrl = prefixLink.concat(placeHolderForLink)
user.profile_image_url = newModifiedLinkUrl;
console.log(user.profile_image_url);
}
else {
//if it is empty give it a default image
user.profile_image_url = "http://www.google.com/favicon.ico";
}
});
};
console.log(profUrlFunc());
试试这个
var profUrlFunc = function() {
var objTableArray = dataJson;
objTableArray.forEach(function(user) {
var httpsLinkCloudFront = "https://d153fwbf2sefnf.cloudfront.net";
var httpLinkCloudFront = "http://d153fwbf2sefnf.cloudfront.net";
var prefixLink = "http://www.bucketfeet.com";
var placeHolderForLink = user.profile_image_url;
var condition = new RegExp([httpsLinkCloudFront, httpLinkCloudFront].join('|'));
if (user.profile_image_url) {
if (!condition.test(user.profile_image_url)) {
user.profile_image_url = prefixLink + user.profile_image_url;
} else {
user.profile_image_url = user.profile_image_url.replace(condition, prefixLink);
}
} else {
user.profile_image_url = "http://www.google.com/favicon.ico";
}
});
return objTableArray;
};
Example
你可以稍微简化一下你的函数:
首先,除了协议部分外,云前端的 URL 相同,replace
函数可用正则表达式作为第一个参数。
/https?:'/'/d153fwbf2sefnf.cloudfront.net/
这个正则表达式说s
部分https
是可选的,所以这个正则表达式将 URL 与 HTTP 和 https 匹配。
其次,您应该在添加之前检查placeHolderForLink
是否尚未从prefixLink
开始。
所以你可以得到这样的东西:
var profUrlFunc = function () {
var objTableArray = dataJson;
objTableArray.forEach(function (user) {
var LinkCloudFront = /https?:'/'/d153fwbf2sefnf.cloudfront.net/;
var prefixLink = "http://www.bucketfeet.com";
var placeHolderForLink = user.profile_image_url;
if (placeHolderForLink) {
placeHolderForLink = placeHolderForLink.replace(LinkCloudFront, prefixLink);
if (!placeHolderForLink.startsWith(prefixLink)) {
placeHolderForLink = prefixLink.concat(placeHolderForLink);
}
} else {
//if it is empty give it a default image
placeHolderForLink = "http://www.google.com/favicon.ico";
}
user.profile_image_url = placeHolderForLink;
});
};
var dataJson = [{
"created_at": "2015-03-27 11:08:00+00:00",
"city": "Pueblo",
"first_name": "daniel",
"last_name": "Falsetta",
"country": "US",
"artist_id": 6709,
"email": "8XC87gZdjX92@example.com",
"profile_image_url": "https://d153fwbf2sefnf.cloudfront.net/media/artist/d/a/daniel_falsetta_headshot.jpg"
}, {
"created_at": "2015-03-27 11:08:00+00:00",
"city": "Dallas",
"first_name": "Suah",
"last_name": "Yu",
"country": "US",
"artist_id": 6708,
"email": "BATJP3mht4vd@example.com",
"profile_image_url": ""
}, {
"created_at": "2015-03-27 11:08:00+00:00",
"city": "Ottawa ",
"first_name": "Makena",
"last_name": "Ablett",
"country": "CA",
"artist_id": 6710,
"email": "RTFheqUbixmy@example.com",
"profile_image_url": "/media/artist/image-4414.jpg"
}, {
"created_at": "2015-03-27 10:53:40+00:00",
"city": "Pittsburgh",
"first_name": "Michelle",
"last_name": "Vecchio",
"country": "US",
"artist_id": 7388,
"email": "kpEFwMqV0Zip@example.com",
"profile_image_url": "http://d153fwbf2sefnf.cloudfront.net/media/artist/i/m/image_473.jpg"
}, {
"created_at": "2015-03-26 18:13:45+00:00",
"city": "",
"first_name": "Wendy",
"last_name": "Slavas",
"country": "",
"artist_id": 28,
"email": "aHrDLA3W5a6p@example.com",
"profile_image_url": ""
}];
var profUrlFunc = function () {
var objTableArray = dataJson;
objTableArray.forEach(function (user) {
var LinkCloudFront = /https?:'/'/d153fwbf2sefnf.cloudfront.net/;
var prefixLink = "http://www.bucketfeet.com";
var placeHolderForLink = user.profile_image_url;
if (placeHolderForLink) {
placeHolderForLink = placeHolderForLink.replace(LinkCloudFront, prefixLink);
if (!placeHolderForLink.startsWith(prefixLink)) {
placeHolderForLink = prefixLink.concat(placeHolderForLink);
}
} else {
//if it is empty give it a default image
placeHolderForLink = "http://www.google.com/favicon.ico";
}
user.profile_image_url = placeHolderForLink;
});
};
profUrlFunc();
document.getElementById('r').innerHTML = JSON.stringify(dataJson.map(function (el) {
return el.profile_image_url
}), null, 2);
<pre id="r"></pre>
in forEach
if(placeHolderForLink && placeHolderForLink.length) {
user.profile_image_url = (!placeHolderForLink.indexof(httpsLinkCloudFront)) ?
prefixLink+placeHolderForLink.substr(placeHolderForLink.indexOf(httpsLinkCloudFront)+37)
:(!placeHolderForLink.indexof(httpLinkCloudFront)) ?
prefixLink+placeHolderForLink.substr(placeHolderForLink.indexOf(httpLinkCloudFront)+36)
:
prefixLink+placeHolderForLink
}
或者,可读且可维护:
if (placeHolderForLink && placeHolderForLink.length) {
if (!placeHolderForLink.indexof(httpsLinkCloudFront)) {
var1 = prefixLink+placeHolderForLink.substr(placeHolderForLink.indexOf(httpsLinkCloudFront)+37)
} elsif (!placeHolderForLink.indexof(httpLinkCloudFront)) {
var1 = prefixLink+placeHolderForLink.substr(placeHolderForLink.indexOf(httpLinkCloudFront)+36)
} else {
var1 = prefixLink+placeHolderForLink
}
user.profile_image_url = var1
}
相关文章:
- 如何将字符串拆分为字符,但在javascript中保留空格
- 如何显示字符串中最多 200 个字符
- 我想在Javascript中探索类似C语言的字符串的整个字符
- 如何用jquery替换字符串中可能变化的字符
- 通过跳过拆分字符在 javascript 中拆分字符串
- 使用正则表达式匹配长度为六个字符的字母数字字符串
- 字符串替换-不支持格式字符'}'
- 到UpperCase字符串Javascript中的特定字符索引
- 用类javascript包装span标记中字符串中的字符索引
- 将字符串分组为n个字符的块,并应用替换
- 如何检查一个字符串的所有字符是否都存在于另一个字符串中
- 如何从键Code;中获取字符串/字符值;
- 检查值是否包含字符串字符
- JavaScript字符串字符操作
- 如果数组中的字符串不匹配,请从字符串中删除字符串字符
- Javascript Lingo游戏-字符串字符等于另一个字符串字符
- jQuery替换字符串字符的方法
- Javascript字符串字符检查
- Javascript替换字符串字符
- Javascript的变化与重复(组合)缺失的字符串字符