|
|
<!--
|
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
|
{
|
|
|
"original_hash": "ec43b53e8e015cdabfd3ad877b3c28e5",
|
|
|
"translation_date": "2025-10-22T17:22:34+00:00",
|
|
|
"source_file": "2-js-basics/2-functions-methods/README.md",
|
|
|
"language_code": "pa"
|
|
|
}
|
|
|
-->
|
|
|
# ਜਾਵਾਸਕ੍ਰਿਪਟ ਬੁਨਿਆਦੀਆਂ: ਮੈਥਡਸ ਅਤੇ ਫੰਕਸ਼ਨ
|
|
|
|
|
|
|
|
|
> ਸਕੈਚਨੋਟ [ਟੋਮੋਮੀ ਇਮੁਰਾ](https://twitter.com/girlie_mac) ਦੁਆਰਾ
|
|
|
|
|
|
## ਲੈਕਚਰ ਤੋਂ ਪਹਿਲਾਂ ਕਵੀਜ
|
|
|
[ਲੈਕਚਰ ਤੋਂ ਪਹਿਲਾਂ ਕਵੀਜ](https://ff-quizzes.netlify.app)
|
|
|
|
|
|
ਇੱਕ ਹੀ ਕੋਡ ਨੂੰ ਵਾਰ-ਵਾਰ ਲਿਖਣਾ ਪ੍ਰੋਗਰਾਮਿੰਗ ਦੇ ਸਭ ਤੋਂ ਆਮ ਨਿਰਾਸ਼ਾਜਨਕ ਪਹਲੂਆਂ ਵਿੱਚੋਂ ਇੱਕ ਹੈ। ਫੰਕਸ਼ਨ ਇਸ ਸਮੱਸਿਆ ਦਾ ਹੱਲ ਪੇਸ਼ ਕਰਦੇ ਹਨ ਕਿਉਂਕਿ ਇਹ ਤੁਹਾਨੂੰ ਕੋਡ ਨੂੰ ਦੁਬਾਰਾ ਵਰਤਣ ਯੋਗ ਬਲਾਕਾਂ ਵਿੱਚ ਪੈਕ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹਨ। ਫੰਕਸ਼ਨ ਨੂੰ ਹੈਨਰੀ ਫੋਰਡ ਦੀ ਅਸੈਂਬਲੀ ਲਾਈਨ ਦੇ ਮਿਆਰੀਕ੍ਰਿਤ ਹਿੱਸਿਆਂ ਵਾਂਗ ਸੋਚੋ – ਜਦੋਂ ਤੁਸੀਂ ਇੱਕ ਭਰੋਸੇਯੋਗ ਕੰਪੋਨੈਂਟ ਬਣਾਉਂਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਇਸਨੂੰ ਜਿੱਥੇ ਵੀ ਲੋੜ ਹੋਵੇ, ਬਿਨਾਂ ਮੁੜ ਤੋਂ ਬਣਾਉਣ ਦੇ ਵਰਤ ਸਕਦੇ ਹੋ।
|
|
|
|
|
|
ਫੰਕਸ਼ਨ ਤੁਹਾਨੂੰ ਕੋਡ ਦੇ ਟੁਕੜਿਆਂ ਨੂੰ ਬੰਨ੍ਹਣ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹਨ ਤਾਂ ਜੋ ਤੁਸੀਂ ਆਪਣੇ ਪ੍ਰੋਗਰਾਮ ਵਿੱਚ ਉਨ੍ਹਾਂ ਨੂੰ ਦੁਬਾਰਾ ਵਰਤ ਸਕੋ। ਇੱਕੋ ਤਰ੍ਹਾਂ ਦੇ ਲਾਜਿਕ ਨੂੰ ਹਰ ਜਗ੍ਹਾ ਕਾਪੀ ਅਤੇ ਪੇਸਟ ਕਰਨ ਦੀ ਬਜਾਏ, ਤੁਸੀਂ ਇੱਕ ਵਾਰ ਫੰਕਸ਼ਨ ਬਣਾਉਂਦੇ ਹੋ ਅਤੇ ਜਦੋਂ ਵੀ ਲੋੜ ਹੋਵੇ ਇਸਨੂੰ ਕਾਲ ਕਰਦੇ ਹੋ। ਇਹ ਪਹੁੰਚ ਤੁਹਾਡੇ ਕੋਡ ਨੂੰ ਸੰਗਠਿਤ ਰੱਖਦੀ ਹੈ ਅਤੇ ਅੱਪਡੇਟ ਕਰਨਾ ਬਹੁਤ ਆਸਾਨ ਬਣਾਉਂਦੀ ਹੈ।
|
|
|
|
|
|
ਇਸ ਪਾਠ ਵਿੱਚ, ਤੁਸੀਂ ਆਪਣੇ ਫੰਕਸ਼ਨ ਬਣਾਉਣ, ਉਨ੍ਹਾਂ ਨੂੰ ਜਾਣਕਾਰੀ ਪਾਸ ਕਰਨ ਅਤੇ ਉਨ੍ਹਾਂ ਤੋਂ ਲਾਭਦਾਇਕ ਨਤੀਜੇ ਪ੍ਰਾਪਤ ਕਰਨ ਦੇ ਬਾਰੇ ਸਿੱਖੋਗੇ। ਤੁਸੀਂ ਫੰਕਸ਼ਨ ਅਤੇ ਮੈਥਡਸ ਦੇ ਵਿਚਕਾਰ ਅੰਤਰ ਦੀ ਖੋਜ ਕਰੋਗੇ, ਆਧੁਨਿਕ ਸਿੰਟੈਕਸ ਪਹੁੰਚਾਂ ਬਾਰੇ ਸਿੱਖੋਗੇ, ਅਤੇ ਦੇਖੋਗੇ ਕਿ ਫੰਕਸ਼ਨ ਹੋਰ ਫੰਕਸ਼ਨ ਨਾਲ ਕਿਵੇਂ ਕੰਮ ਕਰ ਸਕਦੇ ਹਨ। ਅਸੀਂ ਇਹ ਧਾਰਨਾਵਾਂ ਕਦਮ-ਦਰ-ਕਦਮ ਬਣਾਉਣਗੇ।
|
|
|
|
|
|
[](https://youtube.com/watch?v=XgKsD6Zwvlc "Methods and Functions")
|
|
|
|
|
|
> 🎥 ਉੱਪਰ ਦਿੱਤੀ ਤਸਵੀਰ 'ਤੇ ਕਲਿਕ ਕਰੋ ਮੈਥਡਸ ਅਤੇ ਫੰਕਸ਼ਨ ਬਾਰੇ ਵੀਡੀਓ ਦੇਖਣ ਲਈ।
|
|
|
|
|
|
> ਤੁਸੀਂ ਇਹ ਪਾਠ [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-functions/?WT.mc_id=academic-77807-sagibbon) 'ਤੇ ਲੈ ਸਕਦੇ ਹੋ!
|
|
|
|
|
|
## ਫੰਕਸ਼ਨ
|
|
|
|
|
|
ਫੰਕਸ਼ਨ ਇੱਕ ਸਵੈ-ਨਿਰਭਰ ਕੋਡ ਦਾ ਬਲਾਕ ਹੁੰਦਾ ਹੈ ਜੋ ਇੱਕ ਵਿਸ਼ੇਸ਼ ਕੰਮ ਕਰਦਾ ਹੈ। ਇਹ ਲਾਜਿਕ ਨੂੰ ਘੇਰਦਾ ਹੈ ਜਿਸਨੂੰ ਤੁਸੀਂ ਜਦੋਂ ਵੀ ਲੋੜ ਹੋਵੇ ਚਲਾਉਣ ਲਈ ਵਰਤ ਸਕਦੇ ਹੋ।
|
|
|
|
|
|
ਆਪਣੇ ਪ੍ਰੋਗਰਾਮ ਵਿੱਚ ਇੱਕੋ ਕੋਡ ਨੂੰ ਕਈ ਵਾਰ ਲਿਖਣ ਦੀ ਬਜਾਏ, ਤੁਸੀਂ ਇਸਨੂੰ ਇੱਕ ਫੰਕਸ਼ਨ ਵਿੱਚ ਪੈਕ ਕਰ ਸਕਦੇ ਹੋ ਅਤੇ ਜਦੋਂ ਵੀ ਲੋੜ ਹੋਵੇ ਇਸਨੂੰ ਕਾਲ ਕਰ ਸਕਦੇ ਹੋ। ਇਹ ਪਹੁੰਚ ਤੁਹਾਡੇ ਕੋਡ ਨੂੰ ਸਾਫ਼ ਰੱਖਦੀ ਹੈ ਅਤੇ ਅੱਪਡੇਟ ਕਰਨਾ ਬਹੁਤ ਆਸਾਨ ਬਣਾਉਂਦੀ ਹੈ। ਸੋਚੋ ਕਿ ਜੇ ਤੁਹਾਨੂੰ ਆਪਣੇ ਕੋਡਬੇਸ ਦੇ 20 ਵੱਖ-ਵੱਖ ਸਥਾਨਾਂ 'ਤੇ ਫੈਲੇ ਲਾਜਿਕ ਨੂੰ ਬਦਲਣਾ ਪਵੇ ਤਾਂ ਰੱਖ-ਰਖਾਅ ਦੀ ਚੁਣੌਤੀ ਕਿੰਨੀ ਵੱਡੀ ਹੋਵੇਗੀ।
|
|
|
|
|
|
ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਵਿਆਖਿਆਤਮਕ ਨਾਮ ਦੇਣਾ ਬਹੁਤ ਜਰੂਰੀ ਹੈ। ਇੱਕ ਚੰਗਾ-ਨਾਮਿਤ ਫੰਕਸ਼ਨ ਇਸਦੇ ਉਦੇਸ਼ ਨੂੰ ਸਪਸ਼ਟ ਤੌਰ 'ਤੇ ਸੰਚਾਰਿਤ ਕਰਦਾ ਹੈ – ਜਦੋਂ ਤੁਸੀਂ `cancelTimer()` ਨੂੰ ਵੇਖਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਤੁਰੰਤ ਸਮਝ ਜਾਂਦੇ ਹੋ ਕਿ ਇਹ ਕੀ ਕਰਦਾ ਹੈ, ਜਿਵੇਂ ਕਿ ਇੱਕ ਸਪਸ਼ਟ ਲੇਬਲ ਵਾਲਾ ਬਟਨ ਤੁਹਾਨੂੰ ਸਪਸ਼ਟ ਤੌਰ 'ਤੇ ਦੱਸਦਾ ਹੈ ਕਿ ਜਦੋਂ ਤੁਸੀਂ ਇਸਨੂੰ ਕਲਿਕ ਕਰਦੇ ਹੋ ਤਾਂ ਕੀ ਹੋਵੇਗਾ।
|
|
|
|
|
|
## ਫੰਕਸ਼ਨ ਬਣਾਉਣਾ ਅਤੇ ਕਾਲ ਕਰਨਾ
|
|
|
|
|
|
ਆਓ ਵੇਖੀਏ ਕਿ ਫੰਕਸ਼ਨ ਕਿਵੇਂ ਬਣਾਇਆ ਜਾਂਦਾ ਹੈ। ਸਿੰਟੈਕਸ ਇੱਕ ਸਥਿਰ ਪੈਟਰਨ ਦੀ ਪਾਲਣਾ ਕਰਦਾ ਹੈ:
|
|
|
|
|
|
```javascript
|
|
|
function nameOfFunction() { // function definition
|
|
|
// function definition/body
|
|
|
}
|
|
|
```
|
|
|
|
|
|
ਆਓ ਇਸਨੂੰ ਤੋੜ ਕੇ ਸਮਝੀਏ:
|
|
|
- `function` ਕੀਵਰਡ ਜਾਵਾਸਕ੍ਰਿਪਟ ਨੂੰ ਦੱਸਦਾ ਹੈ "ਹੇ, ਮੈਂ ਇੱਕ ਫੰਕਸ਼ਨ ਬਣਾਉਣ ਜਾ ਰਿਹਾ ਹਾਂ!"
|
|
|
- `nameOfFunction` ਜਿੱਥੇ ਤੁਸੀਂ ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਇੱਕ ਵਿਆਖਿਆਤਮਕ ਨਾਮ ਦਿੰਦੇ ਹੋ
|
|
|
- ਪੈਰੈਂਥੀਸਿਸ `()` ਜਿੱਥੇ ਤੁਸੀਂ ਪੈਰਾਮੀਟਰ ਸ਼ਾਮਲ ਕਰ ਸਕਦੇ ਹੋ (ਅਸੀਂ ਇਸ 'ਤੇ ਜਲਦੀ ਆਵਾਂਗੇ)
|
|
|
- ਕਰਲੀ ਬ੍ਰੇਸ `{}` ਵਿੱਚ ਅਸਲ ਕੋਡ ਹੁੰਦਾ ਹੈ ਜੋ ਤੁਸੀਂ ਫੰਕਸ਼ਨ ਕਾਲ ਕਰਨ 'ਤੇ ਚਲਾਉਂਦੇ ਹੋ
|
|
|
|
|
|
ਆਓ ਇਸਨੂੰ ਕਾਰਵਾਈ ਵਿੱਚ ਵੇਖਣ ਲਈ ਇੱਕ ਸਧਾਰਨ ਗ੍ਰੀਟਿੰਗ ਫੰਕਸ਼ਨ ਬਣਾਈਏ:
|
|
|
|
|
|
```javascript
|
|
|
function displayGreeting() {
|
|
|
console.log('Hello, world!');
|
|
|
}
|
|
|
```
|
|
|
|
|
|
ਇਹ ਫੰਕਸ਼ਨ "Hello, world!" ਕਨਸੋਲ ਵਿੱਚ ਪ੍ਰਿੰਟ ਕਰਦਾ ਹੈ। ਜਦੋਂ ਤੁਸੀਂ ਇਸਨੂੰ ਡਿਫਾਈਨ ਕਰ ਲੈਂਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਇਸਨੂੰ ਜਿੰਨੀ ਵਾਰ ਚਾਹੋ ਵਰਤ ਸਕਦੇ ਹੋ।
|
|
|
|
|
|
ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਚਲਾਉਣ (ਜਾਂ "ਕਾਲ" ਕਰਨ) ਲਈ, ਇਸਦਾ ਨਾਮ ਲਿਖੋ ਅਤੇ ਪੈਰੈਂਥੀਸਿਸ ਦੇ ਨਾਲ। ਜਾਵਾਸਕ੍ਰਿਪਟ ਤੁਹਾਨੂੰ ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਕਾਲ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ ਜਾਂ ਬਾਅਦ ਵਿੱਚ ਡਿਫਾਈਨ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ – ਜਾਵਾਸਕ੍ਰਿਪਟ ਇੰਜਨ ਐਗਜ਼ਿਕਿਊਸ਼ਨ ਆਰਡਰ ਨੂੰ ਸੰਭਾਲੇਗਾ।
|
|
|
|
|
|
```javascript
|
|
|
// calling our function
|
|
|
displayGreeting();
|
|
|
```
|
|
|
|
|
|
ਜਦੋਂ ਤੁਸੀਂ ਇਹ ਲਾਈਨ ਚਲਾਉਂਦੇ ਹੋ, ਇਹ ਤੁਹਾਡੇ `displayGreeting` ਫੰਕਸ਼ਨ ਦੇ ਅੰਦਰ ਸਾਰੇ ਕੋਡ ਨੂੰ ਚਲਾਉਂਦਾ ਹੈ, "Hello, world!" ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਦੇ ਕਨਸੋਲ ਵਿੱਚ ਦਿਖਾਉਂਦਾ ਹੈ। ਤੁਸੀਂ ਇਸ ਫੰਕਸ਼ਨ ਨੂੰ ਵਾਰ-ਵਾਰ ਕਾਲ ਕਰ ਸਕਦੇ ਹੋ।
|
|
|
|
|
|
> **Note:** ਤੁਸੀਂ ਇਸ ਪਾਠ ਵਿੱਚ **ਮੈਥਡਸ** ਵਰਤ ਰਹੇ ਹੋ। `console.log()` ਇੱਕ ਮੈਥਡ ਹੈ – ਅਸਲ ਵਿੱਚ ਇੱਕ ਫੰਕਸ਼ਨ ਜੋ `console` ਆਬਜੈਕਟ ਨਾਲ ਸੰਬੰਧਿਤ ਹੈ। ਮੁੱਖ ਅੰਤਰ ਇਹ ਹੈ ਕਿ ਮੈਥਡਸ ਆਬਜੈਕਟਸ ਨਾਲ ਜੁੜੇ ਹੁੰਦੇ ਹਨ, ਜਦੋਂ ਕਿ ਫੰਕਸ਼ਨ ਸਵਤੰਤਰ ਰਹਿੰਦੇ ਹਨ। ਕਈ ਡਿਵੈਲਪਰ ਆਮ ਗੱਲਬਾਤ ਵਿੱਚ ਇਹ ਸ਼ਬਦ ਇੱਕੋ ਜਿਹਾ ਵਰਤਦੇ ਹਨ।
|
|
|
|
|
|
### ਫੰਕਸ਼ਨ ਲਈ ਵਧੀਆ ਅਭਿਆਸ
|
|
|
|
|
|
ਇੱਥੇ ਕੁਝ ਸੁਝਾਅ ਹਨ ਜੋ ਤੁਹਾਨੂੰ ਵਧੀਆ ਫੰਕਸ਼ਨ ਲਿਖਣ ਵਿੱਚ ਮਦਦ ਕਰ ਸਕਦੇ ਹਨ:
|
|
|
|
|
|
- ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਸਪਸ਼ਟ, ਵਿਆਖਿਆਤਮਕ ਨਾਮ ਦਿਓ – ਤੁਹਾਡਾ ਭਵਿੱਖ ਦਾ ਆਪ ਤੁਹਾਡਾ ਧੰਨਵਾਦ ਕਰੇਗਾ!
|
|
|
- **camelCasing** ਵਰਤੋ ਬਹੁ-ਸ਼ਬਦ ਵਾਲੇ ਨਾਮਾਂ ਲਈ (ਜਿਵੇਂ `calculateTotal` ਬਜਾਏ `calculate_total`)
|
|
|
- ਹਰ ਫੰਕਸ਼ਨ ਨੂੰ ਇੱਕ ਚੰਗੀ ਤਰ੍ਹਾਂ ਇੱਕ ਕੰਮ ਕਰਨ 'ਤੇ ਕੇਂਦਰਿਤ ਰੱਖੋ
|
|
|
|
|
|
## ਫੰਕਸ਼ਨ ਨੂੰ ਜਾਣਕਾਰੀ ਪਾਸ ਕਰਨਾ
|
|
|
|
|
|
ਸਾਡਾ `displayGreeting` ਫੰਕਸ਼ਨ ਸੀਮਿਤ ਹੈ – ਇਹ ਸਿਰਫ "Hello, world!" ਹਰ ਕਿਸੇ ਲਈ ਦਿਖਾ ਸਕਦਾ ਹੈ। ਪੈਰਾਮੀਟਰਸ ਸਾਨੂੰ ਫੰਕਸ਼ਨ ਨੂੰ ਹੋਰ ਲਚਕਦਾਰ ਅਤੇ ਲਾਭਦਾਇਕ ਬਣਾਉਣ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹਨ।
|
|
|
|
|
|
**ਪੈਰਾਮੀਟਰਸ** ਪਲੇਸਹੋਲਡਰ ਵਾਂਗ ਕੰਮ ਕਰਦੇ ਹਨ ਜਿੱਥੇ ਤੁਸੀਂ ਹਰ ਵਾਰ ਫੰਕਸ਼ਨ ਵਰਤਣ ਸਮੇਂ ਵੱਖ-ਵੱਖ ਮੁੱਲ ਪਾ ਸਕਦੇ ਹੋ। ਇਸ ਤਰੀਕੇ ਨਾਲ, ਇੱਕੋ ਫੰਕਸ਼ਨ ਹਰ ਕਾਲ 'ਤੇ ਵੱਖ-ਵੱਖ ਜਾਣਕਾਰੀ ਨਾਲ ਕੰਮ ਕਰ ਸਕਦਾ ਹੈ।
|
|
|
|
|
|
ਜਦੋਂ ਤੁਸੀਂ ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਡਿਫਾਈਨ ਕਰਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਪੈਰੈਂਥੀਸਿਸ ਦੇ ਅੰਦਰ ਪੈਰਾਮੀਟਰਸ ਦੀ ਸੂਚੀ ਦਿੰਦੇ ਹੋ, ਕਈ ਪੈਰਾਮੀਟਰਸ ਨੂੰ ਕਾਮਾ ਨਾਲ ਵੱਖ ਕਰਦੇ ਹੋ:
|
|
|
|
|
|
```javascript
|
|
|
function name(param, param2, param3) {
|
|
|
|
|
|
}
|
|
|
```
|
|
|
|
|
|
ਹਰ ਪੈਰਾਮੀਟਰ ਪਲੇਸਹੋਲਡਰ ਵਾਂਗ ਕੰਮ ਕਰਦਾ ਹੈ – ਜਦੋਂ ਕੋਈ ਤੁਹਾਡੇ ਫੰਕਸ਼ਨ ਨੂੰ ਕਾਲ ਕਰਦਾ ਹੈ, ਉਹ ਅਸਲ ਮੁੱਲ ਪ੍ਰਦਾਨ ਕਰਦੇ ਹਨ ਜੋ ਇਨ੍ਹਾਂ ਸਥਾਨਾਂ ਵਿੱਚ ਪਲੱਗ ਹੁੰਦੇ ਹਨ।
|
|
|
|
|
|
ਆਓ ਆਪਣੇ ਗ੍ਰੀਟਿੰਗ ਫੰਕਸ਼ਨ ਨੂੰ ਅਪਡੇਟ ਕਰੀਏ ਤਾਂ ਕਿ ਇਹ ਕਿਸੇ ਦਾ ਨਾਮ ਸਵੀਕਾਰ ਕਰ ਸਕੇ:
|
|
|
|
|
|
```javascript
|
|
|
function displayGreeting(name) {
|
|
|
const message = `Hello, ${name}!`;
|
|
|
console.log(message);
|
|
|
}
|
|
|
```
|
|
|
|
|
|
ਧਿਆਨ ਦਿਓ ਕਿ ਅਸੀਂ ਬੈਕਟਿਕਸ (`` ` ``) ਅਤੇ `${}` ਵਰਤ ਰਹੇ ਹਾਂ ਨਾਮ ਨੂੰ ਸਿੱਧੇ ਆਪਣੇ ਸੁਨੇਹੇ ਵਿੱਚ ਸ਼ਾਮਲ ਕਰਨ ਲਈ – ਇਸਨੂੰ ਟੈਂਪਲੇਟ ਲਿਟਰਲ ਕਿਹਾ ਜਾਂਦਾ ਹੈ, ਅਤੇ ਇਹ ਸਟ੍ਰਿੰਗਸ ਨੂੰ ਵੈਰੀਏਬਲਸ ਦੇ ਨਾਲ ਮਿਲਾਉਣ ਲਈ ਬਹੁਤ ਹੀ ਸਹਾਇਕ ਹੈ।
|
|
|
|
|
|
ਹੁਣ ਜਦੋਂ ਅਸੀਂ ਆਪਣੇ ਫੰਕਸ਼ਨ ਨੂੰ ਕਾਲ ਕਰਦੇ ਹਾਂ, ਅਸੀਂ ਕੋਈ ਵੀ ਨਾਮ ਪਾਸ ਕਰ ਸਕਦੇ ਹਾਂ:
|
|
|
|
|
|
```javascript
|
|
|
displayGreeting('Christopher');
|
|
|
// displays "Hello, Christopher!" when run
|
|
|
```
|
|
|
|
|
|
ਜਾਵਾਸਕ੍ਰਿਪਟ ਸਟ੍ਰਿੰਗ `'Christopher'` ਲੈਂਦਾ ਹੈ, ਇਸਨੂੰ `name` ਪੈਰਾਮੀਟਰ ਨੂੰ ਅਸਾਈਨ ਕਰਦਾ ਹੈ, ਅਤੇ ਨਿੱਜੀ ਸੁਨੇਹਾ "Hello, Christopher!" ਬਣਾਉਂਦਾ ਹੈ।
|
|
|
|
|
|
## ਡਿਫਾਲਟ ਮੁੱਲ
|
|
|
|
|
|
ਜੇਕਰ ਅਸੀਂ ਕੁਝ ਪੈਰਾਮੀਟਰਸ ਨੂੰ ਵਿਕਲਪਿਕ ਬਣਾਉਣਾ ਚਾਹੁੰਦੇ ਹਾਂ ਤਾਂ ਕੀ ਹੋਵੇਗਾ? ਇੱਥੇ ਡਿਫਾਲਟ ਮੁੱਲ ਬਹੁਤ ਸਹਾਇਕ ਹੁੰਦੇ ਹਨ!
|
|
|
|
|
|
ਆਓ ਕਹੀਏ ਕਿ ਅਸੀਂ ਚਾਹੁੰਦੇ ਹਾਂ ਕਿ ਲੋਕ ਗ੍ਰੀਟਿੰਗ ਸ਼ਬਦ ਨੂੰ ਕਸਟਮਾਈਜ਼ ਕਰ ਸਕਣ, ਪਰ ਜੇਕਰ ਉਹ ਕੋਈ ਨਿਰਧਾਰਿਤ ਨਾ ਕਰਨ, ਤਾਂ ਅਸੀਂ "Hello" ਨੂੰ ਬੈਕਅੱਪ ਵਜੋਂ ਵਰਤਾਂਗੇ। ਤੁਸੀਂ ਡਿਫਾਲਟ ਮੁੱਲ ਸੈਟ ਕਰ ਸਕਦੇ ਹੋ ਜਿਵੇਂ ਕਿ ਵੈਰੀਏਬਲ ਸੈਟ ਕਰਦੇ ਹੋ:
|
|
|
|
|
|
```javascript
|
|
|
function displayGreeting(name, salutation='Hello') {
|
|
|
console.log(`${salutation}, ${name}`);
|
|
|
}
|
|
|
```
|
|
|
|
|
|
ਇੱਥੇ, `name` ਅਜੇ ਵੀ ਲਾਜ਼ਮੀ ਹੈ, ਪਰ `salutation` ਦਾ ਬੈਕਅੱਪ ਮੁੱਲ `'Hello'` ਹੈ ਜੇਕਰ ਕੋਈ ਵੱਖ ਗ੍ਰੀਟਿੰਗ ਪ੍ਰਦਾਨ ਨਾ ਕਰੇ।
|
|
|
|
|
|
ਹੁਣ ਅਸੀਂ ਇਸ ਫੰਕਸ਼ਨ ਨੂੰ ਦੋ ਵੱਖ-ਵੱਖ ਤਰੀਕਿਆਂ ਨਾਲ ਕਾਲ ਕਰ ਸਕਦੇ ਹਾਂ:
|
|
|
|
|
|
```javascript
|
|
|
displayGreeting('Christopher');
|
|
|
// displays "Hello, Christopher"
|
|
|
|
|
|
displayGreeting('Christopher', 'Hi');
|
|
|
// displays "Hi, Christopher"
|
|
|
```
|
|
|
|
|
|
ਪਹਿਲੀ ਕਾਲ ਵਿੱਚ, ਜਾਵਾਸਕ੍ਰਿਪਟ ਡਿਫਾਲਟ "Hello" ਵਰਤਦਾ ਹੈ ਕਿਉਂਕਿ ਅਸੀਂ ਗ੍ਰੀਟਿੰਗ ਸਪਸ਼ਟ ਨਹੀਂ ਕੀਤੀ। ਦੂਜੀ ਕਾਲ ਵਿੱਚ, ਇਹ ਸਾਡੇ ਕਸਟਮ "Hi" ਨੂੰ ਵਰਤਦਾ ਹੈ। ਇਹ ਲਚਕਤਾ ਫੰਕਸ਼ਨ ਨੂੰ ਵੱਖ-ਵੱਖ ਸਥਿਤੀਆਂ ਲਈ ਅਨੁਕੂਲ ਬਣਾਉਂਦੀ ਹੈ।
|
|
|
|
|
|
## ਰਿਟਰਨ ਮੁੱਲ
|
|
|
|
|
|
ਸਾਡੇ ਫੰਕਸ਼ਨ ਹੁਣ ਤੱਕ ਸਿਰਫ ਸੁਨੇਹੇ ਕਨਸੋਲ ਵਿੱਚ ਪ੍ਰਿੰਟ ਕਰ ਰਹੇ ਹਨ, ਪਰ ਜੇਕਰ ਤੁਸੀਂ ਚਾਹੁੰਦੇ ਹੋ ਕਿ ਇੱਕ ਫੰਕਸ਼ਨ ਕੁਝ ਗਣਨਾ ਕਰੇ ਅਤੇ ਤੁਹਾਨੂੰ ਨਤੀਜਾ ਵਾਪਸ ਦੇਵੇ?
|
|
|
|
|
|
ਇੱਥੇ **ਰਿਟਰਨ ਮੁੱਲ** ਆਉਂਦੇ ਹਨ। ਕੁਝ ਦਿਖਾਉਣ ਦੀ ਬਜਾਏ, ਇੱਕ ਫੰਕਸ਼ਨ ਤੁਹਾਨੂੰ ਮੁੱਲ ਵਾਪਸ ਦੇ ਸਕਦਾ ਹੈ ਜਿਸਨੂੰ ਤੁਸੀਂ ਵੈਰੀਏਬਲ ਵਿੱਚ ਸਟੋਰ ਕਰ ਸਕਦੇ ਹੋ ਜਾਂ ਆਪਣੇ ਕੋਡ ਦੇ ਹੋਰ ਹਿੱਸਿਆਂ ਵਿੱਚ ਵਰਤ ਸਕਦੇ ਹੋ।
|
|
|
|
|
|
ਮੁੱਲ ਵਾਪਸ ਭੇਜਣ ਲਈ, ਤੁਸੀਂ `return` ਕੀਵਰਡ ਵਰਤਦੇ ਹੋ ਅਤੇ ਜੋ ਕੁਝ ਤੁਸੀਂ ਵਾਪਸ ਭੇਜਣਾ ਚਾਹੁੰਦੇ ਹੋ ਉਸਦੇ ਨਾਲ:
|
|
|
|
|
|
```javascript
|
|
|
return myVariable;
|
|
|
```
|
|
|
|
|
|
ਇੱਥੇ ਇੱਕ ਮਹੱਤਵਪੂਰਨ ਗੱਲ ਹੈ: ਜਦੋਂ ਇੱਕ ਫੰਕਸ਼ਨ `return` ਸਟੇਟਮੈਂਟ 'ਤੇ ਪਹੁੰਚਦਾ ਹੈ, ਇਹ ਤੁਰੰਤ ਚਲਾਉਣਾ ਬੰਦ ਕਰਦਾ ਹੈ ਅਤੇ ਉਹ ਮੁੱਲ ਵਾਪਸ ਭੇਜਦਾ ਹੈ ਜਿਸਨੇ ਇਸਨੂੰ ਕਾਲ ਕੀਤਾ ਸੀ।
|
|
|
|
|
|
ਆਓ ਆਪਣੇ ਗ੍ਰੀਟਿੰਗ ਫੰਕਸ਼ਨ ਨੂੰ ਸੋਧੀਏ ਤਾਂ ਕਿ ਇਹ ਸੁਨੇਹਾ ਵਾਪਸ ਭੇਜੇ ਬਜਾਏ ਇਸਨੂੰ ਪ੍ਰਿੰਟ ਕਰਨ ਦੇ:
|
|
|
|
|
|
```javascript
|
|
|
function createGreetingMessage(name) {
|
|
|
const message = `Hello, ${name}`;
|
|
|
return message;
|
|
|
}
|
|
|
```
|
|
|
|
|
|
ਹੁਣ ਗ੍ਰੀਟਿੰਗ ਪ੍ਰਿੰਟ ਕਰਨ ਦੀ ਬਜਾਏ, ਇਹ ਫੰਕਸ਼ਨ ਸੁਨੇਹਾ ਬਣਾਉਂਦਾ ਹੈ ਅਤੇ ਇਸਨੂੰ ਸਾਨੂੰ ਵਾਪਸ ਦਿੰਦਾ ਹੈ।
|
|
|
|
|
|
ਵਾਪਸ ਭੇਜੇ ਗਏ ਮੁੱਲ ਨੂੰ ਵਰਤਣ ਲਈ, ਅਸੀਂ ਇਸਨੂੰ ਕਿਸੇ ਹੋਰ ਮੁੱਲ ਵਾਂਗ ਵੈਰੀਏਬਲ ਵਿੱਚ ਸਟੋਰ ਕਰ ਸਕਦੇ ਹਾਂ:
|
|
|
|
|
|
```javascript
|
|
|
const greetingMessage = createGreetingMessage('Christopher');
|
|
|
```
|
|
|
|
|
|
ਹੁਣ `greetingMessage` ਵਿੱਚ "Hello, Christopher" ਹੈ ਅਤੇ ਅਸੀਂ ਇਸਨੂੰ ਆਪਣੇ ਕੋਡ ਵਿੱਚ ਕਿਤੇ ਵੀ ਵਰਤ ਸਕਦੇ ਹਾਂ – ਇਸਨੂੰ ਵੈਬਪੇਜ 'ਤੇ ਦਿਖਾਉਣ ਲਈ, ਇਸਨੂੰ ਈਮੇਲ ਵਿੱਚ ਸ਼ਾਮਲ ਕਰਨ ਲਈ, ਜਾਂ ਇਸਨੂੰ ਕਿਸੇ ਹੋਰ ਫੰਕਸ਼ਨ ਨੂੰ ਪਾਸ ਕਰਨ ਲਈ।
|
|
|
|
|
|
## ਫੰਕਸ਼ਨ ਨੂੰ ਫੰਕਸ਼ਨ ਲਈ ਪੈਰਾਮੀਟਰ ਵਜੋਂ ਵਰਤਣਾ
|
|
|
|
|
|
ਫੰਕਸ਼ਨ ਹੋਰ ਫੰਕਸ਼ਨ ਲਈ ਪੈਰਾਮੀਟਰ ਵਜੋਂ ਪਾਸ ਕੀਤੇ ਜਾ ਸਕਦੇ ਹਨ। ਜਦੋਂ ਇਹ ਧਾਰਨਾ ਸ਼ੁਰੂ ਵਿੱਚ ਥੋੜ੍ਹੀ ਜਟਿਲ ਲੱਗ ਸਕਦੀ ਹੈ, ਇਹ ਇੱਕ ਸ਼ਕਤੀਸ਼ਾਲੀ ਵਿਸ਼ੇਸ਼ਤਾ ਹੈ ਜੋ ਲਚਕਦਾਰ ਪ੍ਰੋਗਰਾਮਿੰਗ ਪੈਟਰਨ ਨੂੰ ਯੋਗ ਬਣਾਉਂਦੀ ਹੈ।
|
|
|
|
|
|
ਇਹ ਪੈਟਰਨ ਬਹੁਤ ਆਮ ਹੈ ਜਦੋਂ ਤੁਸੀਂ ਕਹਿਣਾ ਚਾਹੁੰਦੇ ਹੋ "ਜਦੋਂ ਕੁਝ ਹੁੰਦਾ ਹੈ, ਇਹ ਹੋਰ ਚੀਜ਼ ਕਰੋ।" ਉਦਾਹਰਣ ਲਈ, "ਜਦੋਂ ਟਾਈਮਰ ਖਤਮ ਹੁੰਦਾ ਹੈ, ਇਹ ਕੋਡ ਚਲਾਓ" ਜਾਂ "ਜਦੋਂ ਯੂਜ਼ਰ ਬਟਨ 'ਤੇ ਕਲਿਕ ਕਰਦਾ ਹੈ, ਇਸ ਫੰਕਸ਼ਨ ਨੂੰ ਕਾਲ ਕਰੋ।"
|
|
|
|
|
|
ਆਓ `setTimeout` ਨੂੰ ਵੇਖੀਏ, ਜੋ ਇੱਕ ਬਿਲਟ-ਇਨ ਫੰਕਸ਼ਨ ਹੈ ਜੋ ਕੁਝ ਸਮਾਂ ਉਡੀਕ ਕਰਦਾ ਹੈ ਅਤੇ ਫਿਰ ਕੁਝ ਕੋਡ ਚਲਾਉਂਦਾ ਹੈ। ਅਸੀਂ ਇਸਨੂੰ ਦੱਸਣ ਦੀ ਲੋੜ ਹੈ ਕਿ ਕਿਹੜਾ ਕੋਡ ਚਲਾਉਣਾ ਹੈ – ਫੰਕਸ਼ਨ ਪਾਸ ਕਰਨ ਲਈ ਬਹੁਤ ਹੀ ਵਧੀਆ ਵਰਤੋਂ!
|
|
|
|
|
|
ਇਹ ਕੋਡ ਅਜ਼ਮਾਓ – 3 ਸਕਿੰਟ ਬਾਅਦ, ਤੁਹਾਨੂੰ ਇੱਕ ਸੁਨੇਹਾ ਵੇਖਣ ਨੂੰ ਮਿਲੇਗਾ:
|
|
|
|
|
|
```javascript
|
|
|
function displayDone() {
|
|
|
console.log('3 seconds has elapsed');
|
|
|
}
|
|
|
// timer value is in milliseconds
|
|
|
setTimeout(displayDone, 3000);
|
|
|
```
|
|
|
|
|
|
ਧਿਆਨ ਦਿਓ ਕਿ ਅਸੀਂ `displayDone` ਨੂੰ (ਪੈਰੈਂਥੀਸਿਸ ਦੇ ਬਗੈਰ) `setTimeout` ਨੂੰ ਪਾਸ ਕਰਦੇ ਹਾਂ। ਅਸੀਂ ਫੰਕਸ਼ਨ ਨੂੰ ਖੁਦ ਨਹੀਂ ਕਾਲ ਕਰ ਰਹੇ – ਅਸੀਂ ਇਸਨੂੰ `setTimeout` ਨੂੰ ਦੇ ਰਹੇ ਹਾਂ ਅਤੇ ਕਹਿ ਰਹੇ ਹਾਂ "ਇਸਨੂੰ 3 ਸਕਿੰਟ ਵਿੱਚ ਕਾਲ ਕਰੋ।"
|
|
|
|
|
|
### ਗੁੰਨਾਮ ਫੰਕਸ਼ਨ
|
|
|
|
|
|
ਕਈ ਵਾਰ ਤੁਹਾਨੂੰ ਸਿਰਫ ਇੱਕ ਚੀਜ਼ ਲਈ ਫੰਕਸ਼ਨ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ ਅਤੇ ਤੁਸੀਂ ਇਸਨੂੰ ਕੋਈ ਨਾਮ ਨਹੀਂ ਦੇਣਾ ਚਾਹੁੰਦੇ। ਸੋਚੋ – ਜੇਕਰ ਤੁਸੀਂ ਸਿਰਫ ਇੱਕ ਵਾਰ ਫੰਕਸ਼ਨ ਵਰਤ ਰਹੇ ਹੋ, ਤਾਂ ਕਿਉਂ ਆਪਣੇ ਕੋਡ ਨੂੰ ਇੱਕ ਵਾਧੂ ਨਾਮ ਨਾਲ ਭਰੋ?
|
|
|
|
|
|
ਜਾਵਾਸਕ੍ਰਿਪਟ ਤੁਹਾਨੂੰ **ਗੁੰਨਾਮ ਫੰਕਸ਼ਨ** ਬਣਾਉਣ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ – ਫੰਕਸ਼ਨ ਬਿਨਾਂ ਨਾਮ ਦੇ ਜੋ ਤੁਸੀਂ ਜਿੱਥੇ ਲੋੜ
|
|
|
|
|
|
---
|
|
|
|
|
|
**ਅਸਵੀਕਰਤਾ**:
|
|
|
ਇਹ ਦਸਤਾਵੇਜ਼ AI ਅਨੁਵਾਦ ਸੇਵਾ [Co-op Translator](https://github.com/Azure/co-op-translator) ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਅਨੁਵਾਦ ਕੀਤਾ ਗਿਆ ਹੈ। ਜਦੋਂ ਕਿ ਅਸੀਂ ਸਹੀ ਹੋਣ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰਦੇ ਹਾਂ, ਕਿਰਪਾ ਕਰਕੇ ਧਿਆਨ ਦਿਓ ਕਿ ਸਵੈਚਾਲਿਤ ਅਨੁਵਾਦਾਂ ਵਿੱਚ ਗਲਤੀਆਂ ਜਾਂ ਅਸੁੱਤੀਆਂ ਹੋ ਸਕਦੀਆਂ ਹਨ। ਮੂਲ ਦਸਤਾਵੇਜ਼ ਨੂੰ ਇਸਦੀ ਮੂਲ ਭਾਸ਼ਾ ਵਿੱਚ ਅਧਿਕਾਰਤ ਸਰੋਤ ਮੰਨਿਆ ਜਾਣਾ ਚਾਹੀਦਾ ਹੈ। ਮਹੱਤਵਪੂਰਨ ਜਾਣਕਾਰੀ ਲਈ, ਪੇਸ਼ੇਵਰ ਮਨੁੱਖੀ ਅਨੁਵਾਦ ਦੀ ਸਿਫਾਰਸ਼ ਕੀਤੀ ਜਾਂਦੀ ਹੈ। ਇਸ ਅਨੁਵਾਦ ਦੀ ਵਰਤੋਂ ਤੋਂ ਪੈਦਾ ਹੋਣ ਵਾਲੇ ਕਿਸੇ ਵੀ ਗਲਤਫਹਿਮੀ ਜਾਂ ਗਲਤ ਵਿਆਖਿਆ ਲਈ ਅਸੀਂ ਜ਼ਿੰਮੇਵਾਰ ਨਹੀਂ ਹਾਂ। |
