|
یک چیزهایی از جاوااسکریپت و شایدم css!! :دی تعداد بازدیدvisits : 3975
|
|||||||||
masterhk
|
یک چیزهایی از جاوااسکریپت و شایدم css!! :دی سلام. مدتها بود میخواستم این پست رو بزنم اما قسمت نمیشد... یه سری ترفند توی js هست که خیلی از ماها از اونها بیخبریم و به همین دلیل همیشه کارمون لنگه... :/ این پست رو زدم تا چیزهایی رو که احساس میکنیم کمتر کسی درباره ش چیزی میدونه اما بیشتر کسی خیلی دنبالشه ور اینجا با هم به اشتراک بذاریم... مثلا تابع \"محاسبه سرعت بال زدن مرغ مگس خوار\" اونقدرا به کارمون نمیاد... :| خوب یه چیزی رو هم قبل از شروع به اونایی که تازه کار [تر از من!!] هستن -داریم اصلا؟؟ :دی - بگم که امیدوار بشم همه مون با هم... :دی بلدبودن از یاد گرفتن به دست میاد! :دی نه مدرک مهمه؛ نه سن مهمه؛ و در ابتدای کار نه تجربه... من خودم رو میگم؛ تا همین چند مدت پیش هیچی از جاوااسکریپت بلد نبودم؛ یعنی هیچی ها!! بذارید عین ممد اینم بگم که: الآن هیچی بلد نیستم... :دی ... و واقعا هم هنـــــوز هیچی بلد نیستم. اما الآن تونستم وضع بسیار خوبی رو برای خودم فراهم کنم... چطور؟؟ من هر کدی رو که به نظرم جالب میاد سریع میفتم به جونش و تا خط به خطش رو آنالیز نکنم ول کنش نیستم؛ حالا اگه اون موقع وسط انحام پروژه خودم باشم؛ از گشنگی در حال غش و ضعف باشم؛ و حتی \"...\" [اینم بگم که اگه کد قفل باشه اول بازش میکنم بعد در حال \"...\" باشم و ... :دی] حالا اینارو ولش... بریم سر اصل مطلب... |
||||||||
| شنبه 22 آذر 1393 - 10:58 |
|
||||||||
حمایت شدهThanks :
|
سپاس هاThanks (4) : farnam - mohammadazadh - heydarifard - amalian - |
smaeal
 
