我应该在哪里以及如何在Angular应用程序中扩展String原型?

时间:2019-01-21 16:35:04

标签: javascript angular

我想扩展String原型,并在Angular 5应用程序的一个或多个组件中使用它。主要原因是我有一系列对象,这些对象的属性有时会填充,有时不会填充。示例:customer.address有时是string(地址的_id),有时是填充的,并且是具有Address属性的_id对象。 / p>

我基本上不需要担心是否填充了customer.address,只需访问_id。我知道根据其他一些回复here,它被认为是Javascript反模式,但是我想做这样的事情:

String.prototype._id = function () {
    return String.prototype.valueOf()
}

不管这个想法有多糟糕(已经在其他问题中得到解答),这将是一种实现方式,我应该在哪里声明呢?有解决这个问题的更好方法吗?

谢谢。

PS。我知道我也可以在我的toString类中覆盖Address方法,并得到类似的结果,调用customer.address.toString()以获取_id,但是我觉得它不清晰并且我想先探索其他选项。

2 个答案:

答案 0 :(得分:0)

根据this和我的经验,如果您的申请是AngularJS,我建议您这样说:

yourApp.run(function() { 
   String.prototype._id = function () {
     return String.prototype.valueOf()
   } 
}); 

对于Angular 2+,您可以选中this并选中this stackoverflow post,该内容告诉您如何扩展Typescript上的String属性。

答案 1 :(得分:0)

您可能想考虑使用Proxy来包装对象,并提供一种手段来捕获缺失的值等等。

下面的示例显示了如何在无需扩展任何内置类型的情况下实现所需的功能。

let customer1 = {
  address: 'some string'
}

let customer2 = {
  address: {
    _id: '12345'
  }
}


let proxyCustomer = customer => new Proxy(customer, {
  get: (target, name) => {
    // define the properties to catch and their functions
    let propHandlers = {
      address: () => {
        a = target.address
        // decide what you want to do
        // in this example a string value is returned as a dummy object with an _id.
        return typeof a === 'string' || a instanceof String ?
          {_id: a} : a
      }
    }

    // default action - return prop
    let def = () => target[name]

    // assign function to handleProp if it exists or use the default (return named prop)
    let handleProp = propHandlers[name] || def

    // return result of handle call
    return handleProp();
  }
})

// wrap customer objects in proxy
customer1 = proxyCustomer(customer1)
customer2 = proxyCustomer(customer2)

// test
console.log(customer1.address._id)
console.log(customer2.address._id)