6 سوءتفاهم‌ در مورد جاوا اسکریپت!
پارت ۵

5 - برای دستکاری DOM حتما به jQuery نیاز داریم!

🔸تو روزهای ابتدایی توسعه وب،جی کوئری یه لایبرری js پرطرفدار بود که برای ساده کردن کار با DOM و سازگاری با مرورگر های مختلف استفاده میشد.
🔸هموطور که گفتیم این حرفا برای گذشته بود که استفاده از جی کوئری برای کار با DOM ضروری به نظر میرسید، اما جاوا اسکریپت مدرن قدم های بزرگی رو برای دستکاری DOM اونم بدون نیاز به هیچ نوع لایبرری خارجی ای برداشته.

🔸با معرفی Document Object Model و همینطور روش هایی مثله:addEventListener, querySelectorAll کار با DOM حتی راحتتر شد.علاوه بر اینها خود توسعه وب مدرن، راه های کارآمد تری برای تعامل با DOM اونم بدون هرگونه وابستگی به jQuery رو برامون فراهم میکنه.

Channel:@js_challenges Group:@js_masters_gp

💎 معرفی کنترل ورژن NodeJS

⚠️ ممکنه به هر دلیلی با توجه به نوع پروژه نیاز داشته باشید یکبار از ورژن 14 نود جی اس استفاده کنید یکبار از ورژن 18 یا سایر ورژن ها. قطعاً اصولی نیست که هر بار نود جی اس رو حذف و ورژن قبلی یا بعدی رو نصب کنید.

نرم افزار NVM یک کنترل ورژن بسیار کاربردی برای نصب و مدیریت ورژن های مختلف نود جی اس روی ویندوز یا لینوکس می باشد با استفاده از این کنترل ورژن میتوانید هر چقدر که نیاز داشتید ورژن های مختلف نود جی اس رو نصب و هر زمان که نیاز داشتید بین آن ها سوئیچ کنید.

انتشار یادتون نره ❤️

Channel:@js_challenges Group:@js_masters_gp

تابع ()document.write چیست؟

🔸این تابع تو جاوا اسکریپت برای نوشتن محتوا به HTML استفاده میشه. بدین معنی که وقتی این تابع فراخوانی میشه، محتوای مشخصی به صفحه HTML اضافه میشه. به عبارت دیگه میتونیم از این تابع برای نمایش محتوا توی سند HTML بدون نیاز به دستکاری DOM استفاده کنیم.
مثال:

document.write("Hello,World!")

این کد باعث میشه که !Hello,World به صفحه HTML اضافه بشه.
🔸نکته: استفاده از این تابع میتونه باعث یسری مشکلات مثله پاک شدن محتوای قبلی بشه.تو استفاده ازش دقت کنین.

Channel:@js_challenges Group:@js_masters_gp

خب خب خب
دوستان امتحانات من تموم شد و دوباره از فردا پرقدرت شروع میکنیم و برمیگردیم به روال قبل 🔥🔥

ممنونم از عزیزانی که تو این مدت مخصوصا از بابت دوبله ها به من انرژی دادید و منتظر موندید تا من ادامه دوره رو براتون دوبله کنم ❤️

مطمئن باشید از این انتظار پشیمون نخواهید شد...

کلوژر داخل لوپ!

آقا اگه با یه همچین کدی طرف باشیم:

var funcs = [];
for (var i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("i value is " + i);
  };
}

for (var k = 0; k < 3; k++) {
  funcs[k]();
}

به احتمال بالا یه همچین خروجی ای انتظار دارین:

i value is 0
i value is 1
i value is 2


اما خروجی این میشه🗿:

i value is 3
i value is 3
i value is 3


این اختلاف به دلیل نحوه عملکرد مکانیسم کلوژر و نحوه نمایش داخلی متغیر i هست.

برای حل این موقعیت، می‌تونید از روش‌های زیر استفاده کنید:

1. ارسال مقدار i به کلوژر با استفاده از IIFE (تابع فوراً فراخوانی شده):

for (var i = 0; i < 3; i++) {
  funcs[i] = (function(value) {
    console.log("i value is " + value);
  })(i);
}

2. استفاده از let به جای var در حلقه for:

for (let i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("i value is " + i);
  }
}

Channel:@js_challenges Group:@js_masters_gp

💎 معرفی یک Benchmarking برای جاوا اسکریپت

فرض کنید دو تیکه کد دارید و میخواید بدونید کدام یک از دیگری سرعت اجرا شدن بیشتری داره.
به عنوان مثال، میخواید بررسی کنید کدام یک از حلقه های for و while یا map تو شرایط یکسان از سرعت و پرفرمنس بالاتری برخوردار است.

با استفاده از وبسایت jsben.ch می تونید بنچ مارک کد های جاوا اسکریپتی تون رو با هم مقایسه کنید.

انتشار یادتون نره 🤝❤️

Channel:@js_challenges Group:@js_masters_gp

#quick_challenge
خروجی کد پایین چیه؟

let x = 0

for (let i = 0; i <= 8; i += 3) {
    if (i === 4) {
        continue
    }
    x += i

}
console.log(x)