|
پاسخAnswer 1 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی سلام داداش کیان...خوبه...یعنی عالیه...ولی این یعنی چی...\"...\" 
=================================================== |
||||||||
| شنبه 22 آذر 1393 - 11:01 |
|
|
حمایت شده:
|
سپاس هاThanks (1) : masterhk - |
masterhk
|
پاسخAnswer 2 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دینقل قول از masterhk؟ :| ما بعضی وقتها میخوایم برنامه مون رو ببریم روی jQuery و بقیه ش رو روی اون بنویسیم ولی حسش نیست که دوباره یکی، یکی selector های dom مون رو به فرمت css بنویسیم و یا گاهی اوقات هم برعکس؛ برنامه مون برپایه jQuery هستش اما یه جایی هستیم که باید مستقیما دستگیره dom رو بدیم. خیلی از پلاگینها dom رو میخوان از جمله google maps . ببینید مثل میزنم... این div مونه: برای انتخاب با dom مینویسیم: کد: document.getElementById('myDiv')و با jQuery : کد: $("#myDiv")حالا مثلا پلاگینی مثل google maps اون dom رو میخواد نه این شی jQuery رو. شاید بگی خوب چه کاریه؟ از همون اول این یه خط رو عین بچه آدم مینویسیم دیگه... :| بله؛ توی این مثل اینجوریه؛ اما بعضی وقتها المنت مورد نیاز ما یه جای دوریه... :دی مثلا عنصر چندم از یه لیست که اون لیست خودش داخل یکی از اعضای یه لیست دیگه ست و کلا آدم با css هم که میخواد select ش کنه دو کیلومتر کد میخواد... :دی حالا چه برسه به انتخاب با dom! :| خوب حالا میرسیم به شیوه ش: اول دومی رو میگم... :دی کد: $(document.getElementById('myDiv')):دی کار میکنه ها... به همین راحتی؛ به همین خوشمزگی ما سلکتور dom رو تبدیل کردیم به یه شی jQuery ... :دی حالا اون یکی... کد: $("#myDiv").get(0)و 0 در اینجا اندیس اون المنت توی شی jQuery مون هستش... یعنی چی؟؟ مثلا شما توی کنسول بزنین: $("head") head که دیگه یکی داریم... اما بازم نتیجه ش یه آرایه [که البته آرایه هم نیست؛ شی jQuery ـه. :دی] یک عضوی میشه... بذارید مستقیم برم سر اصل مطلب: کد: $(document.getElementById('myDiv')).get(0) == document.getElementById('myDiv')و حتی کد: $(document.getElementById('myDiv')).get(0) === document.getElementById('myDiv')
ok؟؟ |
||||||||
| شنبه 22 آذر 1393 - 11:17 |
|
|
حمایت شده:
|
سپاس هاThanks (1) : farnam - |
masterhk
|
پاسخAnswer 3 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دینقل قول از smaealزیاد کنجکاوی نکن؛ ممکنه سرتو از دست بدی... 
|
||||||||
| شنبه 22 آذر 1393 - 11:19 |
|
|
حمایت شده:
|
سپاس هاThanks (1) : farnam - |
smaeal
|
پاسخAnswer 4 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی داداش کیان اگه میشه کد ها رو از این به بعد بزار توی باکس کد...آخه یه جوریه...
=================================================== |
||||||||
| شنبه 22 آذر 1393 - 11:22 |
|
masterhk
|
پاسخAnswer 5 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی چه باحال... در حین اینکه داشتی این پست رو میزدی داشتم همین کارو میکردم... |
||||||||
| شنبه 22 آذر 1393 - 11:24 |
|
masterhk
|
پاسخAnswer 6 : باحال و باحال تر! دیدی گذاشتم... :دی بعضی وقتها دلمون میخواد یه تابعی بنویسیم که که توش بتونیم از this [منحرفا THIS نه ها... :دی] کنیم... که در اینجا باید بگم دلمون بیجا میکنه؛ مگه برنامه نویس کار دل به خواهی باید انجام بده... اما خوب... چون دله دیگه... میریم که داشته باشیم دو تا شیوه باحال برای اینکار رو که من به همین مناسبت عنوان پست رو میزارم: باحال و باحال تر! [ عمت بیجا میکنه! :| ] این تابع مونه: کد: function myFunc(){alert(this.value);}می بینین که ما برای this.value و اصلا this مقداری در نظر نگرفتیم-ظاهرا!) یه چیزی رو هم اضافه کنم که در حالت عادی همیشه this و self با هم مساوی ان و مقدارشون هم... بهتره بگم: کد: function myFunc(){alert(this.value);}کد همیشه بهتر جواب میده... خوب حالا اگه تابع رو صدا بزنیم نامردی نمیکنه و آبرومونه نمیبره که گوسفند چرا مقداری بهم ندادی!! هر چند اگه متغیر value رو در سطح سراسری (یعنی بیرون از هر تابعی) تعریف میکردم؛ طبق دو قاعده: کد: function myFunc(){alert(this.value);}و کد: function myFunc(){alert(this.value);}[امیدوارم گرفته باشین... :دی] ... مقدار اون رو چاپ میکرد. اما من میخوام مثلا این جوری عمل کنم: کد: function myFunc(){alert(this.value);}و حالا من که تابع رو اجرا میکنم همون مقدار اون سال پربرکت و پر شئون [WTF SHOeOON?!] و عبارت مورد علاقه اون فرد پربرکت و پر شئون [feel free... :| ] رو چاپ کنه؛ یعنی: کد: function myFunc(){alert(this.value);}[حالا آلرت کنه؛ چه فرقی میکنه؟؟ :| ] آخ جون باز شده وقت شیوه... :دی کد: function myFunc(){alert(this.value);}خوب حالا ممکنه بگید این به درد عمم میخوره؟ این که پارامتر نمیگیره... :| من در جواب باید بگم: به درد عمه تونم میخوره... کد: function myFunc(){alert(this.value);}paramهای 1 و 2 رو داخل پرانتز نوشتم که قبل از اینکه با رشته جمع بشن؛ با همدیگه جمع بشن؛ حالا به اونجا هم میرسیم... ;/ الآن من باید اینطوری صداش بزنم: کد: function myFunc(){alert(this.value);}که به من بده: کد: function myFunc(){alert(this.value);}پس همیشه پارامتر اول اون شی که this رو داخل تابع خواهد داشت و بقیه پارامتر ها به ترتیب پارامتر هایی هستن که قراره به تابع ارسال بشه... یکم رو این جمله فکر کنین میگیرین منظورمو... :دی حالا میرسیم به جای باحال کارمون... فرض کنین یه تابعی رو داریم که میخوایم هرچی پارامتر بهش ارسال شد مستقیم بفرسته به یه بدبخت دیگه ای... :دی به چه دردی میخوره؟؟ حالا میبینیم... :دی ما به تابعی داریم که سرجاش نشسته و هرچی بهش پارامتر بدن میده به یه تابع دیگه... فک کنین مثل دلال هاست؛ اونا چه نقشی دارن این وسط... [اینم اضاف کنم که "دلال هاست" اسم یه هاستینگ جدید نیست... :| ] بفرمائین؛ ایشون دلال ما هستن: کد: function myFunc(){alert(this.value);}مشاهده میکنین که arguments در اینجا نوشته شده... کاربری که این تابع رو صدا زده احتمالا از myFunc خجالت می کشیده که مستقیما بهش بگه... در این صورت... کد: function myFunc(){alert(this.value);}گفتم تقریبا مساوی! چون اگه مساوی میبودن که ما مرض نداشتیم از این استفاده کنیم... :| arguments چیست؟ یک شبه آرایه (چون همه خصوصیات آرایه هارو نداره؛ مثلا join یا forEach) ست که با صدا زدن هر تابع درون اون به وجود میاد و پارامتر های ارسالی به تابع رو به ترتیب درون خودش داره... با arguments.length میشه فهمید که چن تا پارامتر به تابع ارسال شده که اگه دقت کنین این مورد زیاد کاربرد داره... با یک حلقه for هم به راحتی میشه تمام arguments رو در آورد چون مثلا مقدار arguments[0] همون پارامتر اولیه که به تابعمون ارسال کردیم... نکته جالب ترش اینه که با arguments.callee میشه به تابعی دسترسی داشت که الآن داخلش هستیم. این مورد هم برای زمانی که اسم تابع رو نمیخوایم همش داخلش بنویسیم یا میخوایم بعدا عوضش کنیم و یا موقعی که دسترسی به اسم تابع برامون سخته(حالا بهش میرسیم که یعنی چی) برامون مفیده؛ و بیشتر از همه موقعی که میخوایم تابع بازگشتی بنویسیم؛ مثل الگوریتم فیبونانچی... پس یه بار دیگه توضیح بدم: کد: function myFunc(){alert(this.value);}یعنی داخل هر تابع میشه اسم اونو راحت بدست آورد و باز صداش زد. ببخشید ولی باز هم: کد: function myFunc(){alert(this.value);}در این حالت اگه ما تابع myFunc3 رو صدا بزنیم تا ابد اجرا میشه؛ امیدوارم متوجه شده باشین... برگردیم سراغ بحث خودمون... :دی کد: function myFunc(){alert(this.value);}راستی اگه this خاصی رو مد نظر نداشتید و فقط خواستید پارامترهارو به یه تابع دیگه پاس بدید؛ یا اصلا حوس کردید پارامتر های تابع رو با یه آرایه بهش بدین؛ میتونین به جای اون myObj که من نوشتم و جایگزین مقدار this توی تابع خواهد شد؛ window رو بنویسین... که در این صورت کلا آرمانهای ما که this دادن به تابع بود بر باد خواهد رفت... :دی |
||||||||
| شنبه 22 آذر 1393 - 12:13 |
|
|
حمایت شده:
|
سپاس هاThanks (1) : farnam - |
masterhk
|
پاسخAnswer 7 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی رزبلاگ است دیگر... :| خوب شد یه کپی از پستم داشتم ها... به ترتیب مقدار "کد"های بالا این هاست: کد: function myFunc(){alert(this.value);}کد: this == self == windowکد: this == self == windowکد: value == window.value == window['value']کد: var myObj = {value: 1376 + ":P" }کد: 1376:Pکد: myFunc.call(myObj);کد: function myFunc(param1, param2){alert((param1 + param2) + this.value);}کد: myFunc.call(myObj, 1, 2);کد: 31376:Pکد: function myFunc2(param1, param2){myFunc.apply(myObj, arguments);}کد: myFunc2(3,4) =~ myFunc.call(myObj, 3,4)کد: function myFunc3(){arguments.callee == myFunc3}کد: function myFunc3(){arguments.callee()}کد: myFunc.apply(myObj, [5,6]) == myFunc.call(myObj, 5,6)هر کی خواست جایگزین کنه با اصلی ها... اینم از "کد" داش اسماعیل... ;) |
||||||||
| شنبه 22 آذر 1393 - 12:18 |
|
|
حمایت شده:
|
سپاس هاThanks (4) : admin - farnam - amirmohsen - amalian - |
masterhk
|
پاسخAnswer 8 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی css امروز رو هم بگم که باید برم سراغ کارای خودم دیگه... شرط گذاری در css !! کد: #blink:checked ~ body{background: #ddd;} body{background: #eee;}کد، خود گویای همه چیز است... :دی |
||||||||
| شنبه 22 آذر 1393 - 12:24 |
|
|
حمایت شده:
|
سپاس هاThanks (3) : farnam - amirmohsen - amalian - |
admin
 
