Javascript 优化我的KnockOutJS函数-从丑陋的代码到干净,如何? 功能描述

Javascript 优化我的KnockOutJS函数-从丑陋的代码到干净,如何? 功能描述,javascript,arrays,knockout.js,Javascript,Arrays,Knockout.js,这个函数应该只是替换我的可观察数组中的一个项 我接受3个参数: findBy=是通过“id”还是“name”属性定位源索引 cmpVal=我们在数组中搜索的值 objneItem=新项。这种情况例如,{id:“12”,name:“NewName”} 然后我从数组中删除该索引,最后将新对象推送到数组中 我没有运气使用Knockout的replace函数,所以我不得不编写自己的函数 我意识到这可能是互联网上最丑陋的代码。这就是为什么我在这里尊重你们专业人士的原因。:) 注意:我现在不允许他们编辑ID

这个函数应该只是替换我的可观察数组中的一个项

我接受3个参数:

  • findBy=是通过“id”还是“name”属性定位源索引
  • cmpVal=我们在数组中搜索的值
  • objneItem=新项。这种情况例如,{id:“12”,name:“NewName”}
  • 然后我从数组中删除该索引,最后将新对象推送到数组中

    我没有运气使用Knockout的replace函数,所以我不得不编写自己的函数

    我意识到这可能是互联网上最丑陋的代码。这就是为什么我在这里尊重你们专业人士的原因。:)

    注意:我现在不允许他们编辑ID

    有人能帮我清理一下吗?我很聪明,知道它没有效率,但我不知道如何优化它

    如有任何建议,将不胜感激。谢谢大家!

    约翰

    好吧,那么

    首先,我们将创建一个包含所有逻辑的函数,从这个示例开始,您可以使用它做任何事情。最合适的方法是直接扩展你的“Observatearray”,但我现在不打算把这个扩展到这么远:P

    function ReplaceInObservableArray(obsArray, prop, cmpVal, newItem){
        // use the fact that you can get the value of the property by treating the object as the dictionary that it is
      // so you do not need to program for specific properties for different array model types
        var foundItems = obsArray().filter(function(i){ 
    
            return ko.utils.unwrapObservable(i[prop]) == cmpVal;
        });
    
        if(foundItems.length > 1) 
        {
          // handle what happens when the property you are comparing is not unique on your list. More than one items exists with this comparison run
          // you should throw or improve this sample further with this case implementation.
        } else if(foundItems.length == 0) 
        {
            // handle what happens when there is nothing found with what you are searching with.
        } else {
            // replace at the same index rather than pushing, so you dont move any other items on the array
            // use the frameworks built in method to make the replacement
            obsArray.replace(foundItems[0], newItem);
        }
    }
    
    var demoArray = ko.observableArray([{ id : 1, name : 'test1' },{id : 2, name : 'test2' },{ id : 3, name : 'test3'},{id : 4, name : 'test4'}]);
    ReplaceInObservableArray(demoArray,'id', 1, {id : 1, name : 'test111'});
    ReplaceInObservableArray(demoArray,'name', 'test3', {id : 3, name : 'test3333'});
    console.log(demoArray());
    
    好吧,那么

    首先,我们将创建一个包含所有逻辑的函数,从这个示例开始,您可以使用它做任何事情。最合适的方法是直接扩展你的“Observatearray”,但我现在不打算把这个扩展到这么远:P

    function ReplaceInObservableArray(obsArray, prop, cmpVal, newItem){
        // use the fact that you can get the value of the property by treating the object as the dictionary that it is
      // so you do not need to program for specific properties for different array model types
        var foundItems = obsArray().filter(function(i){ 
    
            return ko.utils.unwrapObservable(i[prop]) == cmpVal;
        });
    
        if(foundItems.length > 1) 
        {
          // handle what happens when the property you are comparing is not unique on your list. More than one items exists with this comparison run
          // you should throw or improve this sample further with this case implementation.
        } else if(foundItems.length == 0) 
        {
            // handle what happens when there is nothing found with what you are searching with.
        } else {
            // replace at the same index rather than pushing, so you dont move any other items on the array
            // use the frameworks built in method to make the replacement
            obsArray.replace(foundItems[0], newItem);
        }
    }
    
    var demoArray = ko.observableArray([{ id : 1, name : 'test1' },{id : 2, name : 'test2' },{ id : 3, name : 'test3'},{id : 4, name : 'test4'}]);
    ReplaceInObservableArray(demoArray,'id', 1, {id : 1, name : 'test111'});
    ReplaceInObservableArray(demoArray,'name', 'test3', {id : 3, name : 'test3333'});
    console.log(demoArray());
    

    哇,非常感谢,@MKougiouris!!我可以看出这真的使它更通用。A++答案。哇,非常感谢,@MKougiouris!!我可以看出这真的使它更通用。A++答案。