Skip to content

Commit

Permalink
Add new article, update latest articles
Browse files Browse the repository at this point in the history
  • Loading branch information
deadrime committed Mar 6, 2024
1 parent 8e65512 commit 5fc71e0
Show file tree
Hide file tree
Showing 2 changed files with 49 additions and 31 deletions.
69 changes: 39 additions & 30 deletions articles/js-built-in-methods/page.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -409,54 +409,63 @@ Object.fromEntries([['name', 'Zhenya'], ['age', 27]]) // { name: 'Zhenya', age:

```

`Object.keys(obj)` - вернет массив ключей
`Object.keys(obj)` - по простому - получить массив ключей.
Вернет только собственные(без прототипа) и перечисляемые(for...in) свойства.

```js
Object.keys({
name: 'Zhenya',
age: 27,
}) // ['name', 'age']

```

`Object.values(obj)` - вернет массив значений

```js
Object.values({
name: 'Zhenya',
age: 27,
}) // ['Zhenya', 27]

```

<h2 id="functions">Function</h2>

`Function.prototype.call(thisArg, ...args)` - вызывает функцию с указанным значением this и аргументами.
`Function.prototype.call(thisArg, ...args)` - вызывает функцию с указанным значением `this` и аргументами.

```ts

function sayHello() {
console.log('Hello,', this.name)
function multiply(a, b) {
this.logger(a * b);
return aa * b
}

// Тоже работает
const sayHelloArrow = () => {
console.log('Hello', this.name)
multiply.call({ logger: console.log }, 2, 2); // 4

// Мы не можем указать контекст для стрелочной функции
const addArrowFn = (a, b) => {
this.logger(a + b);
return a + b;
}

sayHello.call({ name: "Zhenya" }); // Hello, Zhenya
sayHelloArrow.call({ name: "Arina" }); // Hello, Arina
multiply.call({ logger: console.log }, 2, 2); // TypeError: this.logger is not a function

// Но вот при попытке переопределить this у стрелочной функции - не сработает
function person(name) {
this.name = name;

function sayHelloFn() {
console.log('Hello', this.name);
}
```

// this тут всегда будет привязан к this person
const sayHelloArrow = () => {
console.log('Hello', this.name);
}
`Function.prototype.apply(thisArg, [argsArray])` - тоже самое, что и `call`, но аргументы передаются в виде массива

return {
sayHelloFn,
sayHelloArrow
}
}
```ts
multiply.apply({ logger: console.log }, [2, 3]); // 6
```

const somePerson = person("Misha");
`Function.prototype.bind(thisArg, ...args)` - создает новую функцию, привязывая ей переданный `this`

somePerson.sayHello(); // Hello, Misha
somePerson.sayHello.call({ name: "Zhenya" }) // Hello, Zhenya
```ts

```
const multiplyTwo = add.bind({ logger: console.log }, 2);

`Function.prototype.apply(thisArg, [argsArray])` - тоже самое, что и call, но аргументы передаются в виде массива
multiplyTwo(4); // 8

`Function.prototype.bind(thisArg, ...args)` - создает новую функцию, привязывая ей переданный this
```
11 changes: 10 additions & 1 deletion components/LatestArticles/LatestArticles.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,23 @@ import { getPaginatedArticles } from "@/helpers/blog";
import { BlogArticle } from "../Article";
import styles from './LatestArticles.module.css';
import classNames from "classnames";
import Link from "next/link";

const LatestArticles = async () => {
const { articles, totalCount } = await getPaginatedArticles(3);

return (
<section className="mt-12 md:mt-40">
<h2 className="font-primary text-xl font-normal block mb-11">
<h2 className="font-primary text-xl font-normal mb-11 flex items-center">
Блог
{totalCount > 3 && (
<Link
href="/blog"
className="text-body2 ml-auto font-base text-primary"
>
Все статьи →
</Link>
)}
</h2>
<div className={styles.articlesWrapper}>
{articles.map(article => <BlogArticle key={article.slug} article={article} />)}
Expand Down

0 comments on commit 5fc71e0

Please sign in to comment.