12 years on from its first release, ECharts takes another big step forward. Visualization types span from line, bar and pie charts to 3D graphs, calendars and Sankey diagrams. v6 brings an all-new design language, dynamic theme switching, dark mode support, even more chart types, and more. Be sure to enjoy the 100+ demos and the GitHub repo.
Apache Software Foundation
Please open Telegram to view this post
    VIEW IN TELEGRAM
  β€7π2π₯1
  CHALLENGE
const data = {
  name: '',
  age: 0,
  city: null,
  country: undefined,
  isActive: false
};
const getName = () => data.name || 'Unknown';
const getAge = () => data.age ?? 25;
const getCity = () => data.city || 'Default City';
const getCountry = () => data.country ?? 'Default Country';
const getStatus = () => data.isActive || 'inactive';
console.log(`${getName()}-${getAge()}-${getCity()}-${getCountry()}-${getStatus()}`);β€3
  What is the output?
  Anonymous Quiz
    35%
    Unknown-25-Default City-Default Country-inactive
      
    44%
    Unknown-0-Default City-Default Country-inactive
      
    12%
    -0--Default Country-false
      
    8%
    -25-Default City-Default Country-inactive
      
    β€7π1π₯1
  CHALLENGE
const sym1 = Symbol('test');
const sym2 = Symbol('test');
const obj = {
  [sym1]: 'first',
  [sym2]: 'second',
  regular: 'third'
};
const keys = Object.keys(obj);
const symbols = Object.getOwnPropertySymbols(obj);
const allProps = Reflect.ownKeys(obj);
console.log(keys.length);
console.log(symbols.length);
console.log(allProps.length);
console.log(sym1 === sym2);π₯3β€2
  β€4π3π₯1
  Interesting idea π€
I always thought that front-end development is much harder then backend, but I was having trouble to explain that idea to developers. Today I wanted to check the opinion of the LLM, so called the general expert's opinion.
Agreed that front-end is harder for humans, because backend scales mathematically, rule based, and it's not that hard to understand. It's just math...
Then I asked, to find a similar analogy for front-end. It nailed. BIOLOGY!
____
Backend scaling: like mathematics: you add more nodes, shard databases, optimize queries - the system grows by formulas and predictable rules.
Frontend change: like biology: small mutations (new device, new browser feature, new UX demand) create emergent, often chaotic behavior that must be adapted to case by case.
____
Biology is more difficult then mathematics β mathematics is rule-bound and deterministic, while biology is emergent, full of exceptions, context-dependent, and constantly changing.
Thatβs why front-end (biology-like) feels messier and harder for humans, even if backend (math-like) can be more abstractly deep.
Edgar Marukyan
I always thought that front-end development is much harder then backend, but I was having trouble to explain that idea to developers. Today I wanted to check the opinion of the LLM, so called the general expert's opinion.
Agreed that front-end is harder for humans, because backend scales mathematically, rule based, and it's not that hard to understand. It's just math...
Then I asked, to find a similar analogy for front-end. It nailed. BIOLOGY!
____
Backend scaling: like mathematics: you add more nodes, shard databases, optimize queries - the system grows by formulas and predictable rules.
Frontend change: like biology: small mutations (new device, new browser feature, new UX demand) create emergent, often chaotic behavior that must be adapted to case by case.
____
Biology is more difficult then mathematics β mathematics is rule-bound and deterministic, while biology is emergent, full of exceptions, context-dependent, and constantly changing.
Thatβs why front-end (biology-like) feels messier and harder for humans, even if backend (math-like) can be more abstractly deep.
Edgar Marukyan
π12π€11β€5π₯1
  CHALLENGE
const values = [null, undefined, '', 0, false, NaN];
const results = [];
for (let val of values) {
results.push({
value: val,
boolean: !!val,
string: String(val),
number: Number(val)
});
}
console.log(results[2].boolean);
console.log(results[3].string);
console.log(results[1].number);
β€7π3
  What is the output?
  Anonymous Quiz
    23%
    false 0 undefined
      
    40%
    false 0 NaN
      
    17%
    true 0 NaN
      
    20%
    false '0' undefined
      
    β€6π2π₯1
  Please open Telegram to view this post
    VIEW IN TELEGRAM
  π€£27π₯3β€2π€©2
  CHALLENGE
