Руслан Куянец | Reactify

(function () {
    function modifyItemData(price, platform) {
        price.rub = 5000;
        platform = 'iOS';
        isModified = true;

        function printItemData() {
             console.log(price); // ?
             console.log(platform); // ?
             console.log(isModified); // ?
        }

        return printItemData;
    }

    let price = { rub: 3500 };
    let platform = 'Android';
    let isModified = false;

    const printItemData = modifyItemData(price, platform, isModified);

    console.log(price); // ?
    console.log(platform); // ?
    console.log(isModified); // ?

    price = { usd: 100 };
    platform = 'Web';
    isModified = null;

    printItemData();
})();

1. Почему price изменяется, а platform — нет?
2. Как работает область видимости переменной `isModified`?

// baseApi.js
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';

const baseApi = createApi({
  reducerPath: 'baseApi',
  baseQuery: fetchBaseQuery({ baseUrl: '/api' }),
  tagTypes: ['User', 'Post'], // Определяем типы тегов для инвалидации кэша
});

export default baseApi;

// userApi.js
import baseApi from './baseApi';

// injectEndpoints автоматически добавит эндпоинты к baseApi
const userApi = baseApi.injectEndpoints({
  endpoints: (builder) => ({
    fetchUsers: builder.query({
      query: () => 'users',
      providesTags: ['User'], // Указываем, что этот запрос использует тег 'User'
    }),
    addUser: builder.mutation({
      query: (newUser) => ({
        url: 'users',
        method: 'POST',
        body: newUser,
      }),
      invalidatesTags: ['User'], // Инвалидируем кэш для 'User'
    }),
  }),
  overrideExisting: false, // Не переопределяем существующие эндпоинты
});

export const { useFetchUsersQuery, useAddUserMutation } = userApi;
export default userApi;

// postApi.js
import baseApi from './baseApi';

// injectEndpoints автоматически добавит эндпоинты к baseApi
const postApi = baseApi.injectEndpoints({
  endpoints: (builder) => ({
    fetchPosts: builder.query({
      query: () => 'posts',
      providesTags: ['Post'], // Указываем, что этот запрос использует тег 'Post'
    }),
    addPost: builder.mutation({
      query: (newPost) => ({
        url: 'posts',
        method: 'POST',
        body: newPost,
      }),
      invalidatesTags: ['Post'], // Инвалидируем кэш для 'Post'
    }),
  }),
  overrideExisting: false, // Не переопределяем существующие эндпоинты
});

export const { useFetchPostsQuery, useAddPostMutation } = postApi;
export default postApi;

type UseArrayActions = {
  push: (item) => void,
  removeByIndex: (index) => void
}

export function useArray(initialValue): { value } & UseArrayActions {
  const [value, setValue] = useState(initialValue);

  const push = (item) => setValue();
  const removeByIndex = (index) => setValue();

  return { value, push, removeByIndex };
}

console.assert( findUniq(['a', 'a Aa', 'ab a', 'AA a']) === 'ab a' );
console.assert( findUniq(['ab', 'a Aa', 'ab a', 'bAA a']) === 'a Aa' );
console.assert( findUniq([1,2,1,1]) === 2 );
console.assert( findUniq(['aBca', 'ac b', 'bac', 'fO o', 'bca', 'cabaccBA', ' Ccba']) === 'fO o' );

function findUniq(strings) {
  ???
}

const Andrey = {
  name: 'Андрей',
  surname: 'Малахов',
  city: {
    name: 'Москва'
  },
}

const Genadius = {
  name: 'Генадий',
  surname: 'Малахов',
  city: Andrey.city,
}

Genadius.city.name = 'Санкт-Петербург'

const checkIntervalMs = 2000;
const toleranceMs = 2000;
let lastCheckStamp: number = null;

setInterval(
    () => {
        const now = Date.now();
        if (lastCheckStamp && now - lastCheckStamp > checkIntervalMs + toleranceMs){ 
            //something code
        }
        lastCheckStamp = now;
    },
    checkIntervalMs
);

А вы часто ходите на митапы?
Какие запомнились больше всего?
Какие города и локации советуете?

Проблема: пока HR дойдёт до вашего резюме (особенно если вы «середнячок»), вакансия может уже закрыться.

Отсюда эффект рандома – иногда на скрининг попадает не самый подходящий, а просто тот, кого алгоритм поставил выше.

Вывод: в текущих условиях пассивный поиск почти не работает. Нужна агрессивная стратегия – оптимизация резюме под алгоритмы, быстрые отклики и прямое взаимодействие с рекрутерами.

import React from 'react';

const elements = Array(16).fill(0);

export default function App() {
  const [randomIndex, setRandomIndex] = React.useState(0);
  const [isStart, setStart] = React.useState(false);

  // Ваш код здесь

  return (
    <div className="App">
      <h1>⭐ Crush the mole ⭐</h1>
      <button onClick={() => { /* Ваш код здесь */ }}>
        {isStart ? "Остановить" : "Начать игру"}
      </button>
      <div className="container">
        {elements.map((elem, index) => (
          <div
            key={index}
            className="item"
            onClick={() => { /* Ваш код здесь */ }}
          >
            {index === randomIndex ? "@" : ""}
          </div>
        ))}
      </div>
    </div>
  );
}

