Изучение восклицательного знака Angular перед переменной: методы и примеры кода

В Angular вы могли встретить восклицательный знак перед переменной. Этот синтаксис известен как «оператор ненулевого утверждения». Он сообщает компилятору TypeScript, что переменная гарантированно будет иметь ненулевое значение, даже если компилятор обычно считает ее потенциально нулевой или неопределенной. В этой статье мы рассмотрим различные методы и приведем примеры кода, иллюстрирующие использование восклицательного знака в Angular.

Метод 1: инициализация переменной ненулевым значением
Одним из распространенных случаев использования восклицательного знака является инициализация переменной ненулевым значением. Вот пример:

let name!: string;
name = 'John Doe';
console.log(name.length); // The exclamation mark assures TypeScript the 'name' variable is non-null

Метод 2: утверждение ненулевого значения в параметрах функции
Вы также можете использовать непустой оператор утверждения в параметрах функции. Этот метод гарантирует, что функция вызывается с ненулевыми аргументами. Рассмотрим следующий фрагмент кода:

function greetUser(name: string) {
  console.log(`Hello, ${name}!`);
}
greetUser('Alice'); // Valid call
greetUser(null!);  // The exclamation mark asserts that 'null' is a non-null value

Метод 3: доступ к свойствам и методам объектов, возможно, имеющих значение NULL.
Оператор утверждения, не являющийся нулевым значением, также удобен при доступе к свойствам или методам объекта, который может иметь значение NULL или неопределенное значение. Вот пример:

const user: User | null = getUser();
console.log(user!.name); // The exclamation mark assures TypeScript the 'user' object is non-null

Метод 4: подтверждение ненулевого значения в шаблоне Angular
В шаблонах Angular вы можете использовать восклицательный знак, чтобы подтвердить, что свойство не является нулевым, прежде чем использовать его. Например:

<div *ngIf="user!">
  <p>Welcome, {{ user!.name }}!</p>
</div>

Восклицательный знак перед переменной в Angular служит ненулевым оператором утверждения. Это позволяет разработчикам указывать, что переменная гарантированно имеет ненулевое значение, минуя проверки компилятора. Мы рассмотрели несколько методов использования восклицательного знака, включая инициализацию переменных, параметров функции, доступ к свойствам объекта и его использование в шаблонах Angular. Понимание правильного использования этого оператора может помочь улучшить читаемость и удобство обслуживания кода.