（AngularJS）全局替换数组中值的最有效方法

Question

我想替换数组中的所有值，这是代码：

var jsonImg = [
{"url":"https://example.amazonaws.com/images-lib/1496846856-Retina 01.jpg"},
{"url":"https://example.amazonaws.com/images-lib/1496846856-Retina 02.jpg"},
{"url":"https://example.amazonaws.com/images-lib/1496846856-Retina 03.jpg"}
];

var imgUrl = JSON.stringify(jsonImg);
var oldString = imgUrl;
var newString = oldString.replace(/https:\/\/example.amazonaws.com\/images-lib\//g,"cordova.url/");

$scope.Images = JSON.parse(newString);

但是我认为JSON.Stringfly和JSON.Parse在这里有点多余，您认为这是替换所有值JSON.Stringfly和JSON.Parse的最有效方法吗？ 还有其他替代方法吗？ 请在这里检查小提琴： https : //jsfiddle.net/dedenbangkit/zu7utr6a/3/

Answer 1

你是对的。 无需转换为字符串再返回。 虽然涉及数组中的少量值，但就效率而言并没有多大关系。 但是，当您可以为数组本身提供如此强大的功能时，为什么还要转换为字符串并返回。

就像是：

$scope.Images = jsonImg.map(function(obj) {
  obj.url = "cordova.url" + obj.url.substr(obj.url.lastIndexOf("/"))
  return obj;
});

更新的小提琴

Answer 2

以我的理解，在所有图像URL中重复CDN路径是多余的。 您应该创建另一个保存该路径的变量，并且在需要使用它时，只需连接两个字符串即可。 这样，您可以轻松更改CDN路径，而无需进行处理。

样品

出于演示目的，我使用了Math.random ，但是您可以设置条件。

 function ImgCtrl($scope) { var s3 = "https://s3-ap-southeast-1.amazonaws.com/publixx-statics/images-lib/"; var cordava = "cordova.url/"; var urls = [{ "url": "1496846856-Retina 01.jpg" }, { "url": "1496846856-Retina 02.jpg" }, { "url": "1496846856-Retina 03.jpg" }] $scope.path = Math.floor(Math.random() * 100) % 2 === 0 ? s3 : cordava; $scope.Images = urls; console.log($scope.Images[0].url) } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> <div ng-app> <div ng-controller="ImgCtrl"> <ul> <li ng-repeat="Image in Images"> {{path}}{{Image.url}} </li> </ul> </div> </div> 

---

根据我们的讨论，您可以有2个选择：

• 当您的标志更加动态并且将非常频繁地更改时，示例1更有用。
• 如果您的标志在1个周期内只有1个值，则样本2更有用。 类似于A / B测试。 由于它将始终保持一个周期不变，因此再次进行计算是没有意义的。 只需保存处理后的值即可。 这还将URL封装在范围内，并且将无法在外部使用，因此增加了安全性。

// Sample 1
var flag = Math.floor(Math.random() * 100) % 2 === 0;

function getImagePath(image) {
  var s3 = "https://s3-ap-southeast-1.amazonaws.com/publixx-statics/images-lib/";
  var cordava = "cordova.url/";
  return (flag ? s3 : cordava) + image;
}

// Usage:

var url = getImagePath(imageUrl)

// Sample 2
var path = (function() {
  var s3 = "https://s3-ap-southeast-1.amazonaws.com/publixx-statics/images-lib/";
  var cordava = "cordova.url/";
  return flag ? s3 : cordava;
})()

var url = path + imageUrl;

Answer 3

var jsonImg = [
  { 'url': 'https://example.amazonaws.com/images-lib/1496846856-Retina 01.jpg' },
  { 'url': 'https://example.amazonaws.com/images-lib/1496846856-Retina 02.jpg' },
  { 'url': 'https://example.amazonaws.com/images-lib/1496846856-Retina 03.jpg' },
];

jsonImg.map(function(image) {
  var split = image.url.split('/');
  var fileName = split[split.length - 1];
  image.url = 'cordova.url/' + fileName;
});

这将使您的jsonImg数组中的所有字符串发生突变，将https://example.amazonaws.com/images-lib/ URL替换为cordova.url/ 。