نوشته های علی یاری زاده

قابلیت های جالب JSON در Javascript

علی یاری زاده — Wed, 02 Mar 2022 21:56:24 +0330

تو این پست میخوام در مورد JSON که یک global object در جاوااسکریپت هست و یسری قابلیت های باحالی که ممکنه تا حالا ندیده باشیم صحبت کنم.من اینجا فرض رو براین میگیرم که شما میدونید json چیه و ساختارش به چه صورته و اینجا یک سری قابلیت های بیشتر از متدهایی که ابجکت JSON به ما ارائه میده میگم، اگه با آشنایی کافی ندارید برای مطالعه بیشتر میتونید ایجا کلیک کنید.امروزه انتقال دیتا به صورت json بسیار رایجه و روزانه ما با این نوع ساختار برخورد زیادی داریم این قابلیت بسیار مفید هستند.-> Formattingconst user = { name: 'Ali', age: 23, isAdmin: true, friends: ['Reza', 'Mohsen'], address: { city: 'Tehran', country: 'Iran' } }; console.log(JSON.stringify(user));خروجی کد بالا رو اینجا در حالت عادی ببینیم اینجا میبینم:{"name":"Ali","age":23,"isAdmin":true,"friends":["Reza","Mohsen"],"address":{"city":"Tehran","country":"Iran"}}حالا میخوایم با قابلیت خوانایی بیشتر فرمت کنیم و ببینیم:console.log(JSON.stringify(user, null, 2)); { "name": "Ali", "age": 23, "isAdmin": true, "friends": [ "Reza", "Mohsen" ], "address": { "city": "Tehran", "country": "Iran" } }تو این حالت دیتای خروجی 2 تا space به صورت indentation دادیم.حالا اگه بخوایم یه کاراکتر خاص رو به ابتدای هر فیلد اضافه کنیم و به جای space کاراکتر یا رشته مورد نظر ما قرار بگیره به صورت زیر عمل میکنیم.console.log(JSON.stringify(user, null, 'AAA')); { AAA"name": "Ali", AAA"age": 23, AAA"isAdmin": true, AAA"friends": [ AAA"Reza", AAA"Mohsen" AAA ], AAA"address": { AAA"city": "Tehran", AAA"country": "Iran" AAA} AAA}-> Custom output دومین پارامتر ورودی stringify میتونه یک تابع (function) یا آرایه (array) باشه که به صورت زیر عمل میکنه.ورودی آرایه:const user = { name: 'Ali', password: '6543221', age: 23 } console.log(JSON.stringify(user, ['name', 'age']));خروجی کد بالا به صورت زیر هست:{"name":"Ali","age":23}وقتی از آرایه در پارامتر دوم استفاده کنیم. تنها فیلدهایی که در این آرایه هستند برگشت داده میشه.ورودی تابع: function stripKeys(...keys) { return (key, value) => { if (keys.includes(key)) { return; } return value; }; } const user = { name: 'Ali', password: '6543221', age: 23, gender: 'male' }; console.log(JSON.stringify(user, stripKeys('password', 'gender')));خروجی بالا به صورت زیر است:{"name":"Ali","age":23}همونطور که در مثال بالا دیدیم میتونیم آرگمان دوم که replace هست رو یه تابع بدیم و خروجی به دلخواه تعیین کنیم.طبق معمول خلاصه و مفید، امیدوارم مفید باشه براتون.

اجرای shell commands در Node.js

علی یاری زاده — Fri, 28 Jan 2022 09:28:15 +0330