class StateMachine {
  constructor() {
    this.state = 'idle';
    this.transitions = {
      idle: { start: 'running' },
      running: { pause: 'paused', stop: 'stopped' },
      paused: { resume: 'running', stop: 'stopped' },
      stopped: { reset: 'idle' }
    };
  }
  
  transition(action) {
    const next = this.transitions[this.state]?.[action];
    if (next) this.state = next;
    return this.state;
  }
}
const sm = new StateMachine();
console.log(sm.transition('start'));
console.log(sm.transition('invalid'));
console.log(sm.transition('pause'));
console.log(sm.transition('resume'));
console.log(sm.transition('stop'));
console.log(sm.transition('reset'));β€8π1
  What is the output?
  Anonymous Quiz
    25%
    start invalid pause resume stop reset
      
    30%
    running running running running stopped stopped
      
    19%
    running idle paused running stopped idle
      
    26%
    running running paused running stopped idle
      
    β€4π2π₯2
  Prototype pollution π₯ 
Exposing the default prototype by calling unsafe recursive functions with untrusted data as input
Read ~20mins estimated
learn.snyk.io
Exposing the default prototype by calling unsafe recursive functions with untrusted data as input
Read ~20mins estimated
learn.snyk.io
Please open Telegram to view this post
    VIEW IN TELEGRAM
  β€9π4π₯2
  CHALLENGE
  console.log('1');
setTimeout(() => console.log('2'), 0);
Promise.resolve().then(() => console.log('3'));
setTimeout(() => console.log('4'), 0);
Promise.resolve().then(() => {
  console.log('5');
  return Promise.resolve();
}).then(() => console.log('6'));
console.log('7');What is the output?
  Anonymous Quiz
    37%
    1 7 3 5 6 2 4
      
    26%
    1 7 3 5 2 4 6
      
    22%
    1 7 2 4 3 5 6
      
    15%
    1 3 5 6 7 2 4
      
    β€6π3π€1
  Speed up solving programming tasks in any language β Python, JavaScript, Java, and more. Powered by ChatGPT Plus, but 3Γ cheaper! Donβt overpay $20 for ChatGPT Plus β pay just $7.25 and get faster, more accurate answers. Try DevHelperAI now!
@devhelperai_bot
Please open Telegram to view this post
    VIEW IN TELEGRAM
  β€3π3π₯2
  CHALLENGE
const nums = [1, 2, 3];
const obj = { a: 1, b: 2, c: 3 };
function process(...args) {
const [first, ...rest] = args;
const { a, ...others } = obj;
return { first, rest, a, others };
}
const result = process(...nums);
console.log(result.first);
console.log(result.rest.length);
console.log(result.others.b);
console.log(Object.keys(result.others).join(''));
console.log(result.a === nums[0]);
β€4π1
  What is the output?
  Anonymous Quiz
    24%
    1 3 2 bc true
      
    29%
    3 2 2 bc true
      
    17%
    1 2 2 bc false
      
    30%
    1 2 2 bc true
      
    β€6π3π€3
  CHALLENGE
let obj = { name: 'Sarah', age: 25 };
let weakMap = new WeakMap();
let map = new Map();
weakMap.set(obj, 'weak reference');
map.set(obj, 'strong reference');
console.log(weakMap.has(obj));
console.log(map.has(obj));
obj = null;
console.log(weakMap.has(null));
console.log(map.has(null));
console.log(map.size);β€1
  What is the output?
  Anonymous Quiz
    30%
    true true true true 1
      
    38%
    true true false false 1
      
    22%
    true true false false 0
      
    9%
    false false false false 0
      
    2β€3π2π₯1
  CHALLENGE
function* fibonacci() {
  let [a, b] = [0, 1];
  while (true) {
    yield a;
    [a, b] = [b, a + b];
  }
}
function* takeWhile(generator, predicate) {
  for (const value of generator) {
    if (!predicate(value)) break;
    yield value;
  }
}
const fib = fibonacci();
const smallFibs = takeWhile(fib, x => x < 20);
console.log([...smallFibs].join(','));π3β€1
  What is the output?
  Anonymous Quiz
    28%
    1,1,2,3,5,8,13,21
      
    35%
    0,1,1,2,3,5,8,13,21
      
    31%
    0,1,1,2,3,5,8,13
      
    5%
    0,1,2,3,5,8,13
      
    β€3π₯3π1π€1
  