console.log('1')
Promise.resolve('2')
    .then((res) => {
      console.log(res);
      
      Promise.resolve('3')
        .then((res) => {
          console.log(res);
          setTimeout(() => {console.log('4')}, 0);
        })    
    })
    .then((res) => console.log(res))
    .finally((res) => {
      console.log(res);
      setTimeout(() => {console.log('5')}, 0);
    });
console.log('6');

console.log('1')
Promise.reject('2')
    .then((res) => {
      console.log(res);
      
      Promise.resolve('3')
        .then((res) => {
          console.log(res);
          setTimeout(() => {console.log('4')}, 0);
        })    
    })
    .catch((res) => console.log(res))
    .then((res) => console.log(res))
    .finally((res) => {
      console.log(res);
      setTimeout(() => {console.log('5')}, 0);
    });
console.log('6');

function foo() {
  const x = 10;

  return {
    x: 20,
    bar: () => {
      console.log(this.x)
    },
    baz: function() {
      console.log(this.x)
    }
  };
}

const obj1 = foo();

obj1.bar();    // ...
obj1.baz();       // ...

const obj2 = foo.call({ x: 30 });
obj2.bar();    // ..
obj2.baz();       // ...

type Rectangle = {
  width: number ;
  height: number ;
};

type Circle = {
  radius: number;
};

type AvailableFigure = Rectangle | Circle;

function isCircle(figure) {
  ...
}

function getCircleArea(figure: Circle): number {
    return Math.pow(figure.radius, 2) * Math.PI
}

function getRectangleArea(figure: Rectangle): number {
    return figure.width * figure.height
}

function getArea(figure: AvailableFigure): number {
  return isCircle(figure)
    ? getCircleArea(figure)
    : getRectangleArea(figure);
}

type MyPick<T, U extends keyof T> = {
    [key in U]: T[key] 
}

Формы: Formik, React Hook Form, Yup
Графика: Fabric.js, Three.js, Babylon.js
Дата и время: date-fns, Moment.js, Luxon.js, Day.js
Графики и визуализация: ECharts
UI-компоненты: MUI (Material UI), Ant Design
Запросы и кэширование: Axios, React Query, SWR
Локализация: i18next
Анимации: Framer Motion
Тестирование: Jest, React Testing Library
Другие: Swiper, React Window, React Calendar, React Advanced Cropper, React Table, Recharts

setTimeout(() => {
  console.log('setTimeout')
})

const promise = new Promise((resolve, reject) => {
  console.log(1);
  setTimeout(() => {
    console.log("timerStart");
    resolve("success");
    console.log("timerEnd");
  }, 0);

  Promise.resolve().then(() => {
    console.log('resolve')
  })
  console.log(2);
});

promise.then((res) => {
  console.log(res);
});

console.log(4);

setTimeout(function timeout() {
   console.log('Таймаут 1');
}, 0);

let p = new Promise(function(resolve, reject) {
   console.log('Создание промиса');

   setTimeout(function timeout() {
     console.log('Таймаут 2');
   }, 0);

   resolve();
});

p.then(function(){
   console.log('Обработка промиса');
});

console.log('Конец скрипта');

const myPromise = (delay) => new Promise((res, rej) => { setTimeout(res, delay) })

setTimeout(() => console.log('in setTimeout1'), 1000);

myPromise(1000).then(res => console.log('in Promise 1'));

setTimeout(() => console.log('in setTimeout2'), 100);

myPromise(2000).then(res => console.log('in Promise 2'));

setTimeout(() => console.log('in setTimeout3'), 2000);

myPromise(1000).then(res => console.log('in Promise 3'));

setTimeout(() => console.log('in setTimeout4'), 1000);

myPromise(5000).then(res => console.log('in Promise '));

console.log(1); 

setTimeout(() => console.log(2));

Promise.resolve().then(() => console.log(3));

Promise.resolve().then(() => setTimeout(() => console.log(4)));

Promise.resolve().then(() => console.log(5));

setTimeout(() => Promise.resolve().then(() => console.log(6)));

console.log(7);

console.log('start');

const promise1 = Promise.resolve().then(() => {
    console.log('promise1');
    const timer1 = setTimeout(() => {
        console.log('timer1')
        const promise2 = Promise.resolve().then(() => {
            console.log('promise2');
            const timer2 = setTimeout(() => {
                console.log('timer2')
            }, 0)
        })
    }, 0);
});

const timer3 = setTimeout(() => {
    console.log('timer3');
    const promise3 = new Promise(resolve => {
        setTimeout(() => {
            console.log('promise3');
            resolve();
        }, 0);
    }).then(() => {
        console.log('promise3 then');
    })
}, 0);

async function asyncFunction() {
    console.log('async start');
    await new Promise(resolve => setTimeout(resolve, 0));
    console.log('async middle');
    await Promise.resolve().then(() => console.log('async promise'));
    console.log('async end');
}

asyncFunction();

console.log('end');