تو این پست میخوام در مورد اجرای دستورات که میشه تو shell اجرا کرد و اجرای اون ها در node.js صحبت کنم که خیلی جاها ممکنه به دردمون بخوره.خب به لطف کتابخونه ZX گوگل که میتونید از npm اونو بگیرن این کار امکان پذیره :)نکته: حتما باید ورژن node از v14.13.1 بیشتر باشه.npm i zxخب به کمک این کتابخونه میتونیم مستقم دستورات لینوکسی که لازم داریم رو تویه node.js بنویسمالبته خود node.js به کمک ماژول child_process که داره میتونه تمامی دستوراتی که تو shell اجرا میشن رو اجرا کنه ولی کار با zx خیلی راحت و تمیز تره ;)از طریق child_process با کمک متد exec میشه دستورات رو اجرا کرد اما نکته ای که داره اینه به صورت callback هست و کلا این مدلی خیلی کمکی به تمیز بودن کد نمیکنه برای همین گفتم با استفاده از zx خیلی راحت ترو تمیز تره.child_process.exec();child_process.exec(command[, options][, callback])اجرای دستورات لینوکسی با استفاده از zx: خب اگه بخوایم یه دستور لینوکسی رو اجرا کنیم به صورت زیر عمل میکنم:const { $ } = require('zx');(async () => {const output1 = await $`date`; const output2 = await $`ls -al`; console.log(output1.stdout); console.log(output2.stdout);})();برای اجرای command ها ما باید از $ استفاده کنیم که در ابتدا از zx میگیریم و سپس دستورات رو داخل backtick [ $`command` ] جلویه $ قرار میدیم.-- از این دستور سه تا object به صورت خروجی داریم:1- stdout: که خروجی دستور اجرایی در اون ذخیره شده.2- stderr: اگر دستور به خطا بخوره خطا در این object قرار میگیره.3- exitCode: اگر دستور مورد نظر با موفقیت اجرا بشه 0 برمیگرده.- حتی میشه چندتا دستور رو به صورت همزمان به کمک Promise.all اجرا کرد.- اینم بگم که خود zx داره از child_process که تو هسته node.js هست استفاده میکنه.تا اینجا شد اجرای دستورات در محیط shell، خب کتابخونه zx یسری توابع کاربردی دیگه هم داره که ممکنه خیلی به کارمون بیاد برای مثال:cd();fetch();question();sleep();حالا برای آشنایی بیشتر میتونید به صفحه npm یا گیت هاب zx سر بزنید.npm zx
github zxطبق عادتی که دارم سعی میکنم کوتاه و خلاصه توضیح بدم امیدوارم مفید بوده باشه براتون :)

متدهای کاربردی آرایه ها در JavaScript | بخش دوم

علی یاری زاده — Thu, 05 Aug 2021 20:21:30 +0430