گیری،مشکلی،انتقادی،کمکی،هرچی بود تو گروه منتظرتونیم😎

Channel:@js_challenges Group:@js_masters_gp

سلام شب همگی بخیر

ما تو تیممون به یه عزیزی نیاز داریم که به کار با فتوشاپ مسلط باشه

حقیقتش ما خیلی تلاش کردیم که تامبنیل های ویدیوهای یوتیوب رو خودمون بزنیم ولی واقعا کار ما نیست یعنی توانایی این کار رو نداریم واقعا

اگر عزیزی هست که دوست داره تو تیم ما برای طراحی تامبنیل ها فعالیت بکنه، ممنون میشم یه پیام به من بده ❤️

@MehrshadHeisenberg3

#Package_Managers

بچه ها این سوال همیشه پرسیده میشه که کدوم پکیج منیجر خوبه کدوم بده یا اصلا پکیج منیجر چی هست و به چه دردی میخوره؟!!!

من توی پست پایینی یه cheat sheet درست کردم برای اینکه این به جواب سوالا برسید و درکش کنید و برای انتخاب دو دل نشید 👌👌👌
✅بفرستید برای دوستاتون تا اونا هم به جواب سوالاشون برسن✅


Channel:@js_challenges Group:@js_masters_gp
👇👇👇👇👇👇👇👇👇👇👇👇👇👇👇👇👇👇👇

❌اینم از cheat sheet برای اینکه بدونیم Package Manager چیه و کدومش بهتره برای استفاده❌

#quick_challenge
خروجی کد پایین چیه؟

const obj = {
    a: 1,
    b: 5,
    c: 3,

}

const { b, ...rest } = obj

console.log(rest)

گیری،مشکلی،انتقادی،کمکی،هرچی بود تو گروه منتظرتونیم😎

Channel:@js_challenges Group:@js_masters_gp

آیدی گروه متصل به چنل:
@js_masters_gp

آیدی رباتی که باهاش میتونید به فایل زیپ دوبله های دوره جاوااسکریپت جوناس دسترسی داشته باشید:
@jschallenges_bot

یوتیوبمون:
https://www.youtube.com/@codelabplus

چنل تکنولوژیمون:
@Tech_Nuggets

001 Section Intro

و اما بریم سراغ ادامه دوبله دوره جاوااسکریپت Jonas Schmedtmann ... 🔥

بعد از یه فصل غول پیکر تئوری قراره تو این سکشن در رابطه با دیتا استراکچر های مختلف کلی مطالب یاد بگیریم و ببینیم این جاوااسکریپت مدرن که میگن یعنی چی؟!

#JavaScript | #Jonas_Schmedtmann | #S09 | #E01 | #Course

Channel: @js_challenges
Group: @js_masters_gp

#arrays
1️⃣ Syntax:

array.filter(filterFn);

2️⃣تابع فیلتر:

function filterFn(item) {
    if (keep_condition) {
        return true;
    } else {
        return false;
    }
}

این تابع بازخوانی (callback function)برای هر عنصر (item) در آرایه صدا زده می‌شود. اگر شرط keep_condition برقرار باشد، مقدار true برمی‌گرداند؛ در غیر این صورت، مقدار false.
3️⃣استفاده از filter برای فیلتر کردن کاربران با سن بالای 17:

const adults = users.filter((user) => {
    if (user.age >= 18) {
        return true;
    } else {
        return false;
    }
});

console.log("آرایه اولیه", users);
console.log("آرایه فیلتر شده", adults);

در اینجا، با استفاده از Array.filter() و یک تابع بازخوانی، فقط کاربرانی که سن آن‌ها بیشتر از 17 است، در آرایه فیلتر شده (adults) جمع‌آوری شده‌اند.
این console.log("آرایه اولیه", users); آرایه اصلی کاربران را چاپ می‌کند.
و console.log("آرایه فیلتر شده", adults); آرایه فیلتر شده را چاپ می‌کند که فقط حاوی کاربران با سن بیشتر از 17 سال است.

⭐️⭐️اگه دوس داشتین لایک و شییر و کامنت یادتون نره ⭐️⭐️

Channel | Group | YouTube

#تجربه_شخصی

دوره جاوااسکریپت جوناس ۲۰ فصله، نزدیک به ۷۰ ساعته

آیا نیازه همه ۲۰ فصل رو ببینیم؟! کدوم قسمت ها برای بک ضروریه کدوم قسمت ها برای فرانت؟ تو این ویس کامل به این سوال جواب دادم 👌

#quick_challenge

کدام عبارت به درستی این کد را از «amir.js» وارد می کند؟

//amir.js
export const result = (str) => console.log(str)

هر سوالی داشتین تو گروه منتظرتونیم😎

Channel | Group | YouTube

003 Destructuring Arrays ِDubbed

این قسمت و قسمت بعدی فوق العاده کاربردی هستن حتما خوب یادشون بگیرید مخصوصا داخل ریکت هم بسیار بسیار مخصوصا دیستراکچر کردن آبجکت ها کاربردیه 👌

#JavaScript | #Jonas_Schmedtmann | #S09 | #E03 | #Course

Channel | Group | YouTube