#javanoscript #js_trick #object

const obj = {};

let value = 0;

Object.defineProperty(obj, 'prop', {
    get() {
        return value;
    },
    set(newValue) {
        value = newValue + 1;
    },
    configurable: true,
    enumerable: true
});

obj.prop = 10;
console.log(obj.prop);

const person = {
   firstName: "ali",
   lastName: "ahmadi"
};

Object.defineProperty(person, 'fullName', {
  get() {
    return ${this.firstName} ${this.lastName}.toUpperCase();
  }
});

console.log(person.fullName); 

ALI AHMADI

const person = {};

Object.defineProperty(person, 'age', {
  get() {
    return this._age;
  },
  set(newAge) {
    if (newAge < 0) {
      throw new Error('سن نمی‌تواند منفی باشد.');
    }
    this._age = newAge;
  }
});

person.age = 30;
console.log(person.age); // خروجی: 30

try {
  person.age = -5;
} catch (error) {
  console.error(error.message); // خروجی: سن نمی‌تواند منفی باشد.
}

#javanoscript #js_trick #object

console.log(0 == ""); // true console.log(null == undefined); // true

در مقابل، === مقایسه برابری دقیق تری را انجام می‌دهد و به نوع داده‌ها توجه می‌کند. 👇

console.log(0 === ""); // false
console.log(null === undefined); // false

const a = NaN;
const b = 0 / 0;

console.log(a === b); // false
console.log(Object.is(a, b)); // true

１مقایسه اول ( a ===b ) : این مقایسه از عملگر برابری دقیق (===) استفاده می‌کند که هم مقدار و هم نوع داده‌ای دو متغیر را بررسی می‌کند. در این مورد، هر دو متغیر مقدار NaN دارند اما === باز هم false را برمی‌گرداند. دلیل این اتفاق این است که در استاندارد IEEE 754 (استاندارد اعداد ممیز شناور)، NaN با خودش برابر نیست.

２ مقایسه دوم ( Object.is(a, b) ) : این مقایسه از متد Object.is استفاده می‌کند که برای مقایسه برابری دو مقدار طراحی شده است. این متد در بیشتر موارد مانند === عمل می‌کند، اما در مورد NaN رفتاری متفاوت دارد. Object.is تشخیص می‌دهد که هر دو متغیر مقدار NaN دارند و بنابراین true را برمی‌گرداند.

#javanoscript #js_trick #unary_operators

این عملگرها عملیات مختلفی مانند افزایش/کاهش، ارزیابی نوع داده، منفی کردن یک مقدار و غیره را انجام می‌دهند ⚡

let x = 5; // در باینری: 0000000000000000000000000000010
x = ~x; // در باینری: 11111111111111111111111111111010

function exampleFunction() {
    return 42; // این مقدار برگشتی تابع است
}

console.log(void exampleFunction()); // undefined

#fun

#libarary #reactjs #react_helmet

import React from 'react';
import { Helmet } from 'react-helmet';

function MyComponent() {
  return (
    <div>
      <Helmet>
        <noscript>My Page Title</noscript>
        <meta name="denoscription" content="This is a denoscription of my page" />
      </Helmet>
      <h1>Hello, World!</h1>
      <p>Welcome to my React app with dynamic noscript and meta tags!</p>
    </div>
  );
}

#youtube

#libarary #storybook

✅ ویژگی ها

➊ امکان مشاهده و تست کامپوننت‌ها در حالت‌های مختلف را فراهم می‌کند.

➋ برای کامپوننت ها داکیومنت خودکار ایجاد می‌کند.

➌ این ابزار همکاری بین تیم‌های طراحی و توسعه را بهبود می‌بخشد.

➍ افزونه‌های متعددی برای تست بصری و دسترس‌پذیری دارد.

➎ تغییرات کامپوننت‌ها را سریع ارزیابی می‌کند.

➏ برای پروژه‌های بزرگ و تیم‌های توسعه‌دهنده بسیار مفید است.

// Button.stories.js
import React from 'react';
import { Button } from './Button';

export default {
  noscript: 'Example/Button',
  component: Button,
};

const Template = (args) => <Button {...args} />;

export const Primary = Template.bind({});
Primary.args = {
  label: 'Primary Button',
  variant: 'primary',
};

export const Secondary = Template.bind({});
Secondary.args = {
  label: 'Secondary Button',
  variant: 'secondary',
};

✅ در کل با استفاده از Storybook می‌توانید به سرعت UI خود را تست و بهبود دهید.

#javanoscript #triks #js_trick

let user = {
  name: "Ali",
  address: {
    city: "Tehran"
  }
};

console.log(user.address?.city); // "Tehran"
console.log(user.contact?.phone); // undefined (بدون ارور)

const mask = (value) => {
    return value.trim().slice(-4).padStart(value.length, '*');
}

console.log(mask('09121111111'));

// خروجی => 1111*******

Channel | Group | YouTube

brew install curl

sudo apt update && sudo apt install curl

توی ویندوز 10 به بالا به صورت دیفالت نصبه ولی اگر نصب نبود از صفحه رسمیش میتونید دانلود کنید

#tools | #CURL |  #Api

Channel | Group | YouTube

#libarary #lodash

به دلیل بهینه سازی هایی که روی این لایبرری صورت گرفته بهتون کمک میکنه تا کدهای تمیزتر، خواناتر و کارآمدتری بنویسید 🚀

نکته مهمی که هست اینه که بعضی از کامپوننت هارو با تیلویند در اختیارتون قرار میده و اگر هم نبود میتونید بدید چت جی‌پی‌تی و بهش بگید تبدیلش کنه به کد tailwind ⚡

➊ سادگی : یادگیری و استفاده از Express.js بسیار آسان است.

➋ سرعت : به دلیل ساختار سبک و بهینه، اپلیکیشن‌های ساخته شده با Express.js بسیار سریع هستند.

➌ انعطاف‌پذیری : این فریم ورک به شما آزادی زیادی برای ساخت اپلیکیشن‌های دلخواه می‌دهد.

➍ جامعه بزرگ : یک جامعه بزرگ از توسعه‌دهندگان وجود داره که از Express.js استفاده می‌کنند.

#framework #nodejs #backend

Channel | Group | YouTube

#chalange  #js_challenge

وقتی undefined رو با جمع می‌کنید خروجی NaN میشه چون، هر گونه عملیات ریاضی با undefined به NaN منجر می‌شود.

curl https://fakestoreapi.com/carts

curl -X POST -H "Content-Type: application/json" -d '{"userId":5,"date":"2020-02-03","products":[{"productId":5,"quantity":1},{"productId":1,"quantity":5}]}' https://fakestoreapi.com/carts

Channel | Group | YouTube