تو این پست میخوام بخش دوم از متد کاربردی آرایه ها در جاوااسکریپت رو توضیح بدم، اگه بخش اول رو نخوندین میتونید برای مطالعه اینجا کلیک کنید. قبل از شروع بهتره درمورد تفاوت متد(method) و تابع (function) یه توضیح بدم:در اصل فرق چندانی ندارن، چون در هرصورت تابع حساب میشن و یک کار خاص انجام میدن. ولی در کل به توابعی که از اعضای یک کلاس خاص هستن و به یک object نسبت داده میشن متد گفته میشه. جستجو در آرایه به کمک متد find:let users = [ { name: 'ali', age: 22 }, { name: 'reza', age: 22 }, { name: 'zahra', age: 18 }, { name: 'nafas', age: 26 }, { name: 'hamed', age: 25 } ] let result = users.find(user => user.age === 22);console.log(result); //output { name: 'ali', age: 22 }ما از آرایه ای که مشخص کردیم متد find رو صدا کردیم، و گفتیم دنبال عنصری باش که فیلد age اون برابر با 22 باشه. و خروجی بالا رو به ما برگردوند به همین راحتی....!نکته: دوستان به آرایه دقت کنید ما دوتا از عناصر رو داریم که فیلد age اونها برابر با 22 هست ولی این متد اولین عنصری رو ببینه که با شرط برابره رو برمیگردونه. ;)متد indexOf :به کمک این دوتا متد میشه ما اندیس (شماره محل قرار گیری عنصر در آرایه) یا همون index رو به دست بیاریم.البته از این متدها برای جستجو مقادیر در آرایه ها بیشتر استفاده میشه که مقدار مورد نظر موجوده یا نه.let numbers = [11, 22, 33, 44, 55, 66, 77, 88, 99];console.log(numbers.indexOf(55)) //output 4 console.log(numbers.indexOf(56)) //output -1همونطور که در این مثال میبینید اگر عنصر مورد نظر رو پیدا کنه شماره index اون رو برمیگردونه در غیراین صورت عدد 1- برگشت میخوره.این متد میتونه دوتا آرگومان ورودی داشته باشه(دومی اختیاریه). از اونجایی که در مثال قبل دیدیم جستجو در آرایه ها با مشکلی روبروعه که اولین عنصر مشابه رو پیدا کنه مقدار اون رو برمیگردونه با این کار در این متد میشه تا حدی این مشکل رو پوشش داد.به این مثال توجه کنید:let numbers = [11, 22, 33, 77, 44, 55, 66, 77, 88, 99]; console.log(numbers.indexOf(77, 4)) // 7به این متد گفتیم که دنبال عدد 77 بگرد ولی از اندیس 4 به بعد شروع کن به جستجو این عدد. به همین دلیل عدد 7 برای ما برگشت داده میشه.تولید آرایه جدید به کمک متد slice:این متد اندیس(index) شروع و پایان یا فقط شروع رو میگیره و آرایه جدیدی که شامل عناصر میانی این اندیس ها میشه رو میسازه.let numbers = [11, 22, 33, 44, 55, 66, 77, 88, 99];console.log(numbers.slice(5)); // output [ 55, 66, 77, 88, 99 ] console.log(numbers.slice(2, 7)) // output [ 33, 77, 44, 55, 66 ]همونطور که تویه مثال بالا نمایش داده شده این متد میتونه با یک یا دو آرگومان ورودی صدا زده بشه و یک آرایه جدید تولید کنه که شامل عناصری هستند که ما محدوده index اونها رو انتخاب کردیم. اگه بدون آرگومان این متد رو صدا کنیم کپی کاملی از کل آرایه برای ما میسازه.نکته: فقط توجه داشته باشین که اگه دو آرگومان به این متد بدیم تا عنصر یکی مونده به آخر اندیس دومی که دادیم خونده میشه.چسباندن دو آرایه به هم به وسیله متد concat: let arrOne = [1, 2, 3, 4, 5]; let arrTwo = [6, 7, 8, 9, 10]; console.log(arrOne.concat(arrTwo)); //output [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]ما به کمک متد concat میتونیم دوتا آرایه رو با هم ترکیب کنیم و یک آرایه جدید بسازیم.متد some: let numbers = [63, 23, 5, 6, 7, 2, 9, 10, 11, 12, 13];console.log(numbers.some(element => element < 5 )); // true console.log(numbers.some(element => element === 100 )); // falseاین متد چک میکنه اعضای آرایه با تابع ارائه شده سازگار هستن یا نه. مقدار برگشتی این متد اگر حداقل یکی از عناصر سازگار باشه true و اگر سازگار نباشه falseه. خب به پایان این بخش رسیدیم، ممنون از این که وقت گذاشتین و این پست رو خوندین.البته این همه متدهای آرایه ها در جاوا اسکریپت نبودن بلکه اون متدهایی رو نوشتم که بنظرم مهم تر بودن امیدوارم که براتون مفید باشه.خوشحال میشم نظرتون رو برام بنویسید :)))))))

متدهای کاربردی آرایه ها در JavaScript | بخش اول

علی یاری زاده — Fri, 30 Jul 2021 10:07:01 +0430

