import * as React from "react";
import { DemoContainer } from "@mui/x-date-pickers/internals/demo";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
import { DatePicker } from "@mui/x-date-pickers/DatePicker";
import { StaticDatePicker } from "@mui/x-date-pickers/StaticDatePicker";
import dayjs, { Dayjs } from "dayjs";
export default function BasicDatePicker() {
const [date, setDate] = React.useState<Dayjs | null>(dayjs());
const onDateChange = React.useCallback((value: Dayjs) => {
setDate(value);
}, []);
return (
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DemoContainer components={["DatePicker", "StaticDatePicker"]}>
<DatePicker<Dayjs>
value={date}
views={["month"]}
onChange={onDateChange}
/>
<StaticDatePicker<Dayjs>
value={date}
orientation="landscape"
onChange={onDateChange}
/>
</DemoContainer>
</LocalizationProvider>
);
}window.open необходимо предоставить разрешение на открытие окон.
const toCamelCase = (string = '') => {
const value = (string.toLowerCase().match(/[a-z]+[0-9]*|[0-9]+/g) ?? [])
.map((x) => x.slice(0, 1).toUpperCase() + x.slice(1))
.join('');
return value.slice(0, 1).toLowerCase() + value.slice(1);
};toCamelCase() // ''
toCamelCase('SOME_NAME_IVAN') // 'someNameIvan'
toCamelCase('my-super-key') // 'mySuperKey'- console.log(`userId: ${userId}`);
+ console.log('userId:', userId);const tempalte = `
<span class="c56 c77 c98">текст</span>
<span class="c101">текст</span>
<span class="c111">текст</span>
<span class="c12 c30 c98">текст</span>
`;
const parser = new DOMParser();
const root = parser.parseFromString(tempalte, 'text/html');
root.querySelectorAll('.c77, .c98, .c101').forEach((element) => {
const content = document.createElement('b');
content.append(...element.childNodes);
element.replaceWith(content);
});
console.log(root.body.innerHTML);
/*
<b>текст</b>
<b>текст</b>
<span class="c111">текст</span>
<b>текст</b>
*/const template = `
<span class="c56 c77 c98">текст</span>
<span class="c101">текст</span>
<span class="c111">текст</span>
<span class="c12 c30 c98">текст</span>
`.trim();
const classNames = ['c77', 'c98', 'c101'];
let result = template;
for (const className of classNames) {
const expression = new RegExp(`<([\\w-]+)\\s*class=".*${className}.*"\\s*>(.+)</\\1>`, 'gm');
result = result.replace(expression, (match, tag, content) => `<b>${content}</b>`);
}const classNames = ['c77', 'c98', 'c101'];
const expression = new RegExp(`<([\\w-]+)\\s*class=".*(${classNames.join('|')}).*"\\s*>(.+)</\\1>`, 'gm');
const result = template.replace(expression, (match, tag, className, content) => `<b>${content}</b>`);const keys = new Set(
Object.values(data)
.map((entry) => Object.keys(entry))
.flat()
);
const properties = Object.keys(data).map((key) => [
key.split("_").shift(),
key,
]);
const result = [...keys].reduce((acc, key) => {
acc[key] = Object.fromEntries(
properties.map(([property, type]) => [property, data[type][key] ?? 0])
);
return acc;
}, {});const mappedData = Object.entries(data).reduce((acc, [type, entry]) => {
const property = type.split('_').shift();
for (const key in entry) {
acc[key] = { ...acc[key], [property]: entry[key] };
}
return acc;
}, {});
console.log(mappedData);
/*
{
"Машины и оборудование прочие, не включенные в другие группировки": {
"active": 1,
"inactive": 2
},
"Насосное оборудование, комлектующие, сопутствующие": {
"active": 1,
"inactive": 2
},
"Электродвигатели, генераторы и трансформаторы силовые": {
"active": 1,
"inactive": 2
},
"Средства транспортные прочие, не включенные в другие группировки": {
"active": 1
}
}
*/const result = {};
const propertyMap = Object.fromEntries(Object.keys(data).map((key) => [key.split('_').shift(), key]));
for (const property in propertyMap) {
for (const key in data[propertyMap[property]]) {
result[key] ??= {};
result[key][property] = data[propertyMap[property]][key];
}
}
for (const key in result) {
for (const property in propertyMap) {
if (property in result[key] === false) {
result[key][property] = null;
}
}
}
console.log(result);
/*
{
"Машины и оборудование прочие, не включенные в другие группировки": {
"active": 1,
"inactive": 2
},
"Насосное оборудование, комлектующие, сопутствующие": {
"active": 1,
"inactive": 2
},
"Электродвигатели, генераторы и трансформаторы силовые": {
"active": 1,
"inactive": 2
},
"Средства транспортные прочие, не включенные в другие группировки": {
"active": 1,
"inactive": null
}
}
*/import * as React from 'react';
import { createRoot } from 'react-dom/client';
import { BrowserRouter, Routes, Route, Link, useParams } from 'react-router-dom';
const users = [
{
id: 1,
firstName: 'John',
lastName: 'Doe',
age: 27
},
{
id: 2,
firstName: 'Emily',
lastName: 'Green',
age: 29
}
];
const Home = () => {
return (
<ul>
{users.map(user => (
<li key={user.id}>
<Link to={`/${user.id}`}>{user.firstName} {user.lastName}</Link>
</li>
))}
</ul>
);
};
const User = () => {
const params = useParams();
const id = parseInt(params.id);
const user = users.find((entry) => entry.id === id);
if (user === undefined) {
return <p>User not found</p>;
}
return (
<>
<ul>
<li><storng>Firstname</storng>: {user.firstName}</li>
<li><storng>Lastname</storng>: {user.lastName}</li>
<li><storng>Age</storng>: {user.age}</li>
</ul>
<Link to="/">Go back</Link>
</>
);
};
const root = createRoot(document.getElementById('root'));
root.render(
<BrowserRouter>
<Routes>
<Route index element={<Home />} />
<Route path=":id" element={<User />} />
</Routes>
</BrowserRouter>
);<div class="parent__block">
<form class="child__block" data-id="1">
<div class="">name: </div><input type="text" class="name" name="name">
<div class="">surname: </div><input type="text" class="surname" name="surname">
<button type="submit">click</button>
</form>
</div>
<div class="parent__block">
<form class="child__block" data-id="2">
<div class="">name: </div><input type="text" class="name" name="name">
<div class="">surname: </div><input type="text" class="surname" name="surname">
<button type="submit">click</button>
</form>
</div>const persons = [
{ id: 1, check: 1 },
{ id: 2, check: 0 }
];
const onFormSubmit = (form) => {
form.addEventListener('submit', (event) => {
event.preventDefault();
const id = parseInt(form.dataset.id);
if (!Number.isNaN(id)) {
const formData = new FormData(form);
const person = persons.find((person => person.id === id));
person.name = formData.get('name');
person.surname = formData.get('surname');
console.log(persons);
}
});
};
document
.querySelectorAll('form[data-id]')
.forEach((form) => onFormSubmit(form));const collectTree = (itemSelector, elementSelector, root = document) =>
[...root.querySelectorAll(itemSelector)].map((element) => ({
name: element.querySelector(elementSelector)?.textContent.trim(),
child: collectTree(itemSelector, elementSelector, element),
}));collectTree('ul > li', 'a');
// или
collectTree(':scope > ul > li', 'a');[
{
"name": "Вегетотропные средства",
"child": [
{
"name": "Адренолитические средства",
"child": [
{
"name": "Альфа- и бета-адреноблокаторы",
"child": []
},
{
"name": "Альфа-адреноблокаторы",
"child": [
{
"name": "Альфа-адреноблокаторы в комбинациях",
"child": []
}
]
},
{
"name": "Бета-адреноблокаторы",
"child": [
{
"name": "Бета-адреноблокаторы в комбинациях",
"child": []
}
]
},
{
"name": "Симпатолитики",
"child": [
{
"name": "Симпатолитики в комбинациях",
"child": []
}
]
}
]
},
{
"name": "Противоопухолевые средства",
"child": [
{
"name": "Алкилирующие средства",
"child": []
},
{
"name": "Антиметаболиты",
"child": []
},
{
"name": "Другие противоопухолевые средства",
"child": []
},
{
"name": "Противоопухолевые антибиотики",
"child": []
},
{
"name": "Противоопухолевые гормональные средства и антагонисты гормонов",
"child": []
},
{
"name": "Противоопухолевые средства — ингибиторы протеинкиназ",
"child": []
},
{
"name": "Противоопухолевые средства — моноклональные антитела",
"child": [
{
"name": "Противоопухолевые средства — моноклональные антитела в\n комбинациях",
"child": []
}
]
},
{
"name": "Противоопухолевые средства растительного происхождения",
"child": [
{
"name": "Противоопухолевые средства растительного происхождения в\n комбинациях",
"child": []
}
]
}
]
},
{
"name": "Разные средства",
"child": [
{
"name": "Вспомогательные вещества, реактивы и полупродукты",
"child": []
},
{
"name": "Детское питание (включая смеси)",
"child": []
},
{
"name": "Другие разные средства",
"child": []
},
{
"name": "Радиопрофилактические и радиотерапевтические средства",
"child": []
},
{
"name": "Склерозирующие средства",
"child": []
},
{
"name": "Средства для коррекции нарушений при алкоголизме, токсико- и\n наркомании",
"child": [
{
"name": "Средства для коррекции нарушений при алкоголизме, токсико-\n и наркомании в комбинациях",
"child": []
}
]
}
]
},
{
"name": "Регенеранты и репаранты",
"child": [
{
"name": "Регенеранты и репаранты в комбинациях",
"child": []
}
]
}
]
}
]class Hamburger {
constructor(size, stuffing) {
this.size = size;
this.stuffing = stuffing;
this.toppings = [];
}
static get SIZE_SMALL() {
return { name: 'SIZE_SMALL', price: 50, calories: 20 };
}
static get SIZE_HUGE() {
return { name: 'SIZE_HUGE', price: 100, calories: 40 };
}
static get STUFFING_CHEESE() {
return { name: 'STUFFING_CHEESE', price: 10, calories: 20 };
}
static get STUFFING_SALAD() {
return { name: 'STUFFING_SALAD', price: 20, calories: 5 };
}
static get STUFFING_POTATOE() {
return { name: 'STUFFING_POTATOE', price: 15, calories: 10 };
}
static get TOPPING_SAUCE() {
return { name: 'TOPPING_SAUCE', price: 15, calories: 0 };
}
static get TOPPING_MAYO() {
return { name: 'TOPPING_MAYO', price: 20, calories: 5 };
}
addTopping(topping) {
this.toppings.push(topping);
return this;
}
calculateCalories() {
const toppingCalories = this.toppings.reduce((total, topping) => total + topping.calories, 0);
return this.size.calories + this.stuffing.calories + toppingCalories;
}
calculatePrice() {
const toppingPrice = this.toppings.reduce((total, topping) => total + topping.price, 0);
return this.size.price + this.stuffing.price + toppingPrice;
}
}const hamburger = new Hamburger(Hamburger.SIZE_SMALL, Hamburger.STUFFING_CHEESE);
hamburger.addTopping(Hamburger.TOPPING_MAYO);
console.log('Calories:', hamburger.calculateCalories());
hamburger.addTopping(Hamburger.TOPPING_SAUCE);
console.log('Calories:', hamburger.calculateCalories());
console.log('Price with sauce:', hamburger.calculatePrice());- if (sheep === undefined || sheep === null) sheep === 0;
+ if (sheep === undefined || sheep === null) sheep = 0;", в том случае, если они есть в строке.function escape(value, char = '"') {
const preparedValue = value?.toString() ?? String(value);
if (preparedValue.includes(char)) {
const escapedValue = preparedValue.replaceAll(char, char.repeat(2));
return char + escapedValue + char;
}
return preparedValue;
}
function toCSV(entries) {
return entries
.map((row) => row
.map((entry) => {
if (typeof entry === 'object') {
throw new Error('Unexpected value');
}
return escape(entry);
})
.join(',')
)
.join('\n');
}
console.assert(toCSV([]) === ``);
console.assert(toCSV([[]]) === ``);
console.assert(toCSV([['name', 'age']]) === `name,age`);
console.assert(toCSV([['name', 'age'], ['John', 30]]) === `name,age
John,30`);
console.assert(toCSV([[1, 2], ['a', 'b']]) === `1,2
a,b`);
console.assert(toCSV([[1, 2], ['a', 'b'], ['c', 'd']]) === `1,2
a,b
c,d`);
console.assert(toCSV([['"text"', 'other "long" text']]) === `"""text""","other ""long"" text"`);