Mais conteúdo relacionado
Mais de anees abu-hmaid (20)
Ecmascript 6 (ES6) جافا سكربت (6)
- 1. ﺍﻟﺮﺣﻴﻢ ﺍﻟﺮﺣﻤﻦ ﷲ ﺑﺴﻢ
ﺩﻭﺭﺓ:ECMAScript 6)ﺳﻜﺮﺑﺖ ﻟﻠﺠﺎﻓﺎ ﺗﺤﺪﻳﺪﺍ(
ﺗﻘﺪﻳﻢ:ﺣﻤﻴﺪ ﺃﺑﻮ ﺣﻜﻤﺖ ﺃﻧﻴﺲ.
ﺍﻹﻟﻜﺘﺮﻭﻧﻲ ﺍﻟﺒﺮﻳﺪ:nees.com2aneeshikmat@
ﺍﻹﻟﻜﺘﺮﻭﻧﻲ ﺍﻟﻤﻮﻗﻊ:nees.com2www.
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 2. ﺍﻟﻔﻬﺮﺱ
ﺍﻟﻤﻘﺪﻣﺔ)ﺍﻟﻤﻘﺪﻣﺔ ﻫﺬﻩ ﻓﻲ ﻭﺭﺩ ﻣﺎ ﻋﻠﻰ ﺍﻹﻁﻼﻉ ﺗﻨﺴﻰ ﻻ(
ECMAScript
ECMAScript & Browsers Support
6Running ECMAScript
let Keyword
KeywordConst
Destruct Values
ValuesDefault Function Arguments
operatorJS spread “…”
Template Strings ` `
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 3. ﺍﻟﻔﻬﺮﺱ
Function =>Arrow
Keyword on JSClass
Loopfor of
o” Literal0“
b" Literal0"
Yield Keyword & Fun *()
Set Object
Map Object
JS modules)ﻓﻘﻂ ﺳﺮﻳﻌﺔ ﻧﺒﺬﺓ(
ﺍﻟﺨﺎﺗﻤﺔ
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 4. ﺍﻟﻤﻘﺪﻣﺔ
ﺍﻟﺮﺣﻴﻢ ﺍﻟﺮﺣﻤﻦ ﷲ ﺑﺴﻢ
ﺃﻧﻮﺍﺭ ﺇﻟﻰ ﻭﺍﻟﻮﻫﻢ ﺍﻟﺠﻬﻞ ﻅﻠﻤﺎﺕ ﻣﻦ ﺑﺎﻹﺳﻼﻡ ﺃﺧﺮﺟﻨﺎ ﺍﻟﺬﻱ ﺤﻤﺪ ہﻠﻟ
ﻭﺍﻟﺤﻤﺪ ہﻠﻟ ، ﺍﻟﺸﻬﻮﺍﺕ ﺇﻟﻰ ﺟﻨﺎﺕ ﺍﻟﻘﺮﺑﺎﺕ ﻭﻣﻦ ﻭﺣﻮﻝ ، ﻤﻌﺮﻓﺔ ﻭﺍﻟﻌﻠﻢ
ﻭﺟﻌﻞ ﺍﻹﺳﻼﻡ ﻭﺷﺮﻉ ، ﻋﻮﺟﺎ ﻟﻪ ﻳﺠﻌﻞ ﻭﻟﻢ ﺍﻟﻜﺘﺎﺏ ﻋﺒﺪﻩ ﻋﻠﻰ ﺃﻧﺰﻝ ﺍﻟﺬﻱ
، ﺑﻪ ﺗﻤﺴﻚ ﻟﻤﻦ ًﺎﺃﻣﻨ ﻓﺠﻌﻠﻪ ، ﻏﺎﻟﺒﻪ ﻣﻦ ﻋﻠﻰ ﺃﺭﻛﺎﻧﻪ ﻭﺃﻋﺰ ، ًﺎﻣﻨﻬﺠ ﻟﻪ
ًﺍﻭﻧﻮﺭ ، ﻋﻨﻪ ﺧﺎﺻﻢ ﻟﻤﻦ ًﺍﻭﺷﺎﻫﺪ ، ﺑﻪ ﺗﻜﻠﻢ ﻟﻤﻦ ًﺎﻭﺑﺮﻫﺎﻧ ، ﺩﺧﻠﻪ ﻟﻤﻦ ًﺎﻭﺳﻠﻤ
، ﺗﻮﺳﻢ ﻟﻤﻦ ًﺔﻭﺁﻳ ، ﺗﺪﺑﺮ ﻟﻤﻦ ًﺎﻭﻟﺒ ، ﻋﻘﻞ ﻟﻤﻦ ًﺎﻭﻓﻬﻤ ، ﺑﻪ ﺍﺳﺘﻀﺎء ﻟﻤﻦ
ﻟﻤﻦ ﻭﺛﻘﺔ ، ﺻﺪﻕ ﻟﻤﻦ ﻭﻧﺠﺎﺓ ، ﺍﺗﻌﻆ ﻟﻤﻦ ﻭﻋﺒﺮﺓ ، ﻋﺰﻡ ﻟﻤﻦ ًﺓﻭﺗﺒﺼﺮ
ﺻﺒﺮ ﻟﻤﻦ ﻭﺟﻨﺔ ، ﻓﻮﺽ ﻟﻤﻦ ﻭﺭﺍﺣﺔ ، ﺗﻮﻛﻞ.)ﺍﻟﻨﺎﺑﻠﺴﻲ ﻟﻠﺪﻛﺘﻮﺭ ﺍﻹﺳﻼﻡ ﻓﻲ ﻭﻣﻀﺎﺕ ﻛﺘﺎﺏ ﻣﻘﺪﻣﺔ(
ﺍﻟﺤﺮﻛﺎﺕ ﻭﻋﺪﺩ ،ﻳﻜﻮﻥ ﻣﺎ ﻭﻋﺪﺩ ،ﻛﺎﻥ ﻣﺎ ﻋﺪﺩ ،ﺍﻟﻌﺎﻟﻤﻴﻦ ﺭﺏ ﺤﻤﺪ ہﻠﻟ
ﻭﺍﻟﺴﻜﻮﻥ.
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 5. ﺍﻟﻤﻘﺪﻣﺔ
ﺍﻝ ﻭﻫﻮ ،ﺟﺪﻳﺪ ﻣﻮﺿﻮﻉ ﻋﻦ ،ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ،ﺍﻟﻴﻮﻡ ﺳﻨﺘﺤﺪﺙ
ECMAScript 6ﻋﻦ ﺑﺎﻟﺤﺪﻳﺚ ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﻭﺳﻨﺒﺪﺃ ،
ECMAScriptﺍﻟﻤﺰﺍﻳﺎ ﻋﺎﻟﻢ ﺍﻟﻰ ﺳﻮﻳﺎ ﺳﻨﻨﺘﻘﻞ ﺛﻢ ﻭﻣﻦ ،ﻣﺨﺘﺼﺮ ﺑﺸﻜﻞ
ﺍﻟﺠﺪﻳﺪ ﺍﻹﺻﺪﺍﺭ ﻣﻊ ﺗﻘﺪﻳﻤﻬﺎ ﺗﻢ ﺍﻟﺘﻲ ﻭﺍﻟﺨﺼﺎﺋﺺ)ﺍﻹﺻﺪﺍﺭ6(ﻣﻮﺿﻮﻉ ﻭﻫﻮ
ﺍﻟﻤﺘﻮﺍﺿﻌﺔ ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ.
ﺗﻬﻢ ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ ﻁﺒﻌﺎﻭﺍﻟﻤﺒﺮﻣﺠﻴﻦ ﺍﻟﻤﻄﻮﺭﻳﻦ ﺟﻤﻴﻊﺍﻟﺠﺎﻓﺎ ﻋﻠﻰ ﻳﻌﻤﻠﻮﻥ ﺍﻟﺬﻳﻦ
ﻟﻞ ﺍﻷﻫﻤﻴﺔ ﻭﺗﺰﺩﺍﺩ ،ﺳﻜﺮﺑﺖFRONT ENDﻭﺃﻫﻤﻴﺔ ،ﻷﻫﻤﻴﺘﻬﺎ ،ﻣﻨﻬﻢ
ﺍﻹﺻﺪﺍﺭ ﻫﺬﺍ ﻓﻲ ﺳﻜﺮﺑﺖ ﻟﻠﺠﺎﻓﺎ ﺣﺼﻠﺖ ﺍﻟﺘﻲ ﺍﻟﺘﺤﺪﻳﺜﺎﺕ^^ﻣﻌﻨﺎ ﻓﻜﻮﻧﻮﺍ ،^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 6. ﺍﻟﻤﻘﺪﻣﺔ
ﺍﻟﺪﻭﺭﺓ ﻣﺘﻄﻠﺒﺎﺕ:
(1HTML
(2CSS
(3JS)ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﺟﻴﺪﺓ ﻣﻌﺮﻓﺔ(
(4ﻣﺜﻞ ﻧﺼﻮﺹ ﻣﺤﺮﺭnotepad++ﺇﻧﺘﺮﻧﺖ ﻣﺘﺼﻔﺢ ﻭ:P
*ﻣﻼﺣﻈﺔ:ﻫﺬﺍ ﺑﻞ ،ﻗﺒﻠﻪ ﻣﺎ ﻛﻞ ﺣﺬﻑ ﺟﺪﻳﺪﺓ ﺇﺿﺎﻓﺔ ﺃﻭ ﺟﺪﻳﺪ ﺇﺻﺪﺍﺭ ﻳﻌﻨﻲ ﻻ
ﻳﻜﻮﻥ ﻭﻗﺪ ،ﻣﺎ ﻣﻮﺿﻮﻉ ﻓﻲ ﺍﻟﺠﻮﺍﻧﺐ ﺃﺣﺪ ﻋﻠﻰ ﻭﻗﻊ ﺗﺤﺪﻳﺚ ﻫﻨﺎﻙ ﺃﻥ ﻳﻌﻨﻲ
ﻛﻠﻪ ﻳﻜﻮﻥ ﻭﻗﺪ ،ﺟﻠﻪ... !
*ﻣﻼﺣﻈﺔ2:ECMAScript6ﺏ ﻟﻬﺎ ﻳﺮﻣﺰ:ES6
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 7. ﺍﻟﻤﻘﺪﻣﺔ
*ﻣﻼﺣﻈﺔ3:ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ ﻓﻲ ﺍﻟﺒﺪء ﺗﺎﺭﻳﺦ23-09-2015ﺍﻟﺘﺎﺭﻳﺦ ﺍﻋﺘﻤﺎﺩ ﻭﺗﻢ ،
01-10-2015ﺍﻹﺻﺪﺍﺭ ﺃﻥ ﺍﻋﺘﺒﺎﺭ ﻋﻠﻰ ﺑﺎﻟﺪﻭﺭﺓ ﺍﻷﻣﺜﻠﺔ ﻟﺠﻤﻴﻊ ﻛﺘﺎﺭﻳﺦ
ﺑﺎﻝ ﺍﻟﺨﺎﺹcompilerﻷﻥ ،ﻛﺘﺎﺑﺘﻪ ﺣﻴﻦ ﻓﻲ ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ ﻓﻲ ﻗﻮﻟﻪ ﻳﺘﻢ ﻣﺎ ﻳﺪﻋﻢ
ﻟﻠﺠﺎﻓﺎ ﺍﻟﺠﺪﻳﺪ ﺑﺎﻹﺻﺪﺍﺭ ﺍﻹﻋﺘﻤﺎﺩ ﺇﻁﻼﻕ ﺑﻌﺪ ﻛﺎﻧﺖ ﺍﻟﺘﺎﺭﻳﺦ ﻫﺬﺍ ﻭﻓﻲ ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ
ﺳﻜﺮﺑﺖES6ﺍﻟﻔﻜﺮﺓ ﻭﺳﺘﺘﻀﺢ ،ﺑﻌﺪ ﺗﺪﻋﻤﻬﺎ ﻟﻢ ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﺃﻥ ﺣﻴﻦ ﻓﻲ
ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ،ﺍﻟﻘﺎﺩﻣﺔ ﺑﺎﻟﺸﺮﺍﺋﺢ..
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 8. ECMASCRIPT
ﺍﻝ ﻋﻦ ﻗﻠﻴﻼ ﺃﺗﺤﺪﺙ ﻫﻞ ،ﻣﺤﺘﺎﺭﺍ ﻛﻨﺖ ،ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ ﺑﺎﺩﺉ ﻓﻲ
ECMAScriptﷲ ﻫﺪﺍﻧﻲ ﺛﻢ ،ﻻ ﺃﻡ ﺑﻬﺎ ﺧﺎﺻﺎ ﺟﺰﺋﺎ ﻟﻬﺎ ﺃﻓﺮﻍ ﻭﻫﻞ ،ﻻ ﺃﻡ
ﻋﻦ ﺍﻟﻜﻠﻤﺔ ﻫﺬﻩ ﻏﻴﺎﺏ ﺍﻟﻰ ﻳﻌﻮﺩ ﻭﺍﻟﺴﺒﺐ ،ﻣﻨﻔﺼﻞ ﺟﺰء ﻓﻲ ﺃﺿﻌﻬﺎ ﻷﻥ ﺗﻌﺎﻟﻰ
ﻣﻨﻬﻢ ﺍﻟﻨﺎﺷﺌﻴﻦ ﻭﺧﺼﻮﺻﺎ ،ﻭﺍﻟﻤﻄﻮﺭﻳﻦ ﺍﻟﻤﺒﺮﻣﺠﻴﻦ ﻣﻌﻈﻢ..
ﺍﻝECMAScriptﺍﻟﻤﻌﺎﻳﻴﺮ ﻭﺿﻊ ﻫﺪﻓﻬﺎ ،ﺭﺑﺤﻴﺔ ﻏﻴﺮ ﻋﺎﻟﻤﻴﺔ ﻣﻨﻈﻤﺔ ﻫﻲ
ﺍﻟﺴﻜﺮﺑﺖ ﺑﻠﻐﺎﺕ ﺍﻟﺨﺎﺻﺔJavaScript, Action Script, JScript
ﺍﻟﻰ ﺑﺎﻹﺿﺎﻓﺔ ،ﺑﺎﻟﺴﻜﺮﺑﺖ ﺍﻟﺨﺎﺻﺔ ﻭﺍﻟﻘﻮﺍﻋﺪ ﺍﻟﻌﺎﻡ ﺍﻟﻮﺻﻒ ﻭﺿﻊ ﻋﻠﻰ ﻭﺗﻘﻮﻡ
ﻟﻠﺴﻜﺮﺑﺖ ﺍﻟﺘﻄﻮﻳﺮ ﻋﻦ ﺍﻟﻤﺴﺆﻭﻟﺔ ﺍﻟﺠﻬﺔ ﻫﻲ ﻭﻟﺘﺼﺒﺢ ،ﻭﻣﻜﺎﺗﺒﻬﺎ ﺍﻟﻠﻐﺔ ﺗﻄﻮﻳﺮ
ﺍﻝ ﻣﻊ ﻳﺘﻌﺎﻣﻞ ﺍﻟﺬﻱ ﻟﻠﺠﺎﻧﺐ ﻭﺗﺤﺪﻳﺪﺍClient-Side...ﻭﺍﻝECMAﻫﻲ
ﻝ ﺇﺧﺘﺼﺎﺭEuropean Computer Manufacturers Association (ECMA)
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 9. ECMASCRIPT
ﻭﺍﻝECMAﺗﻄﻮﻳﺮ ﻋﻦ ﻭﺍﻟﻤﺴﺆﻭﻟﺔ ﺭﺑﺤﻴﺔ ﺍﻟﻐﻴﺮ ﺍﻟﻤﻨﻈﻤﺔ ﻓﺈﻧﻪ ﻟﻮﺣﺪﻫﺎ
ﻣﺜﻞ ﺍﻷﺧﺮﻯ ﻭﺍﻷﻣﻮﺭ ﺍﻟﻠﻐﺎﺕ ﻣﻦ ﺍﻟﻌﺪﻳﺪ ﻣﻌﺎﻳﻴﺮ ﻭﻭﺿﻊC++/Cliﺍﻝ ﻭ
HVDﺍﻟﻤﻮﺿﻮﻉ ﻟﺘﺨﺼﻴﺺ ﺍﻹﺳﻢ ﺑﻌﺪ ﺑﺎﻟﻤﺠﺎﻝ ﺗﺤﺪﻳﺪﻫﺎ ﻳﺘﻢ ﻟﺬﻟﻚ ،ﻭﻏﻴﺮﻫﺎ
ﻣﻔﻬﻮﻡ ﻋﻦ ﺍﻟﺴﺎﺑﻘﺔ ﺍﻟﺸﺮﻳﺤﺔ ﻓﻲ ﺫﻛﺮﻧﺎ ﻛﻤﺎECMAScript....
ﺷﺮﻛﺔ ﻗﺒﻞ ﻣﻦ ﻁﻮﺭﺕ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺑﺄﻥ ﻳﻌﻠﻢ ﺟﻤﻴﻌﻨﺎ ﻁﺒﻌﺎNetscape
ﺍﻝ ﺍﻟﻰ ﻣﻨﻬﺎ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺑﻨﻘﻞ ﻗﺎﻣﺖ ﺍﻟﺸﺮﻛﺔ ﻫﺬﻩ ﻟﻜﻦECMA،ﺍﻟﻌﺎﻟﻤﻴﺔ
ﻋﻠﻴﻬﺎ ﺳﻴﻌﻤﻞ ﻟﻤﻦ ﻋﺎﻟﻤﻴﺎ ﻭﺍﺿﺤﺔ ﻭﻣﻌﺎﻳﻴﺮ ﺃﺳﺲ ﻭﺿﻊ ﻟﻴﺘﻢ..ﻋﺎﻡ ﻓﻲ ﻫﺬﺍ ﻭﻛﺎﻥ
1996ﺷﻬﺮ ﻓﻲ ﺇﺻﺪﺍﺭ ﺃﻭﻝ ﻭﺻﺪﺭ ،6ﻋﺎﻡ1997...
ﻣﻬﺎﻡ ﻣﻦ ﺗﻘﺪﻣﻪ ﻭﻣﺎ ،ﺗﺸﻴﺮ ﻣﺎﺫﺍ ﻭﺍﻟﻰ ،ﺍﻟﻜﻠﻤﺔ ﻫﺬﻩ ﺗﻌﻨﻲ ﻣﺎﺫﺍ ﻋﺮﻓﻨﺎ ﻧﻜﻮﻥ ﻭﺑﻬﺬﺍ ،ﻭﺍﻵﻥ
ﻣﻮﺿﻮﻋﻨﺎ ﻷﻧﻬﺎ ﺧﺼﻮﺻﺎ ﺳﻜﺮﺑﺖ ﻭﺍﻟﺠﺎﻓﺎ ﻋﻤﻮﻣﺎ ﺍﻟﺴﻜﺮﺑﺖ ﻟﻤﻄﻮﺭﻳﻦ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 10. ECMASCRIPT&BROWSERS
ﻟﻴﺘﻢ ﺯﻣﻨﻴﺔ ﻓﺘﺮﺓ ﻫﻨﺎﻙ ﺃﻥ ﺍﻟﻤﻌﻠﻮﻡ ﻣﻦ ﻓﺈﻧﻪ ،ﻣﻜﺘﺒﺔ ﺃﻱ ﺗﺤﺪﻳﺚ ﺃﻭ ﺗﻄﻮﻳﺮ ﻋﻨﺪ
ﻣﺜﺎﻝ ﻭﺃﻗﺮﺏ ،ﺍﻟﻤﻀﺎﻓﺔ ﺍﻟﺠﺪﻳﺪﺓ ﺍﻟﺨﺼﺎﺋﺺ ﺟﻤﻴﻊ ﻟﺘﺨﺪﻡ ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﺗﻄﻮﻳﺮ
ﺍﻝ ﻫﻨﺎCSS3ﺩﻋﻢ ﺗﺤﺎﻭﻝ ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﻓﺈﻥ ،ﻭﺍﻋﺘﻤﺎﺩﻫﺎ ،ﺗﻄﻮﻳﺮﻫﺎ ﻓﻤﻨﺬ ،
ﻣﻤﻜﻦ ﺷﻜﻞ ﺑﺄﻛﺒﺮ ﺍﻟﺨﺼﺎﺋﺺ..ﺟﻞ ﺗﺪﻋﻢ ﻟﻢ ﻣﺘﺼﻔﺤﺎﺕ ﻫﻨﺎﻙ ،ﺍﻵﻥ ﻭﺍﻟﻰ
ﻣﻦ ﻣﺠﻤﻮﻋﺔ ﺗﺪﻋﻢ ﻣﻌﻈﻤﻬﺎ ﻓﻲ ﺍﻟﺮﺋﻴﺴﻴﺔ ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﻟﻜﻦ ،ﺍﻟﺨﺼﺎﺋﺺ
ﻫﺬﻩ ﺍﻟﻰ ﻭﻭﺻﻮﻻ ،ﻭﺍﺳﺘﺨﺪﺍﻣﻬﺎ ﻭﺟﻮﺩﻫﺎ ﺍﻟﺒﺪﺍﻫﺔ ﻣﻦ ﺍﻵﻥ ﺃﺻﺒﺤﺖ ﺍﻟﺨﺼﺎﺋﺺ
ﺍﻝ ﻳﺴﺘﺨﺪﻡ ﻟﻢ ﻣﻨﺎ ﻣﻦ ،ﺍﻟﻠﺤﻈﺔCSS3ﺭﺍﺋﻌﺔ ﻭﺧﺪﻣﺎﺕ ﻣﺰﺍﻳﺎ ﻣﻦ ﺗﻘﺪﻣﻪ ﻭﻣﺎ..
ﻣﺪﻋﻮﻣﺔ ﻟﻴﺴﺖ ﺳﻜﺮﺑﺖ ﻟﻠﺠﺎﻓﺎ ﺍﻟﺠﺪﻳﺪﺓ ﺍﻟﺨﺼﺎﺋﺺ ﻓﺈﻥ ،ﺍﻟﻘﻴﺎﺱ ﻧﻔﺲ ﻭﻋﻠﻰ
ﻳﻤﻜﻨﻚ ،ﺍﻟﺠﺪﻳﺪﺓ ﺍﻟﻤﺰﺍﻳﺎ ﻫﺬﻩ ﺩﻋﻢ ﻭﻟﻀﻤﺎﻥ ،ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﺟﻤﻴﻊ ﻣﻦ ﻛﺎﻣﻞ ﺑﺸﻜﻞ
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡCompilerﻧﻘﻮﻡ ﻛﻤﺎ ،ﻟﻪ ﺭﺍﺑﻂ ﺧﻼﻝ ﻣﻦ ﺳﻜﺮﺑﺖ ﻟﻠﺠﺎﻓﺎ ﺍﻟﻘﺎﺭﺉ
ﺑﺘﻀﻤﻴﻦFontﻣﺜﻼ ﺟﻮﺟﻞ ﻣﻦ)ﺍﻟﺘﺸﺒﻴﻪ ﻓﺎﺭﻕ ﻣﻊ.(
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 11. ECMASCRIPT&BROWSERS
ﻣﻦ ﻣﻌﻴﻨﺔ ﺳﻤﺔ ﺃﻭ ﺧﺎﺻﻴﺔ ﺗﺪﻋﻢ ﺍﻟﺘﻲ ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﻋﻠﻰ ﻟﻺﻁﻼﻉ ،ﻭﺍﻵﻥ
ﺍﻝ ﻭﺣﺘﻰ ،ﻋﺪﻣﻬﺎCompilerﺧﺼﺎﺋﺺ ﻣﻦ ﻳﺪﻋﻢ ﻛﻢ ﺑﺘﻀﻤﻴﻨﻪ ﺳﻨﻘﻮﻡ ﺍﻟﺬﻱ
ﺍﻟﺮﺍﺑﻂ ﻫﺬﺍ ﺍﻟﻰ ﺍﻟﺪﺧﻮﻝ ﺳﻮﻯ ﻋﻠﻴﻨﺎ ﻣﺎ:
/6table/es-https://kangax.github.io/compat
)ﻣﻼﺣﻈﺔ:ﺍﻟﺠﺪﻭﻝ ﺗﺼﻔﺢ ﻣﻦ ﺗﺘﻤﻜﻦ ﺣﺘﻰ ﻭﻟﻠﻴﺴﺎﺭ ﻟﻠﻴﻤﻴﻦ ﺍﻟﺴﻬﻢ ﺣﺮﻙ(
ﻟﻠﺨﺼﺎﺋﺺ ﺍﻟﻤﻮﻗﻊ ﻋﻦ ﺻﻮﺭﺓ ﻟﻤﺸﺎﻫﺪﺓ ﺍﻟﺘﺎﻟﻴﺔ ﻟﻠﺸﺮﻳﺤﺔ ﺗﻨﺘﻘﻞ ﺃﻥ ﻗﺒﻞ ﻭﺍﻵﻥ
ﻓﻲ ﺩﻋﻤﻬﺎ ﺗﻢ ﺍﻟﺮﺋﻴﺴﻴﺔ ﺍﻟﺴﻤﺎﺕ ﺃﻭ ﺍﻟﺮﺋﻴﺴﻴﺔ ﺍﻟﺨﺼﺎﺋﺺ ﻓﺈﻥ ،ﺍﻟﻤﺪﻋﻮﻣﺔ
ﺍﻟﺮﺋﻴﺴﻴﺔ ﺍﻟﻤﺘﺼﻔﺤﺎﺕ..ﺃﻥ ﻣﺜﻼ ﻓﻼﺣﻆ40%ﻣﺘﻔﻖ ﻳﻜﻮﻥ ﻗﺪ ﺍﻟﺨﺼﺎﺋﺺ ﻣﻦ
ﺍﻟﻤﺘﺼﻔﺤﺎﺕ ﺑﻴﻦ ﻣﻦ ﺍﻵﻥ ﻋﻠﻴﻬﺎ..ﺧﺼﺎﺋﺺ ﺍﺳﺘﺨﺪﺍﻡ ﻓﻲ ﺗﻌﻤﻘﺖ ﻛﻠﻤﺎ ﻟﻜﻦ
ﻣﺸﻬﻮﺭﺓ ﻏﻴﺮ ﺃﻭ ﺟﺪﻳﺪﺓ..ﻣﻦ ﻣﺪﻋﻮﻣﺔ ﺃﻭ ،ﻣﺪﻋﻮﻣﺔ ﻏﻴﺮ ﺍﻟﺨﺎﺻﺔ ﻓﺴﺘﻜﻮﻥ
ﺍﻟﻜﻞ ﻣﻦ ﻭﻟﻴﺲ ﻣﺘﺼﻔﺢ...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 13. RUNNING ECMASCRIPT 6
ﻣﻦ ﺑﺪﻋﻢ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺑﺮﻣﺠﺔ ﻓﻲ ﷲ ﺑﺮﻛﺔ ﻋﻠﻰ ﻟﻨﺒﺪء ،ﻭﺍﻵﻥES6^_^
ﺍﻝ ﺑﺘﺤﻤﻴﻞ ﻧﻘﻮﻡ ﺃﻭﻻ ﻋﻠﻴﻨﺎ ،ﺻﺤﻴﺢ ﺑﺸﻜﻞ ﻟﻨﺒﺪﺃbabelﻣﻦ ﺑﺎﻟﻤﺘﺼﻔﺢ ﺍﻟﺨﺎﺹ
ﺍﻟﺮﺍﺑﻂ ﻫﺬﺍ ﺧﻼﻝ) :ﺍﻝBabelﺳﻜﺮﺑﺖ ﺟﺎﻓﺎ ﻫﻮcompiler: (
https://babeljs.io/docs/setup/#babel_in_browser
ﺍﻝ ﻟﺘﺤﻤﻴﻞ ﻁﺒﻌﺎbabelﺍﻝ ﺑﺘﺤﻤﻴﻞ ﺗﻘﻮﻡ ﺃﻥ ﻳﺠﺐnpm..
ﺍﻝ ﺗﺤﻤﻴﻞ ﺛﻢ ﻭﻣﻦ ﺑﺎﻟﺒﺤﺚ ﺗﻘﻮﻡ ﺑﺄﻥ ﻭﺃﻧﺼﺤﻚnpm)..ﺍﻝ ﺧﻼﻝ ﻣﻦnpm
ﺍﻷﻣﺮ ﺍﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻨﻨﺎnpmﺍﻝ ﻟﺘﻨﺼﻴﺐbabelﺍﻷﻣﺮ ﻁﺮﻳﻖ ﻋﻦ
npm install babel(ﺍﻟﻰ ﺗﺬﻫﺐ ﺛﻢbable-coreﺍﻝ ﻣﻠﻒ ﻭﺗﺄﺧﺬ
browser.js) ....ﺍﻟﺪﻭﺭﺓ ﺑﻬﺬﻩ ﺍﻟﺨﺎﺹ ﺍﻟﻤﺠﻠﺪ ﻓﻲ ﺍﻟﻤﻠﻒ ﺑﻮﺿﻊ ﺳﺄﻗﻮﻡ ﻁﺒﻌﺎ
ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ(..
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 14. RUNNING ECMASCRIPT 6
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﻁﺮﻳﻘﺔBabelﻫﻲ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
ﺍﻝ ﺑﺘﻀﻤﻴﻦ ﺗﻘﻢ ﻟﻢ ﺣﺎﻝ ﻓﻲ ﺍﻟﺨﻄﺄ ﻫﺬﺍ ﺷﺎﻫﺪBabel)ﻣﺜﺎﻝ ﺗﻄﺒﻴﻖ ﻟﻨﺎﺗﺞ ﺍﺳﺘﺒﺎﻕ ﻫﺬﺍ(
- 16. LET KEYWORD
ﻛﻠﻤﺔLETﻣﻌﻴﻦ ﻧﻄﺎﻕ ﺗﻌﺮﻳﻒ ﻭﻫﻲ ،ﻣﻬﻤﺔ ﺑﻌﻤﻠﻴﺔ ﻟﺘﻘﻮﻡ ﺇﺿﺎﻓﺘﻬﺎ ﺗﻢ
)Block Scope(ﺍﺳﺘﺨﺪﺍﻡ ﻳﺘﻢ ﺍﻟﻤﺘﻐﻴﺮ ﺃﻥ ﺃﻱ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﻟﻠﻤﺘﻐﻴﺮﺍﺕ
ﺍﻝ ﻫﺬﺍ ﺩﺍﺧﻞ ﻣﻌﻬﺎ ﻭﺍﻟﺘﻌﺎﻣﻞ ﻗﻴﻤﺘﻪscopeﺍﻝ ﺧﺎﺭﺝ ﻭﻳﻌﺘﺒﺮ ،Scopeﻏﻴﺮ
ﻣﻌﺮﻑ..^_^ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﺍﺳﺘﺨﺪﻣﺖ ﺃﻧﻨﻲ ﻫﻨﺎ ﻻﺣﻆlet
ﺍﻝ ﻭﺍﺳﺘﺨﺪﻣﺖvarﻭﻻﺣﻆ ،
ﺍﻝ ﺃﻥalertﺍﻝ ﺩﺍﺧﻞscope
ﺍﻝ ﻣﻦ ﻛﻞ ﻧﺘﻴﺠﺔ ﺑﺎﻅﻬﺎﺭ ﻗﺎﻣﺖ
XﻭﺍﻝYﺍﻝ ﺧﺎﺭﺝ ﺃﻣﺎ ،scope
ﻟﻞ ﺍﻟﻨﺎﺗﺞ ﻓﻜﺎﻥx=undefined
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 17. CONST KEYWORD
ﺍﻟﻤﺤﺠﻮﺯﺓ ﺍﻟﻜﻠﻤﺔconstﺃﺧﺮﻯ ﻟﻐﺎﺕ ﻓﻲ ﺷﺎﻫﺪﻧﺎﻫﺎ ﻟﻄﺎﻟﻤﺎ ﻛﻠﻤﺎ ،
ﻫﻮ ﻭﻛﻤﺎ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﺍﺳﺘﺨﺪﺍﻣﻬﺎ ﺑﺎﻹﻣﻜﺎﻥ ﻳﻜﻦ ﻟﻢ ﻟﻜﻨﻪ ،ﻭﺍﺳﺘﺨﺪﻣﻨﺎﻫﺎ
ﺍﻝ ﻓﺈﻥ ،ﻟﺪﻳﻨﺎ ﻣﻌﺮﻭﻑconstﺍﻟﻰ ﺗﺸﻴﺮ“ﺍﻟﺜﺎﺑﺖ”ﻳﺠﻮﺯ ﻻ ﺍﻟﻘﻴﻤﺔ ﻫﺬﻩ ﺃﻥ ﺃﻱ ،
ﺍﻟﻀﺮﻳﺒﺔ ﻗﻴﻤﺔ ﻣﺜﻞ ،ﺑﻬﺎ ﺍﻟﻤﺴﺎﺱ ﺃﻭ ﺗﻐﻴﻴﺮﻫﺎ16) %ﺍﻷﺭﺩﻥ ﻓﻲ(ﻳﻌﻨﻲ ﻭﻫﺬﺍ ،
ﺧﻼﻝ ﻣﻦ ﺳﺘﺘﻢ ،ﻟﻬﺎ ﺍﻟﻀﺮﻳﺒﺔ ﺣﺴﺎﺏ ﺳﻴﺘﻢ ﻋﻤﻠﻴﺎﺕ ﻣﻦ ﺗﻨﻔﻴﺬﻩ ﺳﻴﺘﻢ ﻣﺎ ﺟﻤﻴﻊ ﺃﻥ
ﺗﻐﻴﻴﺮ ﻳﻌﻨﻲ ﻓﻬﺬﺍ ،ﺍﻟﻀﺮﻳﺒﺔ ﻗﻴﻤﺔ ﺗﻐﻴﻴﺮ ﺃﺭﺩﺕ ﻟﻮ ﺍﻟﻮﻗﺖ ﻭﺑﺬﺍﺕ ،ﺍﻟﻀﺮﻳﺒﺔ ﺛﺎﺑﺖ
ﺍﻝ ﻗﻴﻤﺔconstﺑﺘﻌﺮﻳﻔﻪ ﻗﻤﻨﺎ ﺍﻟﺬﻱ*^_....
ﺍﻵﻥ ﻭﺍﻟﺴﺆﺍﻝ..ﺍﻝ ﻗﻴﻤﺔ ﺑﻪ ﻭﻧﻀﻊ ﻣﺘﻐﻴﺮ ﺑﺘﻌﺮﻳﻒ ﻧﻘﻮﻡ ﺃﻥ ﺍﻟﻤﻤﻜﻦ ﻣﻦ ﺍﻟﻴﺲ
16%ﺍﻝ ﺇﺿﺎﻓﺔ ﺍﻟﻰ ﺍﻟﺤﺎﺟﺔ ﺩﻭﻥconst؟ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺇﺻﺪﺍﺭ ﺍﻟﻰ
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 18. CONST KEYWORD
ﺍﻟﺠﻮﺍﺏ:ﺣﻤﺎﻳﺔ ﻫﻨﺎﻙ ﻓﻬﻞ ،ﻣﺘﻐﻴﺮ ﻋﻦ ﺗﺘﺤﺪﺙ ﺃﻧﻚ ﻁﺎﻟﻤﺎ ﻟﻜﻦ ،ﺫﻟﻚ ﻳﻤﻜﻨﻨﺎ ﻧﻌﻢ
،ﺑﻚ ﺍﻟﺨﺎﺻﺔ ﺍﻟﺒﺮﻣﺠﻴﺔ ﺍﻟﺸﻴﻔﺮﺓ ﻗﺒﻞ ﻣﻦ ﺗﻐﻴﻴﺮ ﺩﻭﻥ ﺛﺎﺑﺘﺔ ﺍﻟﻘﻴﻤﺔ ﺣﻔﻆ ﻟﻚ ﺗﻀﻤﻦ
؟ ﺛﺎﻟﺚ ﻁﺮﻑ ﻣﻦ ﺃﺧﺮﻯ ﺑﺮﻣﺠﻴﺔ ﺷﻴﻔﺮﺓ ﺃﻭ!
ﺍﻝ ﺧﻼﻝ ﻣﻦconstﻭﻣﻦ ﺍﻟﻤﺤﺠﻮﺯﺓ ﺍﻟﻜﻠﻤﺔ ﻫﺬﻩ ﺍﺳﺘﺨﺪﺍﻡ ﻫﻮ ﻓﻌﻠﻪ ﻋﻠﻴﻚ ﻣﺎ ﻛﻞ
ﺗﻌﺪﻳﻞ ﺃﻱ ﻣﻦ ﺍﻟﻘﻴﻤﺔ ﻟﻬﺬﻩ ﺍﻟﺤﻤﺎﻳﺔ ﻋﻤﻠﻴﺔ ﺍﻟﺒﺮﻣﺠﻴﺔ ﺍﻵﻟﺔ ﺳﺘﺘﻮﻟﻰ ﺛﻢ^_^..
ﻣﺜﺎﻻ ﻟﻨﺸﺎﻫﺪ ﻭﺍﻵﻥ:
ﻣﺜﺎﻝ1:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 20. CONST KEYWORD
ﻣﺜﺎﻝ3:ﺍﻝ ﺃﻥ ﻭﻫﻲ ،ﻣﻬﻤﺔ ﻟﻨﻘﻄﺔ ﻫﻨﺎ ﺇﻧﺘﺒﻪconstﺍﻝ ﻣﺜﻞ ﺗﻌﺮﻳﻔﻪ ﻳﺘﻢ ﻋﻨﺪﻣﺎ
taxﺳﻴﻜﻮﻥ ، ﻫﻨﺎGlobalﻗﻤﻨﺎ ﺍﺫﺍ ﻟﻜﻦ ،ﺗﻌﻠﻤﻨﺎ ﻛﻤﺎ ﻗﻴﻤﺘﻪ ﺍﺳﺘﺨﺪﺍﻡ ﻭﻳﻤﻜﻦ
ﺍﻝ ﺗﻌﺮﻳﻒ ﺑﺈﻋﺎﺩﺕconstﺩﺍﺧﻞscopeﻫﺬﺍ ﺿﻤﻦ ﺍﻟﺜﺎﺑﺖ ﺑﺎﻧﺸﺎء ﻓﺴﻴﻘﻮﻡ ،
ﺍﻝscopeﺍﻝ ﻗﻴﻤﺔ ﺍﺳﺘﺨﺪﺍﻡ ﺃﻭ ﺧﺎﺭﺟﺎ ﻗﻴﻤﺘﻪ ﺍﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻨﻨﺎ ﻭﻻGlobal
constﺍﻝ ﻫﺬﺍ ﺩﺍﺧﻞblock...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 21. CONST KEYWORD
ﻭﺍﻵﻥ..ﺑﺎﻝ ﺍﻟﻤﺘﻌﻠﻘﺔ ﺍﻷﻣﺜﻠﺔ ﺟﻤﻴﻊ ﻟﻨﺸﺎﻫﺪconstﻋﻠﻰ ﻟﺬﻛﺮﻫﺎ ﺗﻄﺮﻗﻨﺎ ﻭﺍﻟﺘﻲ
ﷲ ﺑﺮﻛﺔ^ _^
ﻣﻼﺣﻈﺔ:ﺍﻟﺸﺮﻁ ﺟﻤﻠﺔ ﺍﺳﺘﺨﺪﺍﻡif(true)ﻣﺠﻤﻮﻋﺔ ﺗﻮﺿﻴﺢ ﻓﻘﻂ ﻣﻨﻪ ﺍﻟﻬﺪﻑ
ﺿﻤﻦ ﺍﻷﻣﺜﻠﺔblockﺍﻟﺘﻨﻮﻳﻪ ﻭﺟﺐ ﻭﻟﺬﻟﻚ ،ﺃﺳﻠﻮﺏ ﺑﺄﺳﻬﻞ ﻣﻌﻴﻦ_^*
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 22. DESTRUCT VALUES
ﻋﺪﺓ ﻹﺭﺟﺎﻉ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﻧﺴﺘﺨﺪﻣﻬﺎ ﻛﻨﺎ ﺍﻟﺘﻲ ﺍﻟﻄﺮﻕ ﻣﻦ ﺍﻟﻜﺜﻴﺮ ﻫﻨﺎﻙ
ﻣﻦ ﺍﻟﻘﻴﻢfunction)Function Return Multiple Values(
ﺍﻝ ﻣﻔﻬﻮﻡ ﻅﻬﺮ ﻫﻨﺎ ﻭﻣﻦDestruct-ﺍﻟﺘﻔﻜﻴﻚ-ﺑﺠﻌﻞ ﺑﺪﻭﺭﻩ ﻳﻘﻮﻡ ﻭﺍﻟﺬﻱ ،
ﺃﺧﺮﻯ ﺑﺮﻣﺠﻴﺔ ﺷﻴﻔﺮﺓ ﺃﻭ ﻟﻤﺘﻐﻴﺮﺍﺕ ﺍﻟﺮﺍﺟﻌﺔ ﺍﻟﻘﻴﻢ ﺍﺳﻨﺎﺩ ﻧﺎﺣﻴﺔ ﻣﻦ ﺍﺳﻬﻞ ﺍﻷﻣﻮﺭ
ﺍﻟﻘﻴﻢ ﻫﺬﻩ ﺗﺴﺘﻘﺒﻞ..ﺍﻟﺨﺎﺻﺔ ﺍﻟﻘﻴﻤﺔ ﺗﺒﺪﻳﻞ ﺧﻼﻟﻬﺎ ﻣﻦ ﺑﺈﻣﻜﺎﻧﻚ ﺃﺻﺒﺢ ﺃﻧﻪ ﻛﻤﺎ
ﺛﺎﻟﺚ ﻣﺘﻐﻴﺮ ﺗﻌﺮﻳﻒ ﺩﻭﻥ ﺑﻤﺘﻐﻴﺮﻳﻦ^_^...ﻋﻠﻴﻜﻢ ﻧﻄﻴﻞ ﻻ ﻭﺣﺘﻰ..ﺩﻋﻮﻧﺎ
ﺍﻟﻤﻮﺿﻮﻉ ﻋﻠﻰ ﺳﻬﻼ ﻣﺜﺎﻻ ﻧﺸﺎﻫﺪ:P_^) :*ﻣﺜﺎﻝ1( :
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 23. DESTRUCT VALUES
ﻣﺜﺎﻝ2:ﺍﻟﻰ ﺍﻟﺤﺎﺟﺔ ﺩﻭﻥ ﻣﺘﻐﻴﺮﻳﻦ ﺑﻴﻦ ﻟﻠﻘﻴﻢ ﺗﺒﺪﻳﻞ ﺑﻌﻤﻠﻴﺔ ﺳﻨﻘﻮﻡ ،ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﻓﻲ
ﺟﺪﻳﺪ ﺛﺎﻟﺚ ﻣﺘﻐﻴﺮ ﺍﺳﺘﺨﺪﺍﻡ^_^ﺍﻟﺘﺎﻟﻲ ﺍﻟﻤﺜﺎﻝ ﻓﻲ ﻛﻤﺎ ﺗﺘﻢ ﺑﺒﺴﺎﻁﺔ ﺍﻟﻌﻤﻠﻴﺔ ﻫﺬﻩ ،:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 24. DESTRUCT VALUES
ﻣﺜﺎﻝ3:،ﺭﺍﺋﻌﺔ ﻣﺰﻳﺔ ﺃﻳﻀﺎ ﻓﻬﻨﺎﻙ ،ﺍﻟﺴﺎﺑﻘﺔ ﺍﻷﻣﺜﻠﺔ ﻓﻲ ﺫﻛﺮﻧﺎﻩ ﻣﺎ ﺍﻟﻰ ﺑﺎﻹﺿﺎﻓﺔ
ﺩﺍﺧﻞ ﺍﻟﻤﻮﺟﻮﺩﺓ ﺍﻟﻘﻴﻢ ﺍﺳﻨﺎﺩ ﺇﻣﻜﺎﻧﻴﺔ ﻭﻫﻲobjﺍﻝ ﺧﻼﻝ ﻣﻦ ﻣﺘﻐﻴﺮﺍﺕ ﺍﻟﻰ
Destructﺍﻝ ﺍﺳﻢ ﺑﻨﻔﺲ ﺍﻟﻤﺘﻐﻴﺮﺍﺕ ﺍﺳﻢ ﻭﺿﻊ ﺧﻼﻝ ﻣﻦ ﻫﺬﺍ ﻭﻳﻜﻮﻥ ،key
ﺍﻝ ﺩﺍﺧﻞ ﺍﻟﻤﻮﺟﻮﺩobject..ﻣﺎ ﺑﻴﻦ ﻭﻣﻄﺎﺑﻘﺔ ﺑﺤﺚ ﻋﻤﻠﻴﺔ ﻫﻲ ﻭﺍﻟﻌﻤﻠﻴﺔ
ﺍﻝ ﻭﺑﻴﻦ ﻣﺘﻐﻴﺮﺍﺕ ﻣﻦ ﻭﺿﻌﺘﻪkeyﺍﻝ ﺩﺍﺧﻞ ﺍﻟﻤﺴﺘﺨﺪﻣﺔobjectﻓﺈﻧﻪ ﻭﺑﻬﺬﺍ ،
ﺍﻝ ﺗﺸﺎﺑﻪ ﺇﻥkeyﺍﻟﻘﻴﻤﺔ ﺍﺳﻨﺎﺩ ﻓﻴﺘﻢ ،ﺍﻟﻤﺘﻐﻴﺮ ﻭﺍﺳﻢ...ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 26. DEFAULT FUNCTION
ARGUMENTS VALUES
ﻗﻴﻤﺔ ﻭﺿﻊ ﺇﻣﻜﺎﻧﻴﺔ ﻫﻲ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﻧﻔﺘﻘﺪﻫﺎ ﻛﻨﺎ ﺍﻟﺘﻲ ﺍﻷﻣﻮﺭ ﻣﻦ
ﻟﻞ ﺇﻓﺘﺮﺍﺿﻴﺔArgsﻓﻲ ﺍﻟﻤﺴﺘﺨﺪﻣﺔfunctionﺇﻧﺘﻬﻰ ﺍﻷﻣﺮ ﻫﺬﺍ ﻟﻜﻦ ،ﻣﻌﻴﻦ
ﺃﻭ ،ﻣﺒﺎﺷﺮﺓ ﻗﻴﻤﺔ ﺷﻜﻞ ﻋﻠﻰ ﺇﻓﺘﺮﺍﺿﻴﺔ ﻗﻴﻤﺔ ﺇﺿﺎﻓﺔ ﺍﻵﻥ ﺑﺎﻹﻣﻜﺎﻥ ﻭﺃﺻﺒﺢ ،ﺍﻵﻥ
ﺍﺭﺳﺎﻝ ﺍﻟﻤﻤﻜﻦ ﻣﻦ ﺃﻧﻪ ﻛﻤﺎ ،ﺣﺴﺎﺑﻴﺔ ﻋﻤﻠﻴﺔ ﺷﻜﻞ ﻋﻠﻰundefinedﺃﻧﻬﺎ ﻋﻠﻰ
ﺇﻓﺘﺮﺍﺿﻴﺔ ﻗﻴﻤﺔ^_^...ﻭﻓﻀﻠﻪ ﻧﻌﻤﻪ ﻋﻠﻰ ﺤﻤﺪ ہﻠﻟ^^
ﺳﻬﻞ ﺑﺸﻜﻞ ﺍﻹﻓﺘﺮﺍﺿﻴﺔ ﺍﻟﻘﻴﻢ ﻭﺿﻊ ﻳﺘﻢ ﻛﻴﻒ ﻻﺣﻆ^_^ﻭﺟﻮﺩ ﺃﻳﻀﺎ ﻭﻻﺣﻆ ،
ﻋﻤﻠﻴﺔconcatﺍﻝ ﺩﺍﺧﻞ ﺗﺨﺰﻥfﺍﻟﺤﺴﺎﺑﻴﺔ ﺍﻟﻌﻤﻠﻴﺎﺕ ﺍﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻨﻚ ﺃﻱ ،
ﺍﻟﻘﻴﻢ ﻹﺳﻨﺎﺩ^^)..ﺍﻟﺘﺎﻟﻴﺔ ﺑﺎﻟﺸﺮﻳﺤﺔ ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ(
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 28. JS SPREAD “…” OPERATOR
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﻳﺘﻢSpread Peratorﺍﻟﻤﺘﻐﻴﺮﺍﺕ ﻣﻦ ﻧﻬﺎﺋﻲ ﻻ ﻋﺪﺩ ﻟﺘﻌﺮﻳﻒ
ﻏﻴﺮ ﻋﺪﺩ ﺑﺈﺭﺳﺎﻝ ﺍﻟﻘﻴﺎﻡ ،ﺃﺩﻕ ﻭﺑﻤﻌﻨﻰ ،ﻣﻌﻴﻨﺔ ﻟﻮﻅﻴﻔﺔ ﺍﺳﺘﺨﺪﺍﻣﻬﺎ ﻳﻤﻜﻨﻨﻲ ﺍﻟﺘﻲ
ﺍﻝ ﻣﻦ ﻣﻌﻴﻦArgsﻋﻤﻠﻴﺔ ﻓﻜﺮﺓ ،ﺍﻟﻌﻤﻠﻴﺔ ﻫﺬﻩ ﻟﻤﺜﻞ ﺍﻟﻤﻔﻴﺪﺓ ﺍﻷﻣﺜﻠﺔ ﺃﺷﻬﺮ ﻭﻣﻦ ،
ﺟﻤﻌﻬﺎ ﺍﻟﻤﺮﺍﺩ ﺍﻷﺭﻗﺎﻡ ﻋﺪﺩ ﻣﻌﺮﻭﻑ ﺍﻟﻐﻴﺮ ﺍﻟﺠﻤﻊ..ﻧﻘﻮﻝ ﺍﻟﺤﺎﺳﺒﺔ ﺍﻵﻟﺔ ﻣﺜﻞ
5+6+7+55..ﺑﺠﻤﻞ ﻗﻤﺖ ﻓﻬﻨﺎ4ﺑﺠﻤﻊ ﻳﻘﻮﻡ ﻗﺪ ﻭﻏﻴﺮﻱ ،ﻗﻴﻢ10ﻓﻬﻞ ،ﻗﻴﻢ
؟ ﺇﺩﺧﺎﻟﻬﺎ ﺍﻟﻤﻤﻜﻦ ﺍﻟﻘﻴﻢ ﺑﻌﺪﺩ ﺩﻭﺍﻝ ﺇﻧﺸﺎء ﺍﻟﻤﻌﻘﻮﻝ ﻣﻦ!
ﺍﻝ ﻣﻨﻬﺎ ﺃﺧﺮﻯ ﺑﺮﻣﺠﻴﺔ ﺃﻓﻜﺎﺭ ﺍﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻨﻚ ﻟﻜﻦ ،ﻻ ﻁﺒﻌﺎ ﺍﻟﺠﻮﺍﺏ
SPREAD^_^ﺛﻤﻨﺎ ﺇﺫﺍ ،ﺃﻳﻀﺎ ﺑﻬﺎ ﺍﻟﺠﻤﻴﻠﺔ ﻭﺍﻹﺳﺘﺨﺪﺍﻣﺎﺕ ﺍﻷﻓﻜﺎﺭ ﻭﻣﻦ ،
ﺑﻮﺿﻊ…arrayNameﻋﻠﻰ ﻓﺮﻁﺖ ﻭﻛﺄﻧﻬﺎ ﺳﺘﻌﻤﺎﻝ ﺍﻟﻤﺼﻔﻮﻓﺔ ﻫﺬﻩ ﻓﺈﻥ
ﻣﺜﻞ ﻣﺘﻐﻴﺮﺍﺕ ﺷﻜﻞ[a, b]ﻭﻛﺄﻧﻬﺎ ﺳﺘﺼﺒﺢa, bﻣﺜﺎﻻ ﻗﻠﻴﻞ ﺑﻌﺪ ﻭﺳﻨﺮﻯ
ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ﺍﻟﺤﺮﻛﺔ ﻫﺬﻩ ﻣﺜﻞ ﺣﺮﻛﺔ ﺃﻫﻤﻴﺔ ﻳﻮﺿﺢ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 29. JS SPREAD “…” OPERATOR
ﻣﺜﺎﻝ1:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 30. JS SPREAD “…” OPERATOR
ﻣﺜﺎﻝ2:ﻭﻣﻦ ،ﺍﻟﺪﻭﺭﺍﺕ ﻋﻨﺎﻭﻳﻦ ﺗﺤﺘﻮﻱ ﻣﺼﻔﻮﻓﺔ ﺑﺈﻧﺸﺎء ﻗﻤﺖ ﺃﻧﻨﻲ ﻫﻨﺎ ﻻﺣﻆ
ﺷﻜﻞ ﻋﻠﻰ ﺃﺭﺳﻠﺘﻬﺎ ﺛﻢArgs^_^.
ﻣﻼﺣﻈﺔ:ﺍﻟﻤﺘﻐﻴﺮﺍﺕ ﻋﺪﺩ ﻳﻜﻮﻥ ﺃﻥ ﺍﻟﻀﺮﻭﺭﻱ ﻣﻦ ﻟﻴﺲcourses_tow
ﺳﻴﺘﻢ ﺍﻟﺘﻲ ﺍﻟﻤﺘﻐﻴﺮﺍﺕ ﻋﺪﺩ ﻳﺴﺎﻭﻱ“ﻓﺮﻁﻬﺎ“ﻗﺒﻞ ﻣﻦ…array^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 31. JS SPREAD “…” OPERATOR
ﻣﺜﺎﻝ3:ﻋﻨﺪﻣﺎ ﺃﻧﻨﻲ ﻭﻫﻲ ،ﻣﻬﻤﺔ ﻓﻜﺮﺓ ﻳﻮﺿﺢ ﻓﻬﻮ ،ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﺃﻫﻤﻴﺔ ﻻﺣﻆ
ﺍﻝ ﻣﺼﻔﻮﻓﺔ ﺑﺎﺭﺳﺎﻝ ﻗﻤﺖSpread argsﺍﻟﻤﺼﻔﻮﻓﺔ ﺍﻋﺘﺒﺮargﻭﺍﺣﺪ
ﻋﻠﻰ ﻳﺤﺘﻮﻱ6ﻋﻨﺎﺻﺮ)ﻣﺼﻔﻮﻓﺔ ﻧﻮﻋﻬﺎ ﻁﺒﻴﻌﺔ ﻋﻠﻰ ﻋﺎﻣﻠﻬﺎ(ﺃﻥ ﻭﻳﻤﻜﻨﻪ
ﺍﻟﻤﺼﻔﻮﻓﺔ ﺑﻔﺮﻁ ﻗﻤﺖ ﺍﻟﺜﺎﻧﻴﺔ ﺍﻟﺤﺎﻟﺔ ﻓﻲ ﺑﻴﻨﻤﺎ ،ﻣﺼﻔﻮﻓﺔ ﻣﻦ ﺃﻛﺜﺮ ﻳﺴﺘﻘﺒﻞ
ﺍﻟﻤﺜﺎﻝ ﺗﻄﺒﻴﻖ ﻧﺘﻴﺠﺔ ﻓﻲ ﺟﻠﻴﺎ ﻳﻈﻬﺮ ﻭﻫﺬﺍ ،ﻗﻴﻢ ﺷﻜﻞ ﻋﻠﻰ ﻭﺍﺭﺳﺎﻟﻬﺎ^ _^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 32. JS SPREAD “…” OPERATOR
ﺍﻟﺮﺍﺋﻌﺔ ﺍﻟﻔﻜﺮﺓ ﻫﺬﻩ ﺷﺮﺡ ﻣﻦ ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ﺍﻧﺘﻬﻴﻨﺎ ﻧﻜﻮﻥ ﻭﺑﻬﺬﺍ^_^ﻟﻜﻨﻨﻲ ،
ﻧﺴﺘﺨﺪﻡ ﻛﻨﺎ ،ﺳﻜﺮﺑﺖ ﺑﺎﻟﺠﺎﻓﺎ ﺃﻧﻨﺎ ﻭﻫﻲ ،ﻧﻘﻄﺔ ﺍﻟﻰ ﺑﺎﻟﺘﻨﻮﻳﻪ ﺃﺭﻏﺐ
Array.prototype.slice.callﺍﻝ ﻣﻦ ﻣﻌﺮﻭﻑ ﻏﻴﺮ ﻋﺪﺩ ﻻﺳﺘﻘﺒﺎﻝ
argsﺍﻝ ﻓﻲ ﻛﻤﺎSpreadﻳﻮﺿﺢ ﺑﺴﻴﻂ ﻣﺜﺎﻝ ﻭﻫﺬﺍ ،ﻗﻠﻴﻞ ﻗﺒﻞ ﺗﻌﻠﻤﻨﻬﺎ ﺍﻟﺘﻲ
ﺍﻟﻔﻜﺮﺓ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 34. TEMPLATE STRINGS ` `
ﺍﻝTemplate Stringﻋﻦ ﻋﺒﺎﺭﺓsingle lineﺃﻭmultilineﻣﻦ
ﺍﻝString)ﺍﻟﺴﻄﻮﺭ ﻣﻦ ﻣﺠﻤﻮﻋﺔ ﺃﻭ ﺳﻄﺮ(ﺍﻵﻥ ﺗﻌﺮﻳﻔﻬﺎ ﻳﺘﻢ)ﺍﻹﺻﺪﺍﺭ ﻣﻦ
ES6(ﺍﻝ ﺑﺎﺳﺘﺨﺪﺍﻡback-tick)`... (ﻣﻦ ﺍﻟﺠﺪﻳﺪﺓ ﺍﻟﻤﺰﻳﺔ ﻫﺬﻩ ﺗﻤﻜﻨﻨﺎ ﻛﻤﺎ
ﻭﺿﻊexpressionsﺍﻝ ﺩﺍﺧﻞtemplate stringﺍﺳﺘﺨﺪﺍﻡ ﺧﻼﻝ ﻣﻦ
ﺍﻝ${ }^_^..
ﻣﻌﺎ ﻣﺜﺎﻻ ﻟﻨﺸﺎﻫﺪ ،ﻭﺍﻵﻥ:^_^:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
ﺍﻟﻤﺜﺎﻝ ﺗﻄﺒﻴﻖ ﻧﺎﺗﺞ..ﺍﻟﺸﻴﻔﺮﺓ
ﺍﻟﺘﺎﻟﻴﺔ ﺍﻟﺼﻔﺤﺔ ﻓﻲ ﺍﻟﺒﺮﻣﺠﻴﺔ*_*
- 36. ARROW FUNCTION =>
ﺍﻹﺻﺪﺍﺭ ﻓﻲES6ﻟﺘﻌﺮﻳﻒ ﺟﺪﻳﺪﺓ ﻁﺮﻳﻘﺔ ﺇﺿﺎﻓﺔ ﺗﻢFunction
ﻭﺍﺳﺘﺨﺪﺍﻣﻪ!!
ﺃﻫﻢ ﻭﺇﺣﺪﻯ ،ﻋﻤﻠﻪ ﺍﻟﻤﺒﺮﻣﺞ ﻋﻠﻰ ﻟﻴﺴﻬﻞ ﺻﻤﻢ ﺍﻟﺘﻌﺮﻳﻒ ﻫﺬﺍ ﻟﻜﻦ ،ﺗﺘﻌﺠﺐ ﻻ ﻧﻌﻢ
ﺍﻝ ﻛﺘﺎﺑﺔ ﻫﻮ ،ﺍﻷﺳﻠﻮﺏ ﻫﺬﺍ ﺍﺳﺘﺨﺪﺍﻣﺎﺕfunctionﻭﺍﺣﺪﺍ ﺳﻄﺮﺍ ﻳﺤﺘﻮﻱ ﺍﻟﺬﻱ
ﺑﻜﺘﺎﺑﺔ ﻓﻴﻬﺎ ﻧﻄﺮ ،ﺑﺤﺎﻟﺔ ﻣﺮﺭﻧﺎ ﻭﻟﻄﺎﻟﻤﺎ ،ﻟﻠﺘﻨﻔﻴﺬfunctionﺑﻌﻤﻞ ﻳﻘﻮﻡ ﻓﻘﻂ
returnﻣﻌﻴﻨﺔ ﻟﻘﻴﻤﺔ...،ﻭﺍﺣﺪ ﺳﻄﺮ ﺗﻨﻔﻴﺬ ﻣﻦ ﺍﻟﻄﺮﻳﻘﺔ ﻫﺬﻩ ﺗﻤﻜﻨﻚ ،ﻭﻁﺒﻌﺎ
ﺳﻄﺮ ﻣﻦ ﻷﻛﺜﺮ ﺃﻭ ،ﻟﻪ ﺻﻤﻢ ﻛﻤﺎ^_^....ﻣﻌﺎ ﻣﺜﺎﻻ ﻭﻟﻨﺸﺎﻫﺪ:
ﻣﻼﺣﻈﺔ1ﺍﻟﻤﺜﺎﻝ ﺍﻟﻰ ﺍﻹﻧﺘﻘﺎﻝ ﻗﺒﻞ:ﺍﻝArrow functionﺍﺳﺘﺨﺪﺍﻣﻪ ﻳﻤﻜﻦ
ﺍﻝ ﻣﻊExpressionﺃﻭStatementﺃﻭLexical this...
ﻣﻼﺣﻈﺔ2:ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﺣﻮﻝ ﻣﻬﻤﺔ ﻧﻘﺎﻁ ﻫﻨﺎﻙarrow function
ﺍﻷﻣﺮ ﻧﺴﻬﻞ ﺣﺘﻰ ﷲ ﺑﺈﺫﻥ ﺍﻷﻣﺜﻠﺔ ﻓﻲ ﻟﻬﺎ ﺳﻨﺘﻄﺮﻕ ،ﻭﺃﻫﻤﻴﺘﻬﺎ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 37. ARROW FUNCTION =>
ﻣﺜﺎﻝ1:
ﺍﻟﻤﺜﺎﻝ ﺷﺮﺡ:
ﺍﻝcontactNameﺍﻝ ﺇﺳﻢ ﻳﻤﺜﻞfunctionﺑﺎﺳﺘﺪﻋﺎﺋﻪ ﺳﻨﻘﻮﻡ ﺍﻟﺬﻱ.
ﺍﻝfname, mnameﺍﻝ ﺗﻤﺜﻞfunction parameter
ﺍﻝ ﻓﻲconsole.logﺍﻝ ﺑﺎﺳﺘﺪﻋﺎء ﻗﻤﻨﺎfunctionﺍﻟﻘﻴﻢ ﻭﺍﺭﺳﺎﻝ
“anees”ﻭ“hikmat”ﺍﻝ ﻗﺎﻡ ﺛﻢ ﻭﻣﻦfunctionﺑﻴﻦ ﺍﻟﺮﺑﻂ ﺑﻌﻤﻠﻴﺔ
ﺍﻹﺳﻤﻴﻦ^_^...
ﺍﻟﺸﻜﻞ ﻫﺬﺍ ﺑﻜﺘﺎﺑﺔ ﻗﻤﻨﺎ ﻛﺄﻧﻨﺎ ﺃﻱ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 38. ARROW FUNCTION =>
ﻣﺜﺎﻝ2:ﻛﺘﺎﺑﺔ ﻳﻤﻜﻨﻨﺎmultiple statementsﺍﻝ ﺧﻼﻝ ﻣﻦ
Arrow Functionﺍﻟﺘﺎﻟﻲ ﺍﻟﻤﺜﺎﻝ ﻓﻲ ﻛﻤﺎ:
ﻫﻨﺎ ﻻﺣﻆ..ﻭﺟﻮﺩ ﺣﺎﻟﺔ ﻓﻲmultiple statementsﺳﻨﻘﻮﻡ ﻣﺒﺎﺷﺮﺓ ﻓﺈﻧﻨﺎ
ﻧﻄﺎﻕ ﺿﻤﻦ ﺑﺤﺼﺮﻫﺎblockﺧﻼﻝ ﻣﻦ{}..ﺍﻝ ﺳﻨﺴﺘﺨﺪﻡ ﺃﻧﻨﺎ ﻛﻤﺎ
Returnﺗﻨﻔﻴﺬﻫﺎ ﺍﻟﻤﻄﻠﻮﺏ ﺍﻟﻌﻤﻠﻴﺔ ﻣﻦ ﺍﻟﻨﺎﺗﺠﺔ ﺍﻟﻘﻴﻤﺔ ﻹﺭﺟﺎﻉ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 39. ARROW FUNCTION =>
ﻣﺜﺎﻝ3:ﺍﻝ ﺗﻨﻔﻴﺬ ﻧﺎﺗﺞArrow Functionﺷﻜﻞ ﻋﻠﻰ ﻳﻜﻮﻥobjﻣﻦ ﻧﺎﺗﺞ
ﺍﻝfunctionﻳﻤﻜﻦ ﺃﻧﻨﺎ ﻭﻫﻲ ،ﺟﻤﻴﻠﺔ ﺃﺧﺮﻯ ﻣﻴﺰﺓ ﻟﻨﺎ ﻳﺘﻴﺢ ﻭﻫﺬﺍ ،ﺍﻹﻋﺘﻴﺎﺩﻱ
ﻛﺄﻧﻬﺎ ﺍﻟﺮﺍﺟﻌﺔ ﺍﻟﻘﻴﻤﺔ ﻧﺴﺘﺨﺪﻡ ﺃﻥregular JavaScript function object
ﺷﻜﻞ ﻋﻠﻰ ﻟﻠﺘﻌﺎﻣﻞ ﻣﻔﻴﺪ ﻭﻫﺬﺍcallback function..ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 40. ARROW FUNCTION =>
ﻣﺜﺎﻝ4:ﺍﻟﻤﺜﺎﻝ ﻓﻲ ﺍﻵﻥ2ﺍﻝ ﻻﺳﺘﺨﺪﺍﻡ ﻳﻠﺰﻡ ﻛﺎﻥstatementsmultiple
ﺑﺎﺳﺘﻌﻤﺎﻝ ﻧﻘﻮﻡ ﺃﻥ{}ﻫﺬﻩ ﻟﻜﻦ ،{}ﺇﺭﺳﺎﻝ ﻓﻲ ﺭﻏﺒﻨﺎ ﺣﺎﻝ ﻓﻲ ﻣﺸﻜﻠﺔ ﻟﻨﺎ ﺳﺘﺴﺒﺐ
literalobj...-_-
^_^ﻭﻣﺘﻮﻓﺮ ﻭﺑﺴﻴﻂ ﺳﻬﻞ ﻓﺎﻟﺤﻞ ،ﺗﻘﻠﻖ ﻻ ﻟﻜﻦ:Pﺍﻝ ﺇﺣﺎﻁﺔ ﺧﻼﻝ ﻣﻦ ﻭﻳﻜﻮﻥ
{}ﺍﻝ ﺧﻼﻝ ﻣﻦ.. ()ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﺍﻝ ﺃﺭﺳﻠﺖ ﺃﻧﻨﻲ ﻫﻨﺎ ﻻﺣﻆid
ﺍﻝ ﻳﺘﻐﻴﺮ ﻟﻢ ﻭﻟﻬﺬﺍ ،ﻓﻘﻂname
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 42. ARROW FUNCTION =>
ﺍﻝ ﻣﻮﺿﻮﻉ ﻣﻦ ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ﺍﻧﺘﻬﻴﻨﺎ ﻧﻜﻮﻥ ﺑﻬﺬﺍArrow Function،
ﺍﻟﺴﺎﺑﻘﺔ ﻟﻸﻣﺜﻠﺔ ﺗﻄﺒﻴﻖ ﻟﻨﺸﺎﻫﺪ ،ﻭﺍﻵﻥ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 44. CLASS KEYWORD ON JS
ﻫﻮ ﻭﻣﺘﻰ ،ﻟﻜﻢ ﻋﺮﺿﻪ ﻁﺮﻳﻘﺔ ﻓﻲ ﺟﺪﺍ ﻣﺤﺘﺎﺭﺍ ﺟﻌﻠﻨﻲ ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﺣﻘﻴﻘﺔ
ﻓﻲ ﻭﻓﻘﻨﺎ ﻧﻜﻮﻥ ﺃﻥ ﺗﻌﺎﻟﻰ ﷲ ﻭﻧﺴﺄﻝ ،ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﻟﺸﺮﺡ ﺍﻟﻤﻨﺎﺳﺐ ﺍﻟﻮﻗﺖ
ﺍﻝ ﻟﻌﺮﺽ ﺍﻟﺘﻮﻗﻴﺖ ﻫﺬﺍ ﺍﺧﺘﻴﺎﺭClass Keywordﻧﻮﻓﻖ ﺃﻥ ﻭﻧﺴﺄﻟﻪ ،ﻋﻠﻴﻜﻢ
ﺍﻟﺸﺮﺡ ﻓﻲ.
ﺍﻟﻤﻔﺎﻫﻴﻢ ﻣﻦ ﻣﺠﻤﻮﻋﺔ ﺑﺸﺮﺡ ﺳﺄﺑﺪﺃ ﺍﻧﻲ ﺍﻋﺘﻘﺪ ﺻﺤﻴﺤﺔـ ﺍﻟﺒﺪﺍﻳﺔ ﺗﻜﻮﻥ ﺣﺘﻰ
ﺍﻝ ﻋﻦ ﺍﻟﺤﺪﻳﺚ ﻗﺒﻞ ،ﻭﺍﻟﻤﻬﻤﺔ ﺍﻷﺳﺎﺳﻴﺔClassﺍﻝ ﺍﻟﺤﺪﻳﺚ ﻭﺳﻴﻜﻮﻥ ،
JS Object Oriented Programming^_^ﻓﻌﻼ ﻳﻮﺟﺪ ﻭﻫﻞ ،
CLASS؟ ﺍﻟﻤﺨﺘﻠﻔﺔ ﺍﻟﺒﺮﻣﺠﺔ ﻟﻐﺎﺕ ﻓﻲ ﻛﻤﺎ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ!
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 45. CLASS KEYWORD ON JS
ﺍﻝ ﻣﻔﻬﻮﻡobjﺍﻷﺧﺮﻯ ﺍﻟﻠﻐﺎﺕ ﻓﻲ ﺍﻟﻤﺒﺮﻣﺠﻴﻦ ﺑﻴﻦ ﺍﻟﻤﻌﺮﻭﻑ ﺑﺸﻜﻠﻪ
)ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻏﻴﺮ(ﺍﻝ ﻋﻦ ﻳﺨﺘﻠﻒobj،ﺳﻜﺮﺑﺖ ﺑﺎﻟﺠﺎﻓﺎ ﺍﻟﻤﻮﺟﻮﺩ
ﺍﻟﻰ ﺍﻟﺠﺎﻓﺎ ﻣﻦ ﻳﻨﺘﻘﻞ ﻣﻦ ﻳﺘﻌﺠﺐ ﻛﺎﻥ ﻓﻤﺜﻼ ،ﺑﺎﻟﺒﻨﺎء ﻫﻨﺎ ﺍﻟﻤﻔﺎﻫﻴﻤﻲ ﻭﺍﻹﺧﺘﻼﻑ
ﻫﻮ ﺳﻜﺮﺑﺖ ﺑﺎﻟﺠﺎﻓﺎ ﻧﺴﺘﺨﺪﻣﻪ ﻣﺎ ﺃﻥ ﻛﻴﻒ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎobjﺳﺆﺍﻝ ﻭﺃﻭﻝ ،
ﺍﻝ ﺃﻳﻦ ﺑﺒﺎﻟﻪ ﻳﺨﻄﺮClass؟..ﺍﻝ ﺗﻌﺮﻳﻒ ﻷﻥobjﻋﻠﻰ ﻳﺆﺷﺮ ﺃﻥ ﻳﻠﺰﻣﻪ
class!!ﻳﻮﺟﺪ ﻟﻢ ﺫﻛﺮ ﺍﻟﺬﻱ ﺑﺎﻟﺸﻜﻞ ﺍﻟﻤﻔﻬﻮﻡ ﻭﻫﺬﺍ ،)..ﺍﻝ ﻣﻔﻬﻮﻡ ﻳﻮﺟﺪ ﻟﻢ
classﺃﺑﺪﺍ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﺍﻟﺸﻜﻞ ﺑﻬﺬﺍ.. (ﻳﻘﻮﻝ ﻟﺬﻟﻚ
Narayan Prustyﻛﺘﺎﺏ ﻣﺆﻟﻒLearning ECMAScript 6
“JavaScript never had the concept of classes,
although it's an object-oriented programming
language.”
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 46. CLASS KEYWORD ON JS
ﺍﻟﺠﺎﻓﺎ ﺑﻤﻔﻬﻮﻡ ﺍﻟﻜﻼﺱ ﻋﻦ ﻟﻠﺤﺪﻳﺚ ﻧﻨﺘﻘﻞ ،ﺍﻟﺒﺴﻴﻄﺔ ﺍﻟﻤﻘﺪﻣﺔ ﻫﺬﻩ ﺑﻌﺪ ﻭﺍﻵﻥ
ﺳﻜﺮﺑﺖ^_^ﻋﻦ ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ﻭﺳﻨﺘﺤﺪﺙ ،:
(1ﺍﻝ ﺇﻧﺸﺎءobjectﺍﻟﺘﻘﻠﻴﺪﻳﺔ ﺑﺎﻟﻄﺮﻳﻘﺔ) .ﺍﻝ ﺳﺒﻖ ﻟﻤﺎ ﻭﺷﺮﺡ ﻣﺮﺍﺟﻌﺔ
ES6(
(2ﺍﻝ ﻫﻲ ﻣﺎclassesﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ
(3ﺍﻝ ﺇﻧﺸﺎءobjectﺍﻝ ﺑﺎﺳﺘﺨﺪﺍﻡclasses
(4ﺍﻟﻮﺭﺍﺛﺔ)inheritance in classes(
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 47. CLASS KEYWORD ON JS
(1ﺇﻧﺸﺎءJS Objectﺍﻟﺘﻘﻠﻴﺪﻳﺔ ﺑﺎﻟﻄﺮﻳﻘﺔ:
*ﻣﻼﺣﻈﺔ:ﺍﻝ ﻟﻔﻬﻢ ﻣﻬﻤﺔ ﺍﻟﻤﺮﺍﺟﻌﺔ ﻫﺬﻩjs objectﻣﺘﺎﺑﻌﺔ ﻭﻟﺘﺴﺘﻄﻴﻊ
ﺍﻟﻘﺎﺩﻣﺔ ﺍﻟﺸﺮﺍﺋﺢ...
ﺃﻱ ﻹﻧﺸﺎءObject)ﺍﻟﺘﻘﻠﻴﺪﻳﺔ ﺑﺎﻟﻄﺮﻳﻘﺔ(ﻟﺬﻟﻚ ﺇﺳﻠﻮﺑﻴﻦ ﻫﻨﺎﻙ:
1(object literal:ﻹﻧﺸﺎء ﺍﻟﻄﺮﻳﻘﺔ ﻫﺬﻩ ﻭﺗﺴﺘﺨﺪﻡobjectﺛﺎﺑﺖ
)fixed... (ﻣﺜﻞ:
var person = {fname:“anees", mname:“hikmat”}
2(constructor:ﻹﻧﺸﺎء ﺍﻟﻄﺮﻳﻘﺔ ﻫﺬﻩ ﻭﺗﺴﺘﺨﺪﻡobject
Dynamicallyﺍﻝ ﺃﺛﻨﺎءruntimeﻟﻠﻌﻤﻞ ﺍﻟﻔﻌﺎﻟﺔ ﺍﻟﻄﺮﻳﻘﺔ ﻭﻫﻲ
Dynamic^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 48. CLASS KEYWORD ON JS
ﺍﻵﺗﻲ ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﺍﻝ ﻟﺪﻳﻨﺎobject literalﺍﻟﻤﺴﻤﻰEmployeeﺍﻝ ﻫﺬﺍ ﺃﻥ ﻭﻻﺣﻆ ،
objectﻫﻨﺎﻟﻚ ﻛﺎﻥ ﻟﻮ ﻣﺎﺫﺍ ﻟﻜﻦ ،ﺃﻧﻴﺲ ﻫﻮ ﻭﺍﺣﺪ ﺷﺨﺺ ﻳﺨﺪﻡ100ﻣﻮﻅﻒ؟
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 49. CLASS KEYWORD ON JS
ﺇﻧﺸﺎء ﺍﻟﻰ ﻣﺜﻼ ﺳﻨﺤﺘﺎﺝ ﺑﺄﻧﻨﺎ ﺍﻟﺴﺎﺑﻖ ﺍﻷﺳﻠﻮﺏ ﻓﻲ ﺍﻟﻤﺸﻜﻠﺔ ﺗﻜﻤﻦ100obj
ﺍﻝ ﻋﺪﺩ ﻛﺎﻥ ﻟﻮ ﻣﺎﺫﺍ ﺍﺫﻥ ،ﻳﺠﻮﺯ ﻻ ﺍﻟﻜﻼﻡ ﻭﻫﺬﺍ ،ﻟﻠﻤﻮﻅﻔﻴﻦemployee
ﻣﺘﻐﻴﺮ^_^...؟!
ﺍﻝ ﻭﻫﻮ ﺍﻟﺜﺎﻧﻲ ﻟﻠﺸﻜﻞ ﺍﻟﺤﺎﺟﺔ ﺗﻜﻤﻦ ﻭﻫﻨﺎconstructor،ﺃﻭﻝ ﻫﻨﺎ ﻭﻣﻦ
ﺍﻝ ﺃﻥ ﺗﻌﻠﻤﻬﺎ ﺃﻥ ﻳﺠﺐ ﻣﻌﻠﻮﻣﺔconstructorﻫﻮ ﺍﻟﻮﺍﻗﻊ ﻓﻲfunction
ﻛﻠﻤﺔ ﻟﻪ ﻣﻀﺎﻑnew^_^ﺍﻝ ﻫﺬﺍ ﻭﻳﻘﻮﻡ ،constructorﻭﺇﺭﺟﺎﻉ ﺑﺎﻧﺸﺎء
object_^*ﺍﻝ ﺃﻥ ﻛﻤﺎ ،thisﺍﻝ ﺩﺍﺧﻞconstructorﺍﻝ ﺍﻟﻰ ﺗﺸﻴﺮ
objectﺍﻝ ﻣﻦ ﺍﻟﺘﻨﻔﻴﺬ ﺇﻧﺘﻬﺎء ﻳﺘﻢ ﻭﻋﻨﺪﻣﺎ ،ﺑﺎﻧﺸﺎﺋﻪ ﻧﻘﻮﻡ ﺍﻟﺬﻱ ﺍﻟﺠﺪﻳﺪ
constructorﺍﻝ ﺍﺭﺟﺎﻉ ﻋﻠﻰ ﻳﻘﻮﻡobjectﺑﺸﻜﻞdynamic*_*
ﻭﺍﻵﻥ..ﺫﻛﺮﻧﺎﻩ ﻣﺎ ﻳﻮﺿﺢ ﻣﺜﺎﻻ ﻟﻨﺸﺎﻫﺪ ،ﺑﺴﻴﻂ ﺍﻟﻜﻼﻡ ﻫﺬﺍ ﻭﺑﻌﺪ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 50. CLASS KEYWORD ON JS
ﺍﻟﻤﺜﺎﻝ)ﺍﻟﺘﺎﻟﻴﺔ ﺑﺎﻟﺸﺮﻳﺤﺔ ﺍﻟﻤﺜﺎﻝ ﺷﺮﺡ(ﻣﻮﺟﻮﺩ ﻟﻮﻥ ﻟﻜﻞ ﺍﻧﺘﺒﻪ ﻟﻜﻦ ،:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 51. CLASS KEYWORD ON JS
ﺍﻟﻤﺜﺎﻝ ﺷﺮﺡ:
ﺍﻝ ﺃﻥ ﻫﻲ ﻣﻼﺣﻈﺔ ﻭﺃﻫﻢ ﺃﻭﻝemployeeNameﺗﻼﺣﻆ ﻛﻤﺎfunction
ﺟﻌﻠﻪ ﻣﺎ ﻟﻜﻦ ،ﻁﺒﻴﻌﻲconstructorﻭﺟﻮﺩ ﻫﻮ
new employeeNameﺍﻝ ﺗﻌﺮﻳﻒ ﻋﻨﺪobject،ﺃﻳﻀﺎ ﺗﻼﺣﻆ ﻭﻛﻤﺎ ،
ﺍﻝ ﻓﺈﻥprototype،ﺍﻟﺨﺼﺎﺋﺺ ﺃﻭ ﺍﻟﺪﻭﺍﻝ ﻣﻦ ﺃﻱ ﻹﺿﺎﻓﺔ ﺍﺳﺘﺨﺪﻣﺖ
ﺍﻝ ﺧﻼﻝ ﻣﻦ ﻳﺘﻢ ﺍﻟﺪﺍﻟﺔ ﻟﻬﺬﻩ ﺍﻟﻮﺻﻮﻝ ﻭﻛﺎﻥ ،ﺍﻹﺳﻢ ﻁﺒﺎﻋﺔ ﺩﺍﻟﺔ ﺃﺿﻔﻨﺎ ﻭﺑﻤﺜﺎﻟﻨﺎ
Objectﺑﺈﻧﺸﺎﺋﻪ ﻗﻤﻨﺎ ﺍﻟﺬﻱ...
ﺑﻤﻔﺎﺟﺄﺓ ﺳﺄﺧﺒﺮﻛﻢ ﻭﺍﻵﻥ^_^:Pﺃﻱ ﺃﻥ ﺗﺨﻴﻞ ،Object Letiralﻓﻲ
ﻫﻮ ﺍﻟﻮﺍﻗﻊconstructor!!،ﻧﻌﻢ ،constructorﺍﻝ ﻟﻜﻦpointer
ﻋﻠﻰ ﻳﺆﺷﺮ ﺑﻪ ﺍﻟﺨﺎﺹGlobal Constructor Object^^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 52. CLASS KEYWORD ON JS
ﺳﻜﺮﺑﺖ ﺑﺎﻟﺠﺎﻓﺎ ﺍﻟﻮﺭﺍﺛﺔ ﻣﻔﻬﻮﻡ ﺍﻟﻰ ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ﺳﻨﺘﻄﺮﻕ ،ﻭﺍﻵﻥ
)Understanding inheritance(ﺃﻥ ﻫﻮ ﻣﻌﺮﻓﺘﻪ ﻣﻨﻚ ﺃﺭﻳﺪ ﻣﺎ ﻭﺃﻭﻝ ،
ﺍﻝ ﺟﻤﻴﻊobjectﺍﻝ ﺩﺍﺧﻞ ﺍﻟﻤﻮﺟﻮﺩﺓjsﻟﺪﻳﻬﺎ“ﺧﺎﺻﻴﺔproperty“ﺗﺴﻤﻰ
prototypeﺍﻟﺨﺎﺻﻴﺔ ﻫﺬﻩ ﺗﻘﻮﻡ ،“property”ﻋﻠﻰ ﺑﺎﻟﺘﺄﺷﻴﺮobject
ﻳﺪﻋﻰ ﺁﺧﺮprototype)ﺍﻟﺴﺎﺑﻖ ﺍﻟﻤﺜﺎﻝ ﻓﻲ ﺷﺎﻫﺪﻧﺎ ﻛﻤﺎ.. (
ﺍﻝ ﻫﺬﺍ ﺍﻵﻥprototype objectﺃﻳﻀﺎ ﻳﻤﻠﻚ ﺑﺬﺍﺗﻪ ﻫﻮ ﺍﻟﻴﻪ ﻭﺻﻠﻨﺎ ﺍﻟﺬﻱ
Prototypeﻭﺍﻝ ،nullﺍﻝ ﻓﻲ ﺗﻌﻨﻲprototypeﻭﺟﻮﺩﻩ ﻋﺪﻡ
)ﻭﺟﻮﺩ ﻋﺪﻡ–ﻟﻞ ﻗﻴﻤﺔ ﺍﺳﻨﺎﺩprototype.. (ﻧﺼﻞ ﻋﻨﺪﻣﺎ ،ﺍﻟﻮﺍﻗﻊ ﻭﻓﻲ
ﺍﻝ ﻗﻴﻤﺔ ﺃﻥ ﻓﻴﻬﺎ ﻧﺠﺪ ﻟﻤﺮﺣﺔprototypeﺗﺴﺎﻭﻱnullﺃﻧﻨﺎ ﻳﻌﻨﻲ ﻓﻬﺬﺍ
ﺍﻟﺤﻠﻘﺔ ﻧﻬﺎﻳﺔ ﺍﻟﻰ ﻭﺻﻠﻨﺎ^_^..؟ ﺍﻧﺘﻬﺖ ﺍﻟﺘﻲ ﺍﻟﺤﻠﻘﺔ ﻫﺬﻩ ﻫﻲ ﻣﺎ ﻟﻜﻦ
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 53. CLASS KEYWORD ON JS
ﺳﻜﺮﺑﺖ ﺑﺎﻟﺠﺎﻓﺎ ﺍﻟﻮﺭﺍﺛﺔ ﻣﻔﻬﻮﻡ ﻫﻲ ﻋﻨﻬﺎ ﻭﺳﻨﺘﺤﺪﺙ ﺍﻧﺘﻬﺖ ﺍﻟﺘﻲ ﺍﻟﺤﻠﻘﺔ ﺇﻥ)
ﻟﻢ ،ﺍﻹﺻﺪﺍﺭ ﻫﺬﺍ ﺗﺴﺒﻖ ﺍﻟﺘﻲ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻣﻔﺎﻫﻴﻢ ﻋﻦ ﻧﺘﺤﺪﺙ ﺃﻧﻨﺎ ﻻﺣﻆ
ﺑﻌﺪ ﺍﻟﺠﺪﻳﺪ ﻋﻦ ﻧﺘﺤﺪﺙ“ﻛﻤﻔﺎﻫﻴﻢ”ﻣﻌﺎ ﻛﻠﻴﻬﻤﺎ ﻋﻦ ﻧﺘﺤﺪﺙ ﻓﻘﺪ ﻭﺧﺼﺎﺋﺺ ﻛﺪﻭﺍﻝ ﺃﻣﺎ ،(
ﻫﻲ ﺍﻟﺤﻠﻘﺔ:ﺍﻟﻰ ﺍﻟﻮﺻﻮﻝ ﻧﺤﺎﻭﻝ ﻋﻨﺪﻣﺎpropertyﺩﺍﺧﻞobjectﻭﻛﺎﻧﺖ ،
ﻫﺬﻩpropertyﺍﻝ ﻫﺬﺍ ﺑﺪﺍﺧﻞ ﻣﻮﺟﻮﺩﺓ ﻏﻴﺮobjectﺍﻝ ﺳﻴﻘﻮﻡ ،
propertyﺍﻝ ﻋﻦ ﺑﺎﻟﺒﺤﺚpropertyﺍﻝ ﺩﺍﺧﻞprototypeﻟﻢ ﺇﺫﺍ ،
ﺍﻝ ﻫﺬﻩ ﺃﻳﻀﺎ ﻳﺠﺪpropertyﺍﻝ ﺩﺍﺧﻞprototypeﺩﺍﺧﻞ ﺑﺎﻟﺒﺤﺚ ﺳﻴﻘﻮﻡ ،
ﺍﻝprototypeﺑﺎﻝ ﺍﻟﺨﺎﺹprototype objectﺍﻟﺴﻠﺴﻠﺔ ﺗﺘﻢ ﻭﻫﻜﺬﺍ ،
ﺍﻝ ﻧﺘﻴﺠﺔ ﻛﺎﻧﺖ ﻁﺎﻟﻤﺎprototypeﺗﺴﺎﻭﻱnullﻓﻲ ﺍﻟﻮﺭﺍﺛﺔ ﻣﺒﺪﺃ ﻫﻮ ﻭﻫﺬﺍ ،
ﺃﺭﻳﺪ ﻣﺎ ﺃﺟﺪ ﺣﺘﻰ ﺍﻟﺨﺼﺎﺋﺺ ﺑﻮﺭﺍﺛﺔ ﺃﺳﺘﻤﺮ ﺗﻼﺣﻆ ﻛﻤﺎ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ
ﺃﻭﺃﻧﺘﻬﻲ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 54. CLASS KEYWORD ON JS
ﻣﻬﻤﺔ ﻣﻼﺣﻈﺔ:ﺍﻝJS Objectﻳﻤﻠﻚ ﺃﻥ ﺑﺈﻣﻜﺎﻧﻪprototype،ﻓﻘﻂ ﻭﺍﺣﺪ
ﻓﻘﻂ ﺍﻷﺣﺎﺩﻳﺔ ﺍﻟﻮﺭﺍﺛﺔ ﺗﺪﻋﻢ ﺳﻜﺮﺑﺖ ﻭﺍﻟﺠﺎﻓﺎ)single inheritance(
ﺍﻟﺨﺎﺻﻴﺔ ﺇﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻨﻨﺎ__proto__ﺍﻟﺪﺍﻟﺔ ﺃﻭ
Object.setPrototypeOf()ﺍﻝ ﻹﺳﻨﺎﺩprototypeﺍﻝ ﺍﻟﻰobj
ﺍﻝ ﺗﺪﻋﻢ ﻛﻤﺎjsﺍﻟﺪﺍﻟﺔObject.create()ﻹﻧﺸﺎءnew objectﻳﺤﺘﻮﻱ
prototypeﺑﺘﺤﺪﻳﺪﻩ ﻧﺤﻦ ﻗﻤﻨﺎ ﻣﻌﻴﻦ...
ﻭﺍﻵﻥ..ﷲ ﺑﺈﺫﻥ ﺍﻵﻥ ﺳﺘﺘﻀﺢ ﻟﻜﻨﻬﺎ ،ﻣﺎ ﻧﻮﻋﺎ ﺿﺒﺎﺑﻴﺔ ﺗﻜﻮﻥ ﻗﺪ ﺍﻟﻔﻜﺮﺓ ﺃﻥ ﺃﻋﻠﻢ
ﺑﺎﻟﺸﺮﺡ ﺍﻟﺨﺎﺻﺔ ﻭﺍﻟﺼﻮﺭﺓ ،ﺍﻟﺘﺎﻟﻴﺔ ﺍﻟﺸﺮﻳﺤﺔ ﻓﻲ ﺍﻟﻤﺜﺎﻝ ﻋﻠﻰ ﺍﻹﻁﻼﻉ ﺑﻌﺪ ﺗﻌﺎﻟﻰ
ﺍﻟﺘﺎﻟﻴﺔ ﺑﻌﺪ ﺍﻟﺸﺮﻳﺤﺔ ﻓﻲ...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 55. CLASS KEYWORD ON JS
ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
__proto__ﺧﺎﺻﻴﺔdeprecatedﻓﻲ ﻣﺪﻋﻮﻣﺔ ﻣﺎﺯﺍﻟﺖ ﻟﻜﻨﻬﺎ ،
ﺑﺎﻷﺩﺍء ﺗﻬﺘﻢ ﻛﺎﻧﺖ ﺇﺫﺍ ﺧﺼﻮﺻﺎ ،ﺑﺎﺳﺘﺨﺪﺍﻣﻬﺎ ﻳﻨﺼﺢ ﻻ ﻟﻜﻦ ،ﺍﻟﻤﺘﺼﺤﻔﺎﺕ^_^
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﻭﺑﺈﻣﻜﺎﻧﻚcreate()ﻣﻨﻬﺎ ﺑﺪﻻ^_^...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 56. CLASS KEYWORD ON JS
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
ﺍﻝ ﻓﻜﺮﺓ ﺷﺎﻫﺪ ،ﻭﺍﻵﻥinheritanceﺑﺒﺎﻟﻲ ﺗﻜﻦ ﻟﻢ ﻭﺣﻘﻴﻘﺔ ،ﻋﻨﻬﺎ ﺗﺤﺪﺛﻨﺎ ﺍﻟﺘﻲ
ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﻓﻲ ﺍﻟﺒﺤﺚ ﺃﺛﻨﺎء ﻓﻲ ﻣﺼﺎﺩﻓﺔ ﻭﺟﺪﺗﻬﺎ ﺣﺘﻰ ﺍﻟﺼﻮﺭﺓ ﻫﺬﻩ^_^
- 57. CLASS KEYWORD ON JS
ﻣﺜﺎﻝ2:ﺍﻟﻮﺭﺍﺛﺔ ﻣﺒﺪﺃ ﻋﻠﻰ ﻋﻤﻠﻴﺔ ﻓﻜﺮﺓ ﻳﻮﺿﺢ ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ:
ﻓﻲ ﺗﻜﻤﻦ ﺍﻟﻔﻜﺮﺓ ﺃﻥ ﻻﺣﻆ
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡschoolﻣﻦ
ﺍﻝ ﺧﻼﻝstudent،
ﺑﺎﻟﻨﻬﺎﻳﺔ ﺃﻧﻨﻲ ﻛﻴﻒ ﻭﻻﺣﻆ
ﺍﻝ ﺍﺳﺘﺨﺪﻣﺖstudent
ﻣﻦ ﻛﻞ ﻟﻄﺒﺎﻋﺔ ﺃﻭﺑﺠﻴﻜﺖ
ﺍﻟﻤﺪﺭﺳﺔ ﻭﺍﺳﻢ ﺍﻟﻄﺎﻟﺐ ﺍﺳﻢ
ﺍﻝ ﻣﻦ)School.. (
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 58. ِﻪﻴَﻠَﻋ ُ ﱠﷲ ﻰﱠﻠَﺻ ِ ﱠﷲ ﻮﻝُﺳَﺭ ﺃﻥ ُﻪﻨَﻋ ُ ﱠﷲ َﻲِﺿَﺭ ﻨﻴﻒُﺣ ﺑﻦ ﺳﻬﻞ ﻭﻋﻦ
ﻗﺎﻝ ﻢﱠﻠَﺳَﻭ:
ﺭﻭﺍﻩﻣﺴﻠﻢ
- 59. CLASS KEYWORD ON JS
ﺍﻝ ﺍﻟﻰ ﻣﻌﺎ ﻧﺄﺗﻲ ،ﻭﺍﻵﻥCLASSﺍﻟﻴﻬﺎ ﻭﺻﻠﻨﺎ ﺣﺘﻰ ﺍﻧﺘﻈﺎﺭﻧﺎ ﻁﺎﻝ ﺍﻟﺘﻲ^_^
ﺍﻝ ﺃﻥ ﻛﻴﻒ ،ﺍﻟﺴﺎﺑﻘﺔ ﺑﺎﻟﺸﺮﺍﺋﺢ ﺷﺎﻫﺪﻧﺎjs object modelﺃﻣﺮﻳﻦ ﻋﻠﻰ ﻳﻌﺘﻤﺪ
ﺍﻝ ﻭﻫﻤﺎ ﺭﺋﻴﺴﻴﻴﻦconstructorsﻭﺍﻝprototypeﻓﻲ ﻟﻪ ﺗﻄﺮﻗﻨﺎ ﺍﻟﺘﻲ
ﺍﻝ ﻟﻜﺘﺎﺑﺔ ﺟﺪﻳﺪﺓ ﻭﺳﻴﻠﺔ ﻋﻦ ﺳﻨﺘﺤﺪﺙ ،ﻭﺍﻵﻥ ،ﺍﻟﻮﺭﺍﺛﺔ ﻣﻮﺿﻮﻉsyntax
ﺑﺎﻝ ﺍﻟﺨﺎﺹjs object modelﻗﻠﺖ ﺃﻧﻨﻲ ﻭﻻﺣﻆ ،)ﺟﺪﻳﺪﺓ ﻭﺳﻴﻠﺔ(ﻓﺎﻝ ،
classesﻟﻞ ﺟﺪﻳﺪ ﻣﻔﻬﻮﻡ ﺑﺈﻧﺸﺎء ﺗﻘﻮﻡ ﻻjs object model_^*ﻭﻫﺬﺍ ،
ﺍﻝ ﺧﻼﻝ ﻣﻦ ﺑﺎﺳﺘﺨﺪﺍﻣﻪ ﺳﻨﻘﻮﻡ ﻭﺍﻟﺬﻱ ﺍﻷﺳﻠﻮﺏClassﺗﺄﻛﻴﺪ ﺑﻜﻞ ﻣﻦ ﺳﻴﻜﻮﻥ ،
ﺍﻝ ﺧﺼﺎﺋﺺ ﻣﻦES6ﺍﻟﺠﺪﻳﺪﺓ^_^ﺭﺅﻳﺔ ﻫﻮ ﺍﻷﺳﻠﻮﺏ ﻫﺬﺍ ﻳﻘﺪﻣﻪ ﻣﺎ ﻭﺃﻫﻢ ،
ﻭﺍﻟﺘﺘﺒﻊ ﻟﻠﻔﻬﻢ ﻭﺃﻭﺿﺢ ﻭﻣﺮﻭﻧﺔ ﺳﻬﻮﻟﺔ ﺫﺍﺕ ﺍﻟﺒﺮﻣﺠﻴﺔ ﻟﻠﺸﻴﻔﺮﺓ ﺗﺮﻛﻴﺒﻴﺔ ﺑﻨﻴﺔ..
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 60. CLASS KEYWORD ON JS
ﻣﻼﺣﻈﺔ:ﺍﻝclassﻫﻮ ﺍﻟﻮﺍﻗﻊ ﻓﻲfunction؟!ﺫﻭ ﻟﻜﻨﻪ ،syntaxﺟﺪﻳﺪ
ﺍﻝ ﻹﻧﺸﺎءFunctionﺍﻝ ﻳﺴﺘﺨﺪﻡ ﺍﻟﺬﻱconstructorsﺗﻘﻢ ﻻ ﻟﺬﻟﻚ ،
ﺑﺎﻧﺸﺎءClassﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﻓﻲ ﺗﻔﻜﺮ ﻻ ﻛﻨﺖ ﺇﺫﺍconstructing objects
ﺍﻝ ﻟﺘﻌﺮﻳﻒ ﺇﺛﻨﺘﻴﻦ ﻁﺮﻳﻘﺘﻴﻦ ﻫﻨﺎﻙClassًﻭﻫﻦ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ:
(1class declaration
(2class expression
ﺑﺎﻝ ﺍﻵﻥ ﻭﻟﻨﺒﺪﺃclass declaration_^*
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 61. CLASS KEYWORD ON JS
1(The class declaration:ﻟﺘﻌﺮﻳﻒClassﺍﻟﻄﺮﻳﻘﺔ ﻫﺬﻩ ﺧﻼﻝ ﻣﻦ
)Class Declaration(ﺍﻟﻤﺤﺠﻮﺯﺓ ﺍﻟﻜﻠﻤﺔ ﺑﺎﺳﺘﺨﺪﺍﻡ ﺍﻟﻘﻴﺎﻡ ﻳﻠﺰﻣﻚ
“ class “ﺛﻢ ﻭﻣﻦ“ﺍﻟﻜﻼﺱ ﺍﺳﻢ“....ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 62. CLASS KEYWORD ON JS
2(The class expression:ﻟﻜﻦ ،ﺍﻷﻭﻝ ﺑﺎﻷﺳﻠﻮﺏ ﺷﺒﻴﻪ ﺍﻷﺳﻠﻮﺏ ﻫﺬﺍ
ﺍﻟﻜﻼﺱ ﺍﺳﻢ ﻛﺘﺎﺑﺔ ﺍﻟﻰ ﺗﺤﺘﺎﺝ ﻟﻦ ﻫﻨﺎ...ﺍﻝ ﻛﺘﺎﺑﺔ ﻁﺮﻳﻘﺔ ﻭﺗﺒﻘﻰ ،bodyﻭﺍﻝ
Methodﺫﺍﺗﻬﺎ ﻫﻲ^_^...ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 63. CLASS KEYWORD ON JS
ﺍﻝ ﻣﻮﺿﻮﻉ ﺍﻟﻰ ﻧﻌﻮﺩ ،ﻭﺍﻵﻥPrototypeﻣﺠﺪﺩﺍ^_^..ﺳﻬﻮﻟﺔ ﺷﺎﻫﺪ ﻟﻜﻦ
ﺍﻵﻥ ﺍﻷﻣﺮ ﻫﺬﺍ^_^..
ﺍﻝ ﺃﻥ ﻫﻮ ﺍﻵﻥ ﻣﻌﺮﻓﺘﻪ ﻣﻨﻚ ﺃﺭﻳﺪ ﻣﺎprototype methodsﺃﻱ ﻫﻲ
Methodﺍﻝ ﺩﺍﺧﻞ ﻭﺿﻌﻬﺎ ﻳﺘﻢClass Body^_^...ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 64. CLASS KEYWORD ON JS
The Set & Get Method:ﻣﻦ ﻳﻤﻜﻨﻨﺎ ﺩﻭﺍﻝ ﻹﻧﺸﺎء ﺍﻟﺪﻭﺍﻝ ﻫﺬﻩ ﺗﺴﺘﺨﺪﻡ
ﺍﻝ ﻧﻄﺎﻕ ﺿﻤﻦ ﺗﺴﺘﺨﺪﻡ ﺍﻟﺘﻲ ﺍﻟﻘﻴﻢ ﺍﻟﻰ ﺍﻟﻮﺻﻮﻝ ﺧﻼﻟﻬﺎclassﻗﻴﻤﺘﻬﺎ ﺗﻐﻴﻴﺮ ﺃﻭ
ﺍﻝ ﺧﻼﻝ ﻣﻦ ﺍﺳﻨﺎﺩﻫﺎ ﺗﻢ ﺍﻟﺘﻲ ﺃﻭ ﺍﻟﺤﺎﻟﻴﺔconstructor..ﺳﻬﻞ ﺍﻟﻤﻮﺿﻮﻉ
ﺍﻝ ﻋﻦ ﻳﺨﺘﻠﻒ ﻭﻟﻢES5ﺍﻝ ﻓﻲ ﺍﻟﻤﺮﺓ ﻫﺬﻩ ﺳﻨﺴﺘﺨﺪﻣﻬﺎ ﺃﻧﻨﺎ ﺳﻮﻯ ،class^^
ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ)ﺍﻟﺘﺎﻟﻴﺔ ﺍﻟﺸﺮﻳﺤﺔ ﻓﻲ:(ﻻﺳﺘﻌﺮﺍﺽ ﺍﻹﻧﺘﻘﺎﻝ ﻗﺒﻞ ﻟﻠﻨﺘﺎﺋﺞ ﻭﺍﻧﺘﺒﻪ
ﺑﺎﻟﻨﺘﺎﺋﺞ ﺍﻟﺨﺎﺻﺔ ﺍﻟﺒﺮﻣﺠﻴﺔ ﺍﻟﺸﻴﻔﺮﺓ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 66. CLASS KEYWORD ON JS
Implementing inheritance in classes:ﻋﻦ ﺗﺤﺪﺛﻨﺎ ﻟﻘﺪ
ﺍﻝ ﻟﺘﺘﺒﻊ ﻣﺰﻋﺠﺎ ﺍﻷﻣﺮ ﻛﺎﻥ ﻛﻢ ﺳﻮﻳﺎ ﻭﺷﺎﻫﺪﻧﺎ ،ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﻓﻲ ﺍﻟﻮﺭﺍﺛﺔ
Functionﺍﻵﺧﺮ ﻣﻨﻬﻤﺎ ﻛﻞ ﻭﻭﺭﺍﺛﺔ..ﺑﺎﻝ ﺗﻄﻮﺭ ﺍﻷﺳﻠﻮﺏ ﻫﺬﺍ ﻟﻜﻦ ،ﺍﻟﺦ
ES6ﻭﻫﻲ ﻣﺤﺠﻮﺯﺓ ﻛﻠﻤﺔ ﻟﺪﻳﻨﺎ ﻓﺄﺻﺒﺢ ،extendsﻟﻨﺎ ﻟﺘﻘﺪﻡ ﻭﺟﺪﺕ ،
ﺍﻟﻮﺭﺍﺛﺔ ﻋﺎﻟﻢ ﻓﻲ ﺧﺪﻣﺎﺗﻬﺎ_^*ﺍﻝ ﻫﺬﻩ ﺗﺄﺗﻲ ﻟﻢ ﻟﻜﻦ ،extendsﺑﻞ ،ﻟﻮﺣﺪﻫﺎ
ﺍﻟﻤﺤﺠﻮﺯﺓ ﺍﻟﻜﻠﻤﺔ ﻫﻨﺎﻙ ﺃﻳﻀﺎsuperﺑﺮﻣﺠﺔ ﻟﻐﺔ ﻓﻲ ﺧﺒﺮﺓ ﺃﻱ ﻟﺪﻳﻪ ﻭﺍﻟﺬﻱ ،
ﻋﻦ ﺷﻲء ﻳﻌﻠﻢ ﻻ ﺍﻟﺬﻱ ﺃﻣﺎ ،ﻭﺃﻫﻤﻴﺘﻬﺎ ﺍﻟﻜﻠﻤﺎﺕ ﻫﺬﻩ ﺭﻭﻋﺔ ﻣﺪﻯ ﺳﻴﻌﻠﻢ ،ﺃﺧﺮﻯ
ﺗﻌﺎﻟﻰ ﷲ ﺑﺈﺫﻥ ﺍﻵﻥ ﺭﻭﻋﺘﻬﺎ ﻓﺴﺘﺪﺭﻙ ،ﺍﻟﻜﻠﻤﺎﺕ ﻫﺬﻩ^_^...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 67. CLASS KEYWORD ON JS
extends:ﺍﻝ ﺗﺴﺘﺨﺪﻡextendsﺍﻟﺨﺼﺎﺋﺺ ﻟﻮﺭﺍﺛﺔ
OR staticnon-staticﺃﻱ ﻣﻦConstructor،ﺁﺧﺮ
ﺍﻝ ﻋﻦ ﺍﻟﻨﻈﺮ ﻭﺑﻐﺾConstructorﺿﻤﻦ ﻭﺟﺪ ﻫﻞclass keyword
ﺿﻤﻦ ﻳﻮﺟﺪ ﻟﻢ ﺃﻡclassﺍﻟﻮﺭﺍﺛﺔ ﺳﺘﺘﻢ ﻓﺈﻧﻪ ،_^*
super:ﺍﻝ ﺗﺴﺘﺨﺪﻡsuperﺍﺛﻨﻴﻦ ﻷﻣﺮﻳﻦ:
(1ﺍﻝ ﺩﺍﺧﻞ ﺗﺴﺘﺨﺪﻡConstructorﺩﺍﺧﻞ ﺍﻟﻤﻮﺟﻮﺩclassﺍﻝ ﻹﺳﺘﺪﻋﺎء ،
Parent Constructor)ﺍﻝConstructorﺑﺎﻟﻜﻼﺱ ﺍﻟﺨﺎﺹ
ﻭﺭﺍﺛﺘﻪ ﺗﻢ ﺍﻟﺬﻱ.(
(2ﺍﻝ ﺩﺍﺧﻞ ﺗﺴﺘﺨﺪﻡmethodﺍﻝ ﻻﺳﺘﺪﻋﺎء ،ﻛﻼﺱ ﺩﺍﺧﻞ ﺍﻟﻤﻮﺟﻮﺩ
static or non-static methodﺍﻝ ﻣﻦclassﻭﺭﺍﺛﺘﻪ ﺗﻢ ﺍﻟﺬﻱ
ﺍﻟﺘﺎﻟﻴﺔ ﺑﺎﻟﺸﺮﻳﺤﺔ ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 69. CLASS KEYWORD ON JS
ﺍﻝ ﻣﻮﺿﻮﻉ ﻣﻦ ﺗﻌﺎﻟﻰ ﷲ ﺑﻔﻀﻞ ﺍﻧﺘﻬﻴﻨﺎ ﻧﻜﻮﻥ ﻭﻫﻜﺬﺍClassﺍﻟﺠﺎﻓﺎ ﻓﻲ
ﻫﻮ ﻋﻨﻪ ﺗﺤﺪﺛﻨﺎ ﻣﺎ ﻭﻣﻠﺨﺺ ،ﺳﻜﺮﺑﺖ)ﻟﻺﺻﺪﺍﺭES6ﺍﻝ ﻁﺮﻳﻘﺔ ﻣﺜﻞ ﻗﺒﻞ ﻭﻣﺎ
inheritﺍﻝ ﻗﺒﻞES6ﺑﺎﻝ ﻟﺸﺮﺣﻬﺎ ﺍﻟﺘﻄﺮﻕ ﺛﻢ ﻭﻣﻦES6: (
(1CLASS
(2Extends
(3Super
(4Get & Set Method
(5Object in javascript
(6Prototype
(7Constructor
(8Inheritance
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
ﻫﻨﺎ ﻣﻦ ﻭﻏﻴﺮﻫﺎ ﺗﻄﺒﻴﻘﻬﺎ ﺗﻢ ﺍﻟﺘﻲ ﺍﻷﻣﺜﻠﺔ ﺟﻤﻴﻊ ﺷﺎﻫﺪ
- 70. ﻣﻜﺎﻥ ﻛﻞ ﻓﻲ ﺍﻟﺤﻖ ﺃﻫﻞ ﺍﻧﺼﺮ ﺍﻟﻠﻬﻢ
ﺍﺳﻤﻚ ﻓﻴﻪ ُﺬﻛﺮﻳ
ﺭﺍﻳﺘﻚ ﻭﺭﻓﻊ ﻛﻠﻤﺘﻚ ﻹﻋﻼء ﻓﻴﻪ ُﺠﺎﻫﺪﻳﻭ
ﻋﺒﺎﺩﻙ ﻣﻦ ﻭﺍﻟﻤﺴﺘﻀﻌﻔﻴﻦ ﺍﻟﺤﻖ ﻷﻫﻞ ﻓﻴﻪ ُﻨﺘﺼﺮﻳﻭ
ﻣﻜﺎﻥ ﻛﻞ ﻓﻲ ﺍﻟﺤﻖ ﻷﻫﻞ ﻛﻦ ﺍﻟﻠﻬﻢ...
ﺟﻬﻠﻨﺎﻫﻢ ﻭﺇﻥ ﺍﻟﺤﻖ ﺃﻫﻞ ﺍﻧﺼﺮ ﺍﻟﻠﻬﻢ
ﻭﺃﺷﻜﺎﻟﻬﻢ ﺃﺳﻤﺎﺅﻫﻢ ﻏﺮﺗﻨﺎ ﻭﺇﻥ ﺍﻟﺒﺎﻁﻞ ﺑﺄﻫﻞ ﻭﻋﻠﻴﻚ
ﺫﻟﻚ ﺩﻭﻥ ﺗﺠﻌﻠﻨﺎ ﻭﻻ ﻟﻠﺤﻖ ﻧﺼﺮﺍ ﺍﺟﻌﻠﻨﺎ ﺍﻟﻠﻬﻢ
ﺁﻣﻴﻦ ﺍﻟﻠﻬﻢ
- 71. FOR OF LOOP
ﺍﻝFor Of Loopﺍﻹﺻﺪﺍﺭ ﻣﻦ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺍﻟﻰ ﺇﺿﺎﻓﺘﻪ ﺗﻢ ﺟﺪﻳﺪ ﺃﺳﻠﻮﺏ
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﻭﻳﺘﻢ ،ﺍﻟﺴﺎﺩﺱfor...ofﺍﻟﻌﻨﺎﺻﺮ ﻋﻠﻰ ﺗﺪﻭﺭ ﺩﻭﺭﺍﻥ ﺣﻠﻘﺔ ﻹﻧﺸﺎء
ﺳﻜﺮﺑﺖ ﺟﺎﻓﺎ ﺩﺍﺧﻞ ﻣﻮﺟﻮﺩﺓ ﻓﺌﺔ ﺃﻭ ﻣﺠﻤﻮﻋﺔ ﺃﻱ ﻓﻲ ﺍﻟﻤﻮﺟﻮﺩﺓ)object,
array, map...ﺍﻟﺦ(ﺑﺮﻣﺠﻴﺔ ﺟﻤﻠﺔ ﺗﻨﻔﻴﺬ ﻣﻦ ﻳﻤﻜﻨﻨﺎ ﺍﻷﺳﻠﻮﺏ ﻫﺬﺍ ﺃﻥ ﻛﻤﺎ ،
ﺧﺼﺎﺋﺼﻪ ﻣﻦ ﺃﻱ ﻋﻠﻰ ﻟﻠﺘﻌﺪﻳﻞ ﺣﺪﻯ ﻋﻠﻰ ﺟﻠﺒﻪ ﺗﻢ ﻋﻨﺼﺮ ﻛﻞ ﻋﻠﻰ_^*
)Invoking Custom Hook With Statement(
ﺍﻟﻌﺎﻣﺔ ﺍﻟﺼﻴﻐﺔ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 72. FOR OF LOOP
ﺍﻟﻌﺎﻣﺔ ﺍﻟﺼﻴﻐﺔ ﺷﺮﺡ:
Variable:ﺍﻟﺨﺼﺎﺋﺺ ﻣﻦ ﺟﻠﺒﻬﺎ ﻳﺘﻢ ﺍﻟﺘﻲ ﺍﻟﻘﻴﻢ ،ﺩﻭﺭﺍﻥ ﻋﻤﻠﻴﺔ ﻛﻞ ﻓﻲ
)property(ﻟﻞobject
ﺍﻝObject:ﻋﻠﻰ ﻭﺍﺣﺪﺓ ﻛﻞ ﺍﻟﺪﻭﺭﺍﻥ ﺃﺛﻨﺎء ﻣﻨﻪ ﺍﻟﻌﻨﺎﺻﺮ ﺃﺧﺬ ﻳﺘﻢ ﺍﻟﺬﻱ ﺍﻟﻜﺎﺋﻦ
ﺣﺪﺓ_^*
ﺍﻟﻌﺮﺑﻴﺔ ﺍﻟﻠﻐﺔ ﻓﻲ ﻣﻼﺣﻈﺔ:“ﺣﺪﻯ“ﺃﻭ“ﺣﺪﺍ“ﻭﺍﻟﺼﺤﻴﺢ ،ﺧﺎﻁﺌﺔ ﻛﺘﺎﺑﺔ ﻫﻲ
ﺍﻟﻤﺮﺑﻮﻁﺔ ﺑﺎﻟﺘﺎء ﻛﺘﺎﺑﻬﺎ“ﺣﺪﺓ“
ﻣﻌﺠﻢ ﻓﻲ ﺟﺎء)ﺍﻟﻠﻐﺔ ﻣﺘﻦ/ﻭﺣﺪ:(
»ًﺓَﺪِﻭﺣ ًﺍﺪْﺣَﻭ ُﺪِﺤَﻳ َﺪَﺣَﻭ:ﻩَﺪْﺣَﻭ ﺻﺎﺭ«.ﻓﻴﻪ ﻭﺟﺎء:
»ُﺓَﺪِﺍﻟﺤ:ﺓَﺪِﻌﻛﺎﻟ)ﺪﺭْﺼَﻣ.(ﺗﻘﻮﻝ:ُﻩَﺪْﺣَﻭ ًﺍﻔﺮﺩْﻨُﻣ ﺃﻱ ،ٍﺓَﺪِﺣ ﻋﻠﻰ ﻪَﻠَﻌَﺟ.ﻭﺗﻘﻮﻝ:ﻪَﻠَﻌَﻓ
ﺫﺍﺕ ﻭﻣﻦ ﻪِﺴْﻔَﻧ ﺫﺍﺕ ﻣﻦ ﺃﻱ ،ﻪِﺗَﺪِﺣ ﺫﻱ ﻭﻣﻦ ﻪِﺗَﺪِﺣ ﺫﺍﺕ ﻭﻋﻠﻰ ،ِﻪِﺗَﺪِﺣ ﺫﺍﺕ ﻣﻦ
ﺭﺃﻳﻪ.ﻭﺗﻘﻮﻝ:ﱠﻦِﻬِﺗَﺪِﺣ ﻭﻋﻠﻰ ،ﻬﻢِﺗَﺪِﺣ ﻭﻋﻠﻰ ،ﻬﻤﺎِﺗَﺪِﺣ ﻭﻋﻠﻰ ،ﻪِﺗَﺪِﺣ ﻋﻠﻰ َﺲَﻠَﺟ.«
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 73. FOR OF LOOP
ﺍﻝ ﻋﻦ ﺍﻟﺤﺪﻳﺚ ﻗﺒﻞFor Ofﻋﻠﻰ ﺃﻣﺜﻠﺔ ﻧﺸﺎﻫﺪ ﺩﻋﻮﻧﺎFor Loopﻧﺴﺘﺨﺪﻣﻬﺎ
ﻣﺜﻞFor InﺃﻭForﺃﻭ
For eachﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 74. FOR OF LOOP
،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺃﺳﺎﺳﻴﺎﺕ ﻣﻦ ﻓﺘﻠﻚ ،ﺍﻟﺴﺎﺑﻖ ﺍﻟﻤﺜﺎﻝ ﺷﺮﺡ ﻋﻦ ﺃﺗﺤﺪﺙ ﻟﻦ ،ﻭﺍﻵﻥ
ﺍﻝ ﺃﺟﻠﻬﺎ ﻣﻦ ﺟﺎﺋﺖ ﺍﻟﺘﻲ ﻭﺍﻟﻤﺸﻜﻠﺔ ،ﺍﻷﺳﺎﻟﻴﺐ ﺗﻠﻚ ﺳﻠﺒﻴﺎﺕ ﻫﻮ ﺳﺄﺫﻛﺮﻩ ﻣﺎ ﻟﻜﻦ
For OF_^*
1(For In:
*ﺍﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻨﻚ ﻻbreak, continue
*ﺟﻤﻴﻊ ﻋﻠﻰ ﺑﺎﻟﺪﻭﺭﺍﻥ ﺗﻘﻮﻡ“ﺍﻟﺨﺼﺎﺋﺺ“ﻟﻠﻌﺪ ﺍﻟﻘﺎﺑﻠﺔ)ﺍﻟﻤﺜﺎﻝ ﻻﺣﻆ
ﺍﻟﺴﺎﺑﻖ(
*ﻣﺎ ﻓﺈﻥ ،ﺭﻗﻢ ﻛﺎﻥ ﻟﻮ ﻭﺣﺘﻰ ،ﻧﺼﻲ ﺷﻜﻞ ﻋﻠﻰ ﺍﻟﺒﻴﺎﻧﺎﺕ ﺍﺭﺟﺎﻉ ﻋﻠﻰ ﺗﻘﻮﻡ
ﻫﻮ ﺍﺭﺟﺎﻋﻪ ﻳﺘﻢ“1”ﺗﺼﺒﺢ ﺍﻟﺠﻤﻊ ﻭﻋﻨﺪ“1”+“2”=“3”ﻭﻫﺬﻩ
ﺳﻴﺌﺔ ﻋﻤﻠﻴﺔ
*،ﻣﺎ ﻟﺴﺒﺐ ﺍﻟﺘﻜﺮﺍﺭ ﻳﺰﻳﺪ ﻗﺪ ﺍﻟﻈﺮﻭﻑ ﺑﻌﺾ ﻓﻲ ﺃﻧﻬﺎ ﻣﺸﺎﻛﻠﻬﺎ ﺇﺣﺪﻯ ﻣﻦ
ﺍﻟﺨﺎﺹ ﺍﻟﺘﺮﺗﻴﺐ ﻳﻀﻤﻦ ﻣﺎ ﻳﻮﺟﺪ ﻻ ﺃﻧﻪ ﻛﻤﺎ ،ﻛﺜﻴﺮﺓ ﻣﺸﺎﻛﻞ ﻳﺴﺒﺐ ﻭﻫﺬﺍ
ﺍﻟﻤﺼﻔﻮﻓﺔ ﺩﺍﺧﻞ ﺭﺗﺒﺖ ﻛﻤﺎ ﺗﻈﻬﺮ ﺃﻥ ﺑﺎﻟﻨﺘﺎﺋﺞ...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 75. FOR OF LOOP
2(Foreach:
*ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﻳﻤﻜﻦ ﻻbreak, continue
*ﺍﻝ ﻣﻊ ﻓﻘﻂ ﺍﺳﺘﺨﺪﺍﻣﻬﺎ ﻳﻤﻜﻦArray Objects
3(Default For Loop:
*ﺧﻼﻝ ﻣﻦ ﺍﻟﻤﺼﻔﻮﻓﺔ ﻋﻨﺎﺻﺮ ﻋﺪﺩ ﺑﻤﻌﺮﻓﺔ ﻭﺗﻠﺰﻣﻨﻲ ،ﻣﺎ ﻧﻮﻋﺎ ﻁﻮﻳﻠﺔ
ﺍﻟﺪﺍﻟﺔ ﺍﺳﺘﺨﺪﺍﻡ ﺧﻼﻝ ﻣﻦ ﺃﻭ ﺭﻗﻢlength...
*ﺍﺳﺘﺨﺪﺍﻡ ﺍﻟﻰ ﻓﺴﺘﺤﺘﺎﺝ ،ﺧﻼﻟﻬﺎ ﻣﻦ ﻣﺒﺎﺷﺮﺓ ﺍﻟﻘﻴﻤﺔ ﺍﻟﻰ ﺍﻟﻮﺻﻮﻝ ﻳﻤﻜﻦ ﻻ
ﻭﺍﻝ ﺍﻟﻤﺼﻔﻮﻓﺔindexﺍﻟﻘﻴﻤﺔ ﻋﻠﻰ ﻟﻠﺤﺼﻮﻝ ﻓﻴﻪ ﺍﻟﻤﺘﻮﺍﺟﺪ..
ﺍﻝ ﻓﻜﺮﺓ ،ﺍﻵﻥFor Ofﻭﺭﺩﺕ ﺍﻟﺘﻲ ﺍﻟﻤﺸﺎﻛﻞ ﻫﺬﻩ ﺑﺤﻞ ﻟﺘﻘﻮﻡ ﺃﺗﺖ_^*
ﻣﺜﺎﻻ ﻟﻨﺸﺎﻫﺪ ،ﻭﻋﻠﻴﻬﺎ^ _^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 77. FOR OF LOOP
ﻣﺜﺎﻝ2:ﺗﺤﺘﻮﻱ ﻣﺼﻔﻮﻓﺔ ﻋﻠﻰ ﺑﺎﻟﺪﻭﺭﺍﻥ ﺳﻨﻘﻮﻡ ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﻓﻲobject
ﺍﻝ ﻫﺬﺍ ﻗﻴﻢ ﺍﻟﻰ ﺍﻟﻮﺻﻮﻝ ﻳﻤﻜﻨﻨﻲ ﻭﻛﻴﻒ ،ﺑﺪﺍﺧﻠﻬﺎobjectﺑﺴﻬﻮﻟﺔ^_^
ﻣﻼﺣﻈﺔ:ﺃﻥ ﺇﻧﺘﺒﻪempInfoﺧﻼﻝ ﻣﻦ ﺗﻌﺮﻳﻔﻬﺎ ﻳﺘﻢ ﻟﻢ ﺍﺫﺍletﺃﻭvarﻗﺒﻞ
ﺧﻄﺄ ﻟﻚ ﺳﻴﻈﻬﺮ ﺍﻹﺳﺘﺨﺪﺍﻡ ﺃﺛﻨﺎء ﺃﻭ ﺍﻹﺳﺘﺨﺪﺍﻡempInfo is not defined
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 78. “0O” LITERAL
ﺍﻝ0oﺍﻟﺜﻤﺎﻧﻲ ﺍﻟﻨﻈﺎﻡ ﻣﻦ ﺍﻷﺭﻗﺎﻡ ﻟﺘﻌﺮﻑ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻓﻲ ﺟﺪﻳﺪﺓ ﻁﺮﻳﻘﺔ ﻫﻲ
)octal(ﻣﻊ ﻟﻠﺘﻌﺎﻣﻞ ﻋﻤﻠﻬﻢ ﺍﻟﻤﺒﺮﻣﺠﻴﻦ ﻋﻠﻰ ﻟﻴﺴﻬﻞ ﺟﺎء ﺍﻷﺳﻠﻮﺏ ﻭﻫﺬﺍ ،
ﺍﻟﺜﻤﺎﻧﻲ ﺍﻟﻨﻈﺎﻡ.
ﺩﺍﺧﻠﻲ ﺑﺸﻜﻞ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﺑﻪ ﻳﻘﻮﻡ ﻣﺎ ﺇﻥ)ﺗﺪﺧﻠﻨﺎ ﺩﻭﻥ(ﺍﻟﺜﻤﺎﻧﻲ ﺍﻟﻨﻈﺎﻡ ﺗﺤﻮﻳﻞ
ﺃﻧﻬﺎ ﻋﻠﻰ ﺍﻟﻘﻴﻤﺔ ﺣﻔﻆ ﺛﻢ ﻭﻣﻦ ﺍﻟﻌﺸﺮﻱ ﺍﻟﻨﻈﺎﻡ ﺍﻟﻰbinary.^_^.
ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 79. "0b” LITERAL
0bﺍﻝ ﻫﺬﺍ ﺍﺳﺘﺨﺪﺍﻡ ﻳﺘﻢLiteralﻹﻧﺸﺎء)ﺭﻗﻢ(ﺍﻝ ﺧﻼﻝ ﻣﻦbinary
ﻣﺒﺎﺷﺮﺓ^_^ﺑﺎﻟﺸﻜﻞ ﺍﻷﺭﻗﺎﻡ ﺑﺘﻌﺮﻳﻒ ﺍﻟﻤﺒﺮﻣﺠﻴﻦ ﻳﻘﻮﻡ ،ﺍﻹﻓﺘﺮﺍﺿﻴﺔ ﺍﻟﺤﺎﻟﺔ ﻓﻲ ،
ﺍﻝ ﻳﻘﻮﻡ ﺛﻢ ﻭﻣﻦ ،ﺍﻟﻌﺸﺮﻱjsﺍﻟﻰ ﺍﻟﺮﻗﻢ ﻫﺬﺍ ﺑﺘﺤﻮﻳﻞbinaryﻳﺘﻢ ﺛﻢ ﻭﻣﻦ
ﻫﺬﺍ ﻟﻜﻦ ،ﺍﻟﺬﺍﻛﺮﺓ ﻓﻲ ﺣﻔﻈﻪLiteralﺍﻟﺮﻗﻢ ﺣﻔﻆ ﻣﻦ ﺳﻴﻤﻜﻨﻚbinary
ﻣﺒﺎﺷﺮﺓ^_^...
ﺍﻟﻤﺜﺎﻝ ﺷﺎﻫﺪ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 81. YIELD KEYWORD & FUN *()
ﻣﻦ ﺍﻟﺴﺎﺩﺱ ﺍﻹﺻﺪﺍﺭ ﻓﻲECMAScriptﻟﻠﺠﺎﻓﺎ ﺟﺪﻳﺪﺓ ﻣﻴﺰﺓ ﺇﺩﺭﺍﺝ ﺗﻢ
ﺗﺴﻤﻰ ،ﺳﻜﺮﺑﺖJavaScript Generatorﺍﻝ ﻫﺬﺍ ﻭﻳﺘﻜﻮﻥ ،
Generatorﺍﻟﻤﺤﺠﻮﺯﺓ ﺍﻟﻜﻠﻤﺔ ﺑﺎﺳﺘﺨﺪﺍﻡYieldﺍﻝ ﻭﺍﺳﺘﺨﺪﺍﻡ
function*()ﺍﻟﺒﺮﻣﺠﻴﺔ ﺍﻟﺸﻴﻔﺮﺓ ﻓﻲ^_^
Yield keyword + functon * () syntax used => JS Generator
ﺍﻝ ﻳﻘﺪﻣﻬﺎ ﺍﻟﺘﻲ ﺍﻟﻮﻅﻴﻔﺔ ﻓﺈﻥ ،ﻭﺑﺎﺧﺘﺼﺎﺭJS Generatorﺇﺿﺎﻓﺔ ﻫﻲ
ﻟﻞ ﺟﺪﻳﺪﺓ ﻁﺮﻳﻘﺔfunctionﻻﺭﺟﺎﻉ)return(ﻗﻴﻢ ﻣﻦ ﻣﺠﻤﻮﻋﺔ
)Collection(ﺟﺪﻳﺪ ﺍﺳﻠﻮﺏ ﺑﺈﺿﺎﻓﺔ ﺗﻘﻮﻡ ﻛﻤﺎ ،-ﻣﻨﻄﻘﻲ-ﺍﻟﺪﻭﺭﺍﻥ ﺟﻤﻠﺔ ﻓﻲ
ﺍﻝ ﻣﻦ ﺍﺳﺘﺮﺟﺎﻋﻬﺎ ﺳﻴﺘﻢ ﺍﻟﺘﻲ ﺍﻟﻘﻴﻢ ﻻﺳﺘﻘﺒﺎﻝCollectionﺑﺎﻝ ﺍﻟﻤﻮﺟﻮﺩﺓ
function* ()...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 82. YIELD KEYWORD & FUN *()
ﺍﻝ ﻫﺬﻩ ﻣﻤﻴﺰﺍﺕ ﺃﻫﻢ ﻣﻦGeneratorﺍﻟﺘﻮﻗﻒ ﺇﻣﻜﺎﻧﻴﺔ ﻫﻮ ﺍﻧﺸﺎﺋﻬﺎ ﺳﻴﺘﻢ ﺍﻟﺘﻲ
ﻣﻦ ﺍﻟﺨﺎﻣﺲ ﻟﻠﻌﻨﺼﺮ ﺃﺻﻞ ﺃﻥ ﻳﻤﻜﻨﻨﻲ ﻣﺜﻼ ،ﺍﺳﺘﺨﺪﺍﻣﻬﺎ ﻳﻤﻜﻦ ﺍﻟﺘﻲ ﻭﺍﻹﺳﺘﻤﺮﺍﺭ
ﺍﻝGeneratorﺍﻟﻌﻤﻠﻴﺔ ﺃﺗﺎﺑﻊ ﺛﻢ ﻭﻣﻦ ،ﺃﺧﺮﻯ ﺑﺮﻣﺠﻴﺔ ﺷﻴﻔﺮﺓ ﻟﺘﻨﻔﻴﺬ ﺃﺫﻫﺐ ﺛﻢ
ﺍﻟﻤﺮﻭﺭ ﺃﻭ ﻣﺜﻼ ﺍﻟﺪﻭﺭﺍﻥ ﺇﻋﺎﺩﺓ ﺍﻟﻰ ﺍﻟﺤﺎﺟﺔ ﺩﻭﻥ ﻣﺒﺎﺷﺮﺓ ﺍﻟﺴﺎﺩﺱ ﺍﻟﻌﻨﺼﺮ ﺑﺄﺧﺬ
ﺧﻼﻝ ﻣﻦ ﻫﺬﺍ ﻭﻳﺘﻢ ،ﺍﻟﻘﻴﻢ ﺟﻤﻴﻊ ﻋﻠﻰnext()ﺍﻟﺸﺮﺍﺋﺢ ﻓﻲ ﺳﻨﺸﺎﻫﺪ ﻛﻤﺎ
ﺍﻟﻘﺎﺩﻣﺔ..ﺍﻝ ﺃﻥ ﻛﻤﺎ ،Generatorﺍﻟﻘﻴﻤﺔ ﺑﺎﺭﺟﺎﻉ ﺗﺘﻤﻴﺰ)value(ﻭ
)done(ﺍﻝ ﺗﻜﻮﻥ ﺑﺤﻴﺚvalueﺍﺭﺟﺎﻋﻬﺎ ﺍﻟﻤﺮﺍﺩ ﺍﻟﻘﻴﻤﺔ ﻫﻲ)ﻣﺎ ﺃﻱ ﻭﺗﻜﻮﻥ
ﺍﻝ ﻗﺒﻞ ﻣﻦ ﺍﺭﺟﺎﻋﻪ ﻳﻤﻜﻦyield(ﻭﺍﻝ ،doneﻳﻤﺜﻞBooleanﺍﻟﻰ ﻳﺸﻴﺮ
ﻟﻠﺪﺍﻟﺔ ﻻ ﺃﻡ ﺍﻹﺭﺟﺎﻉ ﻋﻤﻠﻴﺔ ﺍﻧﺘﻬﺎء
ﺍﻟﻤﻮﺿﻮﻉ ﻋﻠﻰ ﻋﻤﻠﻴﺔ ﺃﻣﺜﻠﺔ ﻟﻨﺸﺎﻫﺪ ﻭﺍﻵﻥ^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 83. YIELD KEYWORD & FUN *()
ﺳﺎﺑﻘﺎ)ﺍﻝ ﻗﺒﻞES6:(ﻣﺠﻤﻮﻋﺔ ﺍﺳﺘﻘﺒﺎﻝ ﻛﻴﻔﻴﺔ ﻋﻠﻰ ﺍﻟﺘﻘﻠﻴﺪﻱ ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﺷﺎﻫﺪ
ﺟﺪﺍ ﺑﺴﻴﻄﺔ ﻁﺮﻳﻘﺔ ،ﺍﻟﻘﻴﻢ ﻣﻦ..ﺍﻟﺘﺎﻟﻴﺔ ﺍﻟﺸﺮﻳﺤﺔ ﺍﻟﻰ ﻟﻨﻨﺘﻘﻞ ﺍﻵﻥ_^*
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 84. YIELD KEYWORD & FUN *()
ﺍﻝ ﺑﺎﺳﺘﺨﺪﺍﻡ ﻣﺜﺎﻝJS Generator:
ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﺷﺎﻫﺪ
ﻟﻜﻞ ﺟﻴﺪﺍ ﻭﺍﻧﺘﺒﻪ
ﻣﻠﻮﻥ ﻫﻮ ﻣﺎ^_^
؟ ﺍﻧﺘﻬﻴﺖ ﻫﻞ
ﺑﺘﻨﻔﻴﺬ ﻗﻤﺖ ﻫﻞ
؟ ﺍﻟﺒﺮﻣﺠﻴﺔ ﺍﻟﺸﻴﻔﺮﺓ
ﺧﻄﺄ ﻟﻚ ﻅﻬﺮ ﻫﻞ
ﻓﻲ ﻣﻮﺟﻮﺩ ﻫﻮ ﻛﻤﺎ
؟ ﺍﻟﺼﻮﺭﺓ ﺃﺳﻔﻞ
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 85. YIELD KEYWORD & FUN *()
ﺍﻝ ﻗﺪﺭﺓ ﺑﻌﺪﻡ ﺗﺨﺒﺮﻙ ﻫﺬﻩ ﺍﻟﺨﻄﺄ ﺭﺳﺎﻟﺔbrowsers.jsﺑﺎﺳﺘﺨﺪﺍﻣﻪ ﻗﻤﻨﺎ ﺍﻟﺬﻱ
ﺍﻝ ﺗﺤﻤﻴﻞ ﺑﻌﺪbabel compilerﺍﻝ ﺗﻨﻔﻴﺬ ﻋﻠﻰGeneratorﺍﻝ ﺃﺛﻨﺎء
Runtime...؟ ﺍﻟﺤﻞ ﻣﺎ ﺍﺫﺍ
ﺍﻝ ﺗﻀﻤﻴﻦ ﺃﻭ ﺑﺎﺳﺘﺨﺪﺍﻡ ﻫﻮ ﺍﻟﺤﻞbrowser-polyfill.jsﺑﺎﻝ ﺃﻳﻀﺎ ﺍﻟﺨﺎﺹ
Babel_^*ﺍﻝ ﺗﻀﻤﻴﻦ ﻋﻠﻰ ﻫﺬﺍ ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻣﻠﻒ ﻭﻳﻘﻮﻡ ،runtime
ﻭﺍﻝcore jsﺍﻝ ﻣﻦ ﺃﻱ ﺍﺳﺘﺨﺪﺍﻡ ﺣﺎﻝ ﻓﻲ ﺗﻠﻘﺎﺋﻲ ﺑﺸﻜﻞBabel nodeﺃﻭ
Babel registerﺗﻀﻤﻴﻨﻪ ﻳﺘﻢ ﺃﻥ ﻳﺠﺐ ﺍﻟﻤﻠﻒ ﻫﺬﺍ ﺃﻥ ﻭﺍﻧﺘﺒﻪ ،“ﺃﻱ ﻗﺒﻞ
ﺏ ﺧﺎﺻﺔ ﺑﺮﻣﺠﻴﺔ ﺷﻴﻔﺮﺓBabel...”
This needs to be included before all your compiled Babel code.
)ﺍﻝ ﺑﺎﺳﺘﺨﺪﺍﻡ ﻗﻤﺖ ﺣﺎﻟﺔ ﻓﻲ ﺍﻟﻤﻠﻒ ﻫﺬﺍ ﺍﺳﺘﺪﻋﺎء ﻋﻦ ﺍﻹﺳﺘﻐﻨﺎء ﻳﻤﻜﻨﻚ ﻁﺒﻌﺎbabelﺷﻜﻞ ﻋﻠﻰ
babel/polyfill
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 86. YIELD KEYWORD & FUN *()
ﺍﻟﻜﺎﻣﻞ ﺑﺸﻜﻠﻪ ﺍﻟﻤﺜﺎﻝ ﻟﻨﺸﺎﻫﺪ ﻭﺍﻵﻥ:
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 87. YIELD KEYWORD & FUN *()
ﻣﺜﺎﻝ2:ﺍﻝ ﺩﻭﺭ ﻫﻨﺎ ﻻﺣﻆnext^_^..ﻗﻤﺖ ﻟﻤﺎﺫﺍ ،ﻫﺬﺍ ﻗﺒﻞ ﻻﺣﻆ ﻭﻟﻜﻦ
ﺑﺘﺨﺰﻳﻦcollection_name()؟ ﻣﺘﻐﻴﺮ ﺩﺍﺧﻞ!
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 88. YIELD KEYWORD & FUN *()
ﺍﻝ ﺑﺘﺨﺰﻳﻦ ﻧﻘﻢ ﻟﻢ ﻟﻮ ،ﺍﻟﺴﺎﺑﻖ ﺍﻟﻤﺜﺎﻝ ﻓﻲcollection_name()ﺩﺍﺧﻞ
ﻗﻴﻤﺔ ﺃﻭ ﺩﺍﺋﻤﺎ ﺳﻴﻜﻮﻥ ﺍﻟﻨﺎﺗﺞ ﻓﺈﻥ ،ﻣﺘﻐﻴﺮYield....
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 89. YIELD KEYWORD & FUN *()
ﻣﺜﺎﻝ3:ﺍﻝ ﺑﺎﺳﺘﺪﻋﺎء ﻗﻤﺖ ﻫﻨﺎvalueﺍﻝ ﺩﺍﺧﻞ ﻣﺒﺎﺷﺮﺓconsoleﺃﻧﻨﻲ ﻛﻤﺎ ،
ﺍﻝ ﺃﺣﺪ ﺩﺍﺧﻞ ﻣﺼﻔﻮﻓﺔ ﺑﺤﻔﻆ ﻗﻤﺖyieldﺍﺳﺘﺪﻋﺎﺋﻬﺎ ﺛﻢ ﻭﻣﻦ ،..
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 90. YIELD KEYWORD & FUN *()
ﻣﺜﺎﻝ4:ﺍﻝ ﺍﺳﺘﺨﺪﻣﺖ ﺃﻧﻨﻲ ﻻﺣﻆ ،ﺍﻟﺠﻤﻴﻞ ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﻓﻲyieldﻭﻛﺄﻧﻬﺎ
returnﻭﺃﻧﻮﺍﻋﻬﺎ ﺍﻟﺒﻴﺎﻧﺎﺕ ﻣﺨﺘﻠﻒ ﺍﺭﺟﺎﻉ ﺍﺳﺘﻄﻌﺖ ﻭﺑﻬﺬﺍ ،)data type(
ﺍﻝ ﺧﻼﻝ ﻣﻦyield...
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 91. YIELD KEYWORD & FUN *()
ﺍﻟﺪﻭﺭﺓ ﻫﺬﻩ ﻓﻲ ﺃﺧﺮﻯ ﺟﺰﺋﻴﺔ ﺍﻟﻰ ﻧﻨﺘﻘﻞ ،ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﻭﺑﻌﺪ ،ﻭﺍﻵﻥ
ﺍﻷﻣﺜﻠﺔ ﺟﻤﻴﻊ ﻟﻨﺸﺎﻫﺪ ،ﺍﻟﺠﺪﻳﺪ ﺍﻟﻤﻮﺿﻮﻉ ﺍﻟﻰ ﺍﻹﻧﺘﻘﺎﻝ ﻭﻗﺒﻞ ﻟﻜﻦ ،ﺍﻟﻤﺘﻮﺍﺿﻌﺔ
ﺍﻟﻤﻮﺿﻮﻉ ﻫﺬﺍ ﻓﻲ ﺑﻌﺮﺿﻬﺎ ﻗﻤﻨﺎ ﺍﻟﺘﻲ)..ﺍﻟﻤﻬﻢ ﻫﻮ ﺍﻟﺘﻄﺒﻴﻖ ﺃﻥ ﺗﻨﺴﻰ ﻭﻻ(
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 92. ﺍﻟﺮﺟﻴﻢ ﺍﻟﺸﻴﻄﺎﻥ ﻣﻦ ﻮﺫ ﺑﺎہﻠﻟ
َ ﱠﷲ ﱠﻥِﺇ َ ﱠﷲ ﻮﺍُﻘﱠﺗﺍَﻭ ٍﺪَﻐِﻟ ْﺖَﻣﱠﺪَﻗ ﺎﱠﻣ ٌﺲْﻔَﻧ ْﺮُﻈﻨَﺘْﻟَﻭ َ ﱠﷲ ﻮﺍُﻘﱠﺗﺍ ﻮﺍُﻨَﻣﺁ َﻳﻦِﺬﱠﺍﻟ ﺎَﻬﱡﻳَﺃ ﺎَﻳ
َﻮﻥُﻠَﻤْﻌَﺗ ﺎَﻤِﺑ ٌﺮﻴِﺒَﺧ
ﺍﻟﻌﻈﻴﻢ ﷲ ﺻﺪﻕ
ﺍﻟﺤﺸﺮ ﺳﻮﺭﺓ–ﺍﻵﻳﺔ:18
- 93. SET OBJECT
ﻫﻨﺎﻙ ﻳﻜﻦ ﻟﻢ ،ﺳﻜﺮﺑﺖ ﺍﻟﺠﺎﻓﺎ ﻣﻦ ﺍﻟﺨﺎﻣﺲ ﻟﻺﺻﺪﺍﺭ ﻭﺻﻮﻻcollection
ﺍﻝ ﺳﻮﻯArrayﺑﺘﻌﺮﻳﻒ ﺭﻏﺒﻨﺎ ﺍﺫﺍ ﻭﻛﻨﺎ ،indexﺍﻝ ﻧﺴﺘﺨﺪﻡ ﺭﻗﻤﻲ ﻏﻴﺮ
objectﺍﻝ ﻓﻈﻬﺮﻣﻔﻬﻮﻡ ،ﺍﻟﻴﻮﻡ ﺑﻌﺪ ﻳﻜﻔﻲ ﻳﻌﺪ ﻟﻢ ﺍﻷﻣﺮ ﻫﺬﺍ ﻟﻜﻦ ،“SET”
ﻟﻺﺻﺪﺍﺭ ﺳﻜﺮﺑﺖ ﺑﺎﻟﺠﺎﻓﺎ6)ﺍﻟﻤﻬﺎﻡ ﻟﺘﺤﻘﻴﻖ ﺃﺩﺍء ﻭﺃﻓﻀﻞ ﺍﺣﺘﺮﺍﻓﻴﺔ ﺃﻛﺜﺮ ﺍﻟﻬﺪﻑ(
ﺍﻝ ﻁﺒﻌﺎSETﻣﻌﺮﻭﻓﺔ ﻓﻬﻲ ،ﺍﻟﺒﺮﻣﺠﺔ ﻟﻐﺎﺕ ﻋﻠﻰ ﺟﺪﻳﺪﺍ ﻣﻔﻬﻮﻣﺎ ﻟﻴﺴﺖ
ﺍﻝ ﻟﻤﺒﺮﻣﺠﻴﻦpythonﻭﺍﻟﺠﺎﻓﺎ..ﺍﻝ ﺗﻌﺮﻳﻒ ﺃﻣﺎ ،ﺍﻟﺦSETﻓﻬﻮ:
ﺍﻟﺘﻲ ﺍﻟﻘﻴﻢ ﻣﻦ ﻣﺮﺗﺒﺔ ﻗﺎﺋﻤﺔ،ﺗﻜﺮﺍﺭﻫﺎ ﻳﻤﻜﻦ ﻻﺍﻟﻘﻴﻢ ﻫﺬﻩ ﻛﺎﻧﺖ ﺳﻮﺍء
primitiveﺃﻭobject...^_^.
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 94. SET OBJECT
ﺍﻝ ﻣﻦ ﺍﻟﺒﺴﻴﻄﺔ ﺍﻟﺼﻴﻐﺔ ﻳﻮﺿﺢ ﻣﺜﺎﻻ ﻟﻨﺸﺎﻫﺪ ﻭﺍﻵﻥSetﻳﻤﻜﻨﻨﺎ ﻭﺍﻟﺘﻲ
ﺍﺳﺘﺨﺪﺍﻣﻬﺎ^_^:
ﺃﻥ ﺍﻟﺒﺴﻴﻂ ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﻓﻲ ﻻﺣﻆ
ﺍﻝSet()ﺍﻝ ﺣﺮﻑ ﻓﻴﻬﺎ ﻳﻜﺘﺐ
S Capital...
ﺍﻝ ﺃﻣﺎadd:ﻟﻠﻤﺼﻔﻮﻓﺔ ﺟﺪﻳﺪﺓ ﻋﻨﺎﺻﺮ ﺇﺿﺎﻓﺔ ﻋﻦ ﺍﻟﻤﺴﺆﻭﻟﺔ ﺍﻟﺪﺍﻟﺔ ﻓﻬﻲ.
ﺍﻝsize:ﺍﻝ ﺣﺠﻢ ﺗﺤﺪﻳﺪ ﻋﻦ ﺍﻟﻤﺴﺆﻭﻟﺔ ﺍﻟﺪﺍﻟﺔ ﻫﻲSet_^*
ﺍﻟﻤﺜﺎﻝ ﺑﺘﻨﻔﻴﺬ ﻗﻢ..ﺍﻟﺘﺎﻟﻴﺔ ﻟﻠﺸﺮﻳﺤﺔ ﺍﻧﺘﻘﻞ ﺛﻢ..
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 95. SET OBJECT
ﻣﺜﺎﻝ1:
ﻟﻠﺮﻗﻢ ﺍﻹﺿﺎﻓﺔ ﻋﻤﻠﻴﺔ ،ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﻓﻲ ﺍﻟﻤﻬﻤﺔ ﺍﻟﻔﻜﺮﺓ ﻻﺣﻆ24ﺷﻜﻞ ﻋﻠﻰ ﻛﺎﻧﺖ
ﻧﺼﻲ ﺷﻜﻞ ﻭﻋﻠﻰ ،ﻭﺍﻟﺜﺎﻧﻲ ﺍﻷﻭﻝ ﻓﻲ ﺭﻗﻤﻲ“24”ﻟﻜﻦ ،ﺍﻟﺜﺎﻟﺚ ﺍﻟﺴﻄﺮ ﻓﻲ
ﺍﻝ ﻟﺤﺠﻢ ﺍﻟﻨﻬﺎﺋﻴﺔ ﺍﻟﻨﺘﻴﺠﺔSetﺳﻴﻜﻮﻥ3؟!؟ ﺑﺮﺃﻳﻚ ﻟﻤﺎﺫﺍ
ﺍﻝ ﺑﺄﻥ ﻳﻜﻤﻦ ﺍﻟﺠﻮﺍﺏSetﻳﺘﻢ ﺍﻟﺘﻜﺮﺍﺭ ﻓﺈﻥ ﻭﻟﺬﻟﻚ ،ﺫﻛﺮﻧﺎ ﻛﻤﺎ ﺍﻟﺘﻜﺮﺍﺭ ﺗﻤﻨﻊ
ﻗﻴﻤﺔ ﺑﻴﻦ ﻣﻴﺰ ﺍﻟﻮﻗﺖ ﺑﺬﺍﺕ ﻟﻜﻨﻪ ،ﺗﺠﺎﻫﻠﻪ24ﻭﺍﻝ ﺍﻟﺮﻗﻤﻴﺔ24ﺍﻟﻨﺼﻴﺔ^_^
ﺍﻟﺸﻜﻞ ﻳﺼﺒﺢ ﻭﺑﻬﺬﺍ ،ﻓﻘﻂ ﺍﺩﺧﻠﺖ ﻗﻴﻤﺔ ﺃﻭﻝ ﺍﻋﺘﻤﺎﺩ ﻭﻳﺘﻢ24-”24”-”anees”
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 96. SET OBJECT
ﻣﺜﺎﻝ2:ﻟﻞ ﺍﺑﺘﺪﺍﺋﻴﺔ ﻗﻴﻤﺔ ﺗﻌﺮﻳﻒ ﻳﻤﻜﻨﻨﺎSetﺩﻭﻥ ﻣﺒﺎﺷﺮﺓ ﺑﺎﻧﺸﺎﺋﻬﺎ ﻧﺮﻏﺐ ﺍﻟﺘﻲ
ﺍﻟﺪﺍﻟﺔ ﺍﺳﺘﺨﺪﺍﻡadd()ﻣﺼﻔﻮﻓﺔ ﺷﻜﻞ ﻋﻠﻰ ﺍﻟﻘﻴﻢ ﺍﺭﺳﺎﻝ ﺧﻼﻝ ﻣﻦ ﺫﻟﻚ ﻭﻳﻜﻮﻥ ،
ﺍﻟﻰconstructor^_^..ﺍﻟﻤﺜﺎﻝ ﻟﻨﺸﺎﻫﺪ:
،ﺗﻠﻘﺎﺋﻲ ﺑﺸﻜﻞ ﺗﺘﻢ ﺍﻟﺘﻜﺮﺍﺭ ﺗﺠﺎﻫﻞ ﻋﻤﻠﻴﺔ ﺃﻥ ﻫﻨﺎ ﻻﺣﻆ)ﺍﻟﻤﻘﺎﺭﻧﺔ ﻋﻤﻠﻴﺔ ﺑﺎﻟﻤﻨﺎﺳﺒﺔ
ﺍﻟﺘﺎﻟﻲ ﺑﺎﻟﺸﻜﻞ ﺗﺘﻢ( ===ﺗﻜﻮﻥ ﺃﻥ ﻳﻤﻜﻦ ﺍﺭﺳﺎﻟﻬﺎ ﺗﻢ ﺍﻟﺘﻲ ﺍﻟﻘﻴﻢ ﺃﻥ ﻛﻢ ،objﺃﻭ
ﻋﺎﺩﻱ ﺭﻗﻢ ﺃﻭ ﻣﺼﻔﻮﻓﺔ..ﺍﻟﺦ
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 97. SET OBJECT
ﻣﺜﺎﻝ3:
ﺗﺪﻋﻰ ﺟﺪﻳﺪﺓ ﻟﺪﺍﻟﺔ ﺗﻄﺮﻗﻨﺎ ﺍﻟﻤﺜﺎﻝ ﻫﺬﺍ ﻓﻲhasﻣﻦ ﺍﻟﺘﺄﻛﺪ ﻋﻠﻰ ﺗﻘﻮﻡ ﺍﻟﺪﺍﻟﺔ ﻫﺬﻩ ،
ﺍﻝ ﺩﺍﺧﻞ ﻣﻮﺟﻮﺩﺓ ﻣﺎ ﻗﻴﻤﺔ ﺃﻥsetﺑﺎﺭﺟﺎﻉ ﺫﻟﻚ ﻋﻠﻰ ﺑﻨﺎﺋﺎ ﻭﺗﻘﻮﻡ ،ﻻ ﺃﻡ
True or False^_^
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com
- 100. SET OBJECT
ﺍﻝ ﺩﺍﺧﻞ ﺍﻟﻤﻮﺟﻮﺩﺓ ﺍﻟﻌﻨﺎﺻﺮ ﻁﺒﺎﻋﺔ ﻳﻤﻜﻨﻨﺎ ﻛﻴﻒ ،ﻭﺍﻵﻥSet؟
ﺍﻟﺠﻮﺍﺏ:ﺍﻝ ﺧﻼﻝ ﻣﻦFor ofﺳﺎﺑﻘﺎ ﺗﻌﻠﻤﻨﺎﻫﺎ ﺍﻟﺘﻲ^_^
ﺍﻟﻤﺜﺎﻝ ﻟﻨﺸﺎﻫﺪ6:
ﺍﻝ ﺍﺳﺘﺨﺪﺍﻡ ﺍﻟﻰ ﺗﺪﻋﻮﻧﺎ ﺍﻟﺘﻲ ﺍﻟﻨﻘﺎﻁ ﺃﻫﻢ ﻣﻦSetﺃﻱ ﻭﺟﻮﺩ ﻋﺪﻡ ﻧﻀﻤﻦ ﺍﻧﻨﺎ
ﻳﺒﻘﻰ ﻭﺍﻟﺮﻗﻤﻲ ،ﻧﺼﻲ ﻳﺒﻘﻰ ﻓﺎﻟﻨﺼﻲ ،ﺍﺭﺳﺎﻟﻬﺎ ﻳﺘﻢ ﺍﻟﺘﻲ ﺍﻟﺒﻴﺎﻧﺎﺕ ﻧﻮﻉ ﻋﻠﻰ ﺗﻌﺪﻳﻞ
ﻣﺼﻔﻮﻓﺔ ﺗﺒﻘﻰ ﻭﺍﻟﻤﺼﻔﻮﻓﺔ ،ﺭﻗﻤﻴﺎ...ﺍﻟﺦ
ﻣﺠﺎﻧﻴﺔﺩﻭﺭﺓ-aneeshikmat@2nees.com