همه ما میدونیم آرایه ها (Arrays) یکی از مهم ترین نوع داده هایی هستند که ما روزانه در انجام پروژه های خودمون با اونها سروکار داریم، خب خیلی خوب میشه که یسری از متدهایی (methods) که هنگام کار با آرایه ها به ما کمک میکنن رو بشناسیم.قبل از شروع بگم که این متدها که در اینجا گفته میشن در زبان جاوااسکریپت هستن و ممکنه مشابه اونها تویه زبان های برنامه نویسی دیگه هم باشه.چطوری یک آرایه بسازیم؟let arr = []; در کد بالا یک آرایه ایجاد کردیم که هیچ مقداری نداره. افزودن مقادیر به آرایه با متد push:arr.push(1); arr.push(2,3); console.log(arr); // output [ 1, 2, 3 ]با متد push به راحتی میشه مقادیر رو به انتهایه آرایه افزود، البته توجه داشته باشین در مثال بالا صرفا مقادیر عددی وارد شدند و شما میتونید انواع داده رو به آرایه اضافه کنید.حذف مقادیر از آرایه با متد pop: arr.pop(); console.log(arr); //output [ 1,2 ] متد pop هیچ ورودی نمیگیره و همیشه با فراخوانی اون آخرین عنصر آرایه حذف میشه. حرکت در طول آرایه با استفاده از حلقه forEach:رویه آرایه که در مثال قبل مقدار دهی کردیم forEach رو صدا میکنیم.arr.forEach(element => console.log(element)); //output 1 2حلقه forEach یکی از ابزارهای پرکاربرده که به خوانایی و کوتاه شدن کد کمک میکنه و در کار با آرایه ها بسیار کاربردیه. این متد ابتدا تا انتهای آرایه رو طی میکنه و تک تک عناصر رو میخونه و ما میتونیم عملیات رویه اونها انجام بدیم. در این مثال عنصرهای آرایه خودمون رو نمایش میدیم.فیلترکردن آرایه با استفاده از متد filter:(در این مثال ابتدا آرایه ای از object ها به نام users می سازیم)let users = [ { name: 'ali', age: 22 }, { name: 'reza', age: 23 }, { name: 'zahra', age: 18 }, { name: 'nafas', age: 26 }, { name: 'hamed', age: 25 } ] let result = users.filter(user => user.age >= 23); console.log(result); یکی از متد کاربردی و مهم آرایه ها در جاوااسکریپت filter هست. به کمک این متد میتونید نتیجه دلخواه رو از یه آرایه مثل صافی خروجی بگیرین، خروجی این متد تنها مقادیری هستند که شرط آنها تطبیق داشته باشد در غیر این صورت در خروجی نمایش داده نمی شوند.تغییر آرایه به کمک متد map:(مثال زیر با استفاده از آرایه مثال قبله، ولی اینجا ما میخوایم عدد 23 رو با سن همه کاربرهامون جمع بزنیم)let users = [ { name: 'ali', age: 22 }, { name: 'reza', age: 23 }, { name: 'zahra', age: 18 }, { name: 'nafas', age: 26 }, { name: 'hamed', age: 25 } ]let result = users.map(user => user.age + 23);console.log(result);متد map برای تغییر یه آرایه استفاده میشه. به این صورت که تک تک عناصر آرایه تغییر پیدا کرده و آرایه ای جدید با همون طول قبلی تولید میشه ولی محتوای اون متفاوته.خلاصه کردن آرایه به کمک متد reduce: متد reduce به سرراستی توابع قبلی نیست پس اینجا یه نگاه دقیق تر بهش میندازیم.let users = [ { name: 'ali', age: 22 }, { name: 'reza', age: 23 }, { name: 'zahra', age: 18 }, { name: 'nafas', age: 26 }, { name: 'hamed', age: 25 } ] let result = users.reduce((sum, user)=>{ return sum + user.age; }, 0); console.log(result);این متد دو آرگومان کلی داره: اولی یک تابع در دل خود با دو آرگومان دریافت میکند. آرگمان اول همیشه عنصر اول آرایه س و آرگومان دوم سایر عناصر آرایه هستن. این متد به صورت مکرر عنصری های آرایه رو میگیره و اونو با مقدار قبلی جمع میزنه در آخر هم یه مقدار کلی به ما میده. آرگومان دوم: نیز یک مقدار است که اختیاری می باشد که به حاصل آرگومان اول(تابع) میتونیم اضافه کنیم. البته به طور کل شما میتونید کارهای مختلفی با این متد انجام بدین و خلاصه دیتای مورد نظر خودتون رو با این متد به دست بیارین. این قسمت اول بود و تو قسمت های بعدی که به زودی منتشر میشه بقیه متدهای کاربردی رو توضیح میدم.ممنون از اینکه وقت گذاشتین :) خوشحال میشم نظرتون رو برام بنویسید.