什么原因不更改js原型?

时间:2019-02-13 21:32:59

标签: javascript prototype primitive

我经常使用某些算法,因此我正在考虑将其添加到应用程序的原型中。例如,数组中的最后一个值。与每次我想要数组中的最后一个值时写import { NgModule } from '@angular/core'; import { ServerModule, ServerTransferStateModule } from '@angular/platform-server'; import { ModuleMapLoaderModule } from '@nguniversal/module-map-ngfactory-loader'; import { AppModule } from './app.module'; import { AppComponent } from './app.component'; import { ɵangular_packages_platform_server_platform_server_c as ServerStylesHost } from '@angular/platform-server'; export class NoRenderServerStylesHost extends ServerStylesHost { onStylesAdded(additions: Set<string>): void { // super.onStylesAdded(additions); // additions.forEach((s) => console.log(s)); // ignore styles added } } @NgModule({ imports: [ // The AppServerModule should import your AppModule followed // by the ServerModule from @angular/platform-server. AppModule, ServerModule, ModuleMapLoaderModule, ServerTransferStateModule, ], // Since the bootstrapped component is not inherited from your // imported AppModule, it needs to be repeated here. bootstrap: [AppComponent], providers: [{ provide: ServerStylesHost, useClass: NoRenderServerStylesHost }] }) export class AppServerModule { } 相比,array.last()非常方便。

我会在我的应用首次加载时执行此操作。

arr[arr.length -1]

有功能上的原因不这样做吗?

1 个答案:

答案 0 :(得分:0)

是的,没有理由不这样做,一个立即跳出来的原因是,您将不可避免地与另一个认为更容易调整内置原型的库冲突。

请考虑以下内容:

// my-cool-library.js

// Returns the last value in an array
Array.prototype.last = function() {
    return this[this.length - 1];
}

// some-other-cool-library.js

// Returns the last possible index of the array
Array.prototype.last = function() {
    return this.length - 1;
}

// some-consumer.js

import "my-cool-library.js";
import "some-other-cool-library.js";

const a = ["a", "b", "c"];

// You would probably expect it to print "c", but it prints 2
console.log(a.last());

您可能会认为这不太可能,但是如果您使用非常大的框架怎么办?假设您同时使用Angular和lodash。像Angular这样的大型框架要通过在某些Object原型中添加一些辅助函数来使生活更轻松的可能性不大。但是,lodash是范围很广的库,它还为您可能希望对集合执行的每个操作添加了辅助函数。

这两个库很可能都希望使用相同的简洁辅助函数名称,但可能不具有相同的函数签名。突然,如何调用和使用Array.prototype.last变得不明显了。

相反,当您利用依赖项注入和编写函数来获取执行计算所需的所有参数并且不污染原型时,将更为赞赏。这样,您就可以准确确定使用哪个last函数以及何时使用。

您还可以潜在地利用tree shaking的优势。

考虑无污染的示例:

// my-cool-library.js

// Returns the last value in an array
export function last(arr) {
    return arr[arr.length - 1];
}

// some-other-cool-library.js

// Returns the last possible index of the array
export function last(arr) {
    return arr.length - 1;
}

// some-consumer.js

import {last as myLast} from "my-cool-library.js";
import {last} from "some-other-cool-library.js";

const a = ["a", "b", "c"];

// You know that you're going to use myLast 
// and how it is going to act
console.log(myLast(a));