Angular / Typescript? / Javascript? - что означает ".default"?

Question

Может ли кто-нибудь объяснить, что означает ".default" в следующем коде

Я хочу использовать такой код в нашем проекте, но я не уверен в рассматриваемом фрагменте кода.

(Я изменил свой вопрос, чтобы показать оригинальный код.)

В статье angular -http-mock-interceptor-for-mocked-backend-1h5g в dev.io можно прочитать код, например: это:

import { Injectable, Injector } from '@angular/core';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import * as users from './users.json';

const urls = [
    {
        url: 'https://an-example.url.org/users',
        json: users
    }
];

@Injectable()
export class HttpMockRequestInterceptor implements HttpInterceptor {
    constructor(private injector: Injector) {}

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        for (const element of urls) {
            if (request.url === element.url) {
                return of(new HttpResponse({ status: 200, body: ((element.json) as any).default })); // <---- THIS ".default"
            }
        }
    //...
    }
}

с пользователями. json

[
 {
   "name": "Abe",
   "id": 1
 },
 {
   "name": "Boe",
   "id": 22
 }
]

Я пытался гуглить, но безуспешно. Я не уверен, достаточно ли попробовать код без «.default», может быть, я что-то упустил. Вот почему я был бы признателен, чтобы получить некоторые знания о значении. Заранее спасибо.

Answer 1

Причина по умолчанию в том, что здесь импортируется звезда

import * as users from './users.json';

Вы можете сделать этот импорт

import users from './users.json';

Вы заметите, что изменение импорта нарушает код, поэтому вам нужно удалить это значение по умолчанию. и измените эту строку на

return of(new HttpResponse({ status: 200, body: element.json }));

Последняя причина, по которой вам пришлось ее разыграть, заключается в том, что json .element не имеет это свойство по умолчанию.

Предыдущее изображение - это просто console.log константных URL.

URL-адрес стекаблита. https://stackblitz.com/edit/angular-mock-http-interceptor?file=src%2Fapp%2Finterceptor.mock.ts

I am confused about the order. It is first "cast" to any, and then the default-property is accessed. I don't understand why

Более естественный способ, о котором вы можете подумать - назначить тип URL любому и он работает.

const urls:any = [
    {
        url: 'https://jsonplaceholder.typicode.com/users',
        json: users
    }
];

@Injectable()
export class HttpMockRequestInterceptor implements HttpInterceptor {
    constructor(private injector: Injector) {}

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        for (const element of urls) {
            if (request.url === element.url) {
                console.log('Loaded from json : ' + request.url);
                return of(new HttpResponse({ status: 200, body: element.json.default }));
            }
        }
        console.log('Loaded from http call :' + request.url);
        return next.handle(request);
    }
}