option нельзя стилизовать как хочется? Нашел сноску на MSDN (не могу открыть, т. к. web archive), в которой (в сноске) сказано, что option обрабатывается на уровне ОС.option и подобных элементов (надо тоже читать сноски).
let colors = ['red', 'pink', 'coral', 'orange', 'yellow' ,'green'];
let index = 0;
function changeColor() {
p.style.setProperty('background-color', colors[index++]);
index %= colors.length;
}
let interval = setInterval(changeColor, 1000);this.configDb = c;. Если это какой-то метод (функция), то можно сделать нечто подобное class Some {
constructor() {
this.configDb = {
user: null,
password: null,
connectString: null
};
}
static required(name) {
throw new Error(`Argument ${name} is required`);
}
setConfig({
user = Some.required('user'),
password = Some.required('password'),
connectString = Some.required('connectString')
}) {
this.configDb = { user, password, connectString };
}
}
const some = new Some();
some.setConfig({
user: 'John',
password: 'qwerty',
connectString: 'example.com'
});
console.log(some); // { configDb: { user: 'John', password: 'qwerty', connectString: 'example.com' } }
some.setConfig({
password: 'root'
}); // Error: Argument user is requiredsetConfig. Если просто setConfig({ user, password, connectString }). И какой бы объект не передали в функцию, она получит только эти 3 аргумента.
(async () => {
const sleep = duration => new Promise(resolve => setTimeout(resolve, duration));
for (let index = 0; index < 5; index++) {
console.log(`[${new Date().toLocaleTimeString()}] Index: ${index}`);
await sleep(1000);
}
})();
/*
[12:18:12] Index: 0
[12:18:13] Index: 1
[12:18:14] Index: 2
[12:18:15] Index: 3
[12:18:16] Index: 4
*/img свойство display по умолчанию установлено в inline. Поставьте block, должно помочь.
for-of заменить const entries = [1, 2, 3, 4];
for (let entry of entries) {...}data-popup можно заменить на element.dataset.popup
import.export по-другому пишется const greeting = (name) => console.log(`Hello, ${name}`);
export default greeting;
/* или */
export { greeting };import'ы будут разные для обоих случаев. Для первого import greeting from './file.js';, а во втором import { greeting } from './file.js';
/********************************
* Подготовка
********************************/
const formData = new FormData();
formData.append('name', 'John Doe');
formData.append('email', 'john.doe@example.com');
formData.append('phone', '88005553535');
/********************************
* Сборка параметров
********************************/
const searchParams = new URLSearchParams();
for (let [key, value] of formData.entries()) {
searchParams.set(key, encodeURIComponent(value));
}
console.log(searchParams.toString()); // name=John%2520Doe&email=john.doe%2540example.com&phone=88005553535request.send(searchParams.toString());. А ещё можно делать так: new FormData(DOM_ЭЛЕМЕНТ_ФОРМЫ);
gulp.src(...) надо return gulp.src(...)gulp.task('webserver', function () {
browserSync(config);
});gulp.task('webserver', function (cb) {
browserSync(config);
cb();
});const gulp = require('gulp');
const pipeIf = require('gulp-if');
const order = require('gulp-order');
const nunjucks = require('gulp-nunjucks');
const pretty = require('gulp-pretty-html');
const minify = require('gulp-htmlmin');
const replace = require('gulp-replace');
const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
const autoprefixer = require('gulp-autoprefixer');
const clean = require('gulp-clean-css');
const babel = require('gulp-babel');
const concat = require('gulp-concat');
const uglify = require('gulp-uglify');
const image = require('gulp-image');
const clear = require('gulp-clean');
const browser = require('browser-sync').create();
const { argv } = require('yargs');
sass.compiler = require('node-sass');
gulp.task('server', (callback) => {
browser.init({
server: {
baseDir: 'Build'
},
ui: {
port: 8080
},
notify: false
});
callback();
});
gulp.task('reload', (callback) => {
browser.reload();
callback();
});
gulp.task('clear', () => {
return gulp.src('Build', { allowEmpty: true })
.pipe(clear({
force: true
}));
});
gulp.task('build:html', (callback) => {
return gulp.src('Sources/**/*.html')
.pipe(nunjucks.compile())
.pipe(replace(/(\r\n|\r|\n)(\s+)?(\r\n|\r|\n)/gm, '\n'))
.pipe(pipeIf(argv.development, pretty()))
.pipe(pipeIf(argv.production, minify({ collapseWhitespace: true })))
.pipe(gulp.dest(`Build/`));
});
gulp.task('build:sass', () => {
return gulp.src(['Sources/Styles/*.sass', 'Sources/Styles/*.scss'])
.pipe(pipeIf(argv.development, sourcemaps.init()))
.pipe(sass())
.pipe(autoprefixer({
cascade: false
}))
.pipe(pipeIf(argv.production, clean()))
.pipe(pipeIf(argv.development, sourcemaps.write('.')))
.pipe(gulp.dest('Build/Styles/'));
});
gulp.task('build:js', () => {
return gulp.src('Sources/Scripts/**/*.js')
.pipe(pipeIf(argv.development, sourcemaps.init()))
.pipe(order([
// Order for JS files
'*.js'
]))
.pipe(concat('main.js'))
.pipe(babel({
presets: ['@babel/env']
}))
.pipe(pipeIf(argv.production, uglify()))
.pipe(pipeIf(argv.development, sourcemaps.write('.')))
.pipe(gulp.dest('Build/Scripts/'));
});
gulp.task('build:images', () => {
return gulp.src(['Sources/Images/**/*.png', 'Sources/Images/**/*.jpg', 'Sources/Images/**/*.svg'])
.pipe(pipeIf(argv.production, image()))
.pipe(gulp.dest('Build/Images/'));
});
gulp.task('watch:html', () => {
gulp.watch(['Sources/**/*.html', 'Sources/**/*.njk'], gulp.series('build:html', 'reload'));
});
gulp.task('watch:sass', () => {
gulp.watch(['Sources/Styles/**/*.sass', 'Sources/Styles/**/*.scss'], gulp.series('build:sass', 'reload'));
});
gulp.task('watch:js', () => {
gulp.watch('Sources/Scripts/**/*.js', gulp.series('build:js', 'reload'));
});
gulp.task('watch:images', () => {
gulp.watch(['Sources/Images/**/*.png', 'Sources/Images/**/*.jpg', 'Sources/Images/**/*.svg'], gulp.series('build:images'));
});
gulp.task('build', gulp.parallel('build:html', 'build:sass', 'build:js', 'build:images'));
gulp.task('watch', gulp.parallel('watch:html', 'watch:sass', 'watch:js', 'watch:images'));
gulp.task('default', gulp.series('clear', 'build', 'server', 'watch'));