|
پاسخAnswer 9 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی اینایی که میگی فقط توی مرورگر های جدید عمل می کنه ... یاد گرفتنشون خیلی خوبه به شرطی که یه چیزی که میسازی یه مثلا توش از canvas باید استفاده بشه. اون جوری بهونه ای نیست که نمیشه بیشتر از این با مرورگر های قدیمی سازگارش کرد. بابت آموزش ها هم ممنون ... ولی سعی کنین همیشه از prefiex ها تا جایی که میشه استفاده کنین تا با تمام مرورگر ها سازگار باشه و اون ها رو یاد بگیرین ... مخصوصا توی جاوا اسکریپت prefix های زیادی هست که میشه یاد گرفتشون ... با تشکر  
!Whatever you DISRESPECT, you'll never have the ability to ACCESS
|
||||||||
| شنبه 22 آذر 1393 - 12:40 |
|
|
حمایت شده:
|
سپاس هاThanks (4) : masterhk - farnam - amirmohsen - amalian - |
admin
|
پاسخAnswer 10 : یک چیزهایی از جاوااسکریپت و شایدم css!! :دی می تونین از سایت caniuse.com کمک بگیرین ببینین توی چه ورژن هایی چه چیزایی ساپورت میشه. با تشکر
!Whatever you DISRESPECT, you'll never have the ability to ACCESS
|
||||||||
| شنبه 22 آذر 1393 - 13:04 |
|
|
حمایت شده:
|
سپاس هاThanks (4) : smaeal - farnam - amirmohsen - amalian - |