Select Page
Javascript Concepts To Converse, Show Off And Exploit

Javascript Concepts To Converse, Show Off And Exploit

JavaScript is “this that bla bla” prevented me from exploring it for long. But the recent need to implement Apps in React Native forced me to explore it deeper. And I cannot agree with so many blasphemous claims demeaning the scripting language. Of course, there are new concepts. But they are there only to ease a lot of pain. It’s  mess but it’s a hot mess.

I won’t go into a performance comparison of whether js is good for the backend or not. But I am simply captured by the beauty and application scope of the JS in Web and App development using React Native.

Here are the main concepts that I have learnt so far:

 

1. Value and Reference Variable assignment:

JavaScript always assigns variables by value. But this part is very important: when the assigned value is one of JavaScript’s five primitive type (i.e., Boolean, null, undefined, String, and Number) the actual value is assigned. However, when the assigned value is an Array, Function, or Object a reference to the object in memory is assigned.

let var1 = 'My string';
let var2 = var1;
var2 = 'My new string';
console.log(var1);
// 'My string'
console.log(var2);
// 'My new string'

See how changing the value of var2 in case of primitive variable doesn’t affect var1. But messing with the reference var2.name in case of object changes the value assigned to the object in var1 , i.e var1.name, as well

In case of object:

let var1 = { name: 'Jim' }
let var2 = var1;
var2.name = 'John';
console.log(var1);
// { name: 'John' }
console.log(var2);
// { name: 'John' }

2. Closures, first-class functions and higher-order functions

First-class functions are simply treated in JS like any other variables. It is possible to use them as parameters in other functions, functions can return functions, and functions can be saved in variables.

// Saving a function in a variable
const myFirstFunc = () => 10

// Passing a function as an argument
const mySecondFunc = (funcParam) => {
return console.log(funcParam())
}

// Returning a function from a function
const myThirdFunc = () => {
return () => console.log('Hello from returned function')
}

A higher-order function is a function that takes a function as an argument, returns a function or both.

const myFirstHigherOrderFunc = () => {
return () => {
const output = 'Returned from a higher order function'
console.log(output)
}

}const mySecondHigherOrderFunc = (funcParam) => {
funcParam()
}

Now the beautiful miracle called closures.

In JavaScript, when a function finishes executing, any variables declared within its body is “garbage collected”. In other words, it is deleted from memory. This is why local variables are possible in JavaScript. This is why variables inside functions cannot be accessed outside.

Special exceptions occur when something inside the function depends on the variable being deleted.

 

 

// Parent function
function parent() {
// Local variable of the parent function
const prefix = 'I am a ';

// Child function
return function(noun) {
// The child function depends on the variables of the parent function.
return prefix + noun;
};
}

The example above takes advantage of a concept in functional programming called currying.

 

// Parent function
function parent() {
// Local variable of the parent function
const prefix = 'I am a ';

// Child function
return function(noun) {
// The child function depends on the variables of the parent function.
return prefix + noun;
};
}

In this case, prefix is still usable by the child function even after it has been garbage collected because the child function created its own closure. A closure is like a “snapshot” of the environment a function is in when it is executed. Its closure is its own internal copy of the environment.

A closure is the combination of a function and the lexical environment within which that function was declared.
— MDN

What’s unique about Closures? Creating private variables is a recognised feature of OOP. But Closures bring that advantage in functional programming too! Only JS can allow such strange concoction of programming paradims. Read this to see how!

3. Destructuring

Destructuring is a common way to cleanly extract properties from objects.

const obj = {
name: 'Joe',
food: 'cake'
}
const { name, food } = obj;
console.log(name, food);
// 'Joe' 'cake'

If you want to extract properties under a different name, you can specify them using the following format.

const obj = {
name: 'Joe',
food: 'cake'
}
const { name: myName, food: myFood } = obj;
console.log(myName, myFood);
// 'Joe' 'cake'

In the following example, destructuring is used to cleanly pass the person object to the introduce function. In other words, destructuring can be (and often is) used directly for extracting parameters passed to a function.

const person = {
name: 'Eddie',
age: 24
}
function introduce({ name, age }) {
console.log(`I'm ${name} and I'm ${age} years old!`);
}
console.log(introduce(person));
// "I'm Eddie and I'm 24 years old!"

4. Spread Syntax

Spread syntax (...) allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.

In the following case, Math.max can’t be applied to the arr array because it doesn’t take an array as an argument, it takes the individual elements as arguments. The spread operator ... is used to pull the individual elements out the array.

const arr = [4, 6, -1, 3, 10, 4];
const max = Math.max(...arr);
console.log(max);
// 10

5. Rest Syntax

You can use it to put any number of arguments passed to a function into an array!

const arr = [4, 6, -1, 3, 10, 4];
const max = Math.max(...arr);
console.log(max);
// 10
myFunc(1, 2, 3, 4);
// 3

5. Array Methods

To delve into the comprehensive possibilities of Array methods explore MDN. I will refer to some of the most commmon ones.

The Freelancing Highway with Devon Campbell – Honest Experiences, Mindset and More

The Freelancing Highway with Devon Campbell – Honest Experiences, Mindset and More

Recently I interviewed Devon Campbell, whose life changed after he chose web development. He has an agency, RadWorks, providing startups with web development and marketing strategy services. He also helped a lot of people get the life they want with web development. His personal website is RadDevon.com which is actually a treasure trove for budding freelancers.

I found him from Google while searching “freelance web development”.  He had great related content on it. I have been following his ways from his free content and it got me, my first client, too.

This interview will be valuable for anyone willing to build a career freelancing. The questions I explored with him are the common questions my juniors and batchmates had.

In this chat, Devon shares his honest experiences. How he decided to choose a different path and that changed everything. How he was as a child. What to expect while freelancing, understanding that freelancing is basically no different than entrepreneurship and many more.

I learnt a lot too. My key takeaways are some of his quotes:

“It seems so scary before you do it… but once you actually do it, it’s actually not that scary and you can sell yourself a lot better.” 

Since I am still an intermediate, I can relate deeply to it.

About the importance of marketing and understanding what the customer needs, he says,

“The marketing is so important and so underestimated… who am I talking to and what problems they are having? What skills do I need to solve those problems?” 

When asked if freelancing feels more secure than being employed…

“Deep down inside…it’s like someday it’s all gonna disappear and you will have nothing…I deal with that by looking back.” 

When logic plays with the mind, experience reminds reality.

Last but not the least, about the central piece of freelancing journey and relationships…

“If you can build trust, you can do it” 

Enjoy the chat show!

 

Watch on YouTube to jump to your specific questions of interest.

 

 

Clear your mind to run simulations

How would you describe your mind? Mostly a mess. It makes no sense. Can you lift a chair sitting on it? It’s the same with the mind. It’s not possible to understand the mind because you are using it to understand.

The only way to understand the mind is to be silent enough to let it speak its problems.

Enough with literature. How to do it? How to turn your mind from your foe to your friend?

Let’s start with your mental constructs. Your habitual thinking process. Why do you need them?

Like happens in cycles. You would want to stay in a cycle that favours the expression of your potentials.

Have a product, service or idea? Take it online yourself!

Do you have a product or service that you want to share with the world? 

Trust me technology is not what’s stopping you. It is the first few steps you need to take right now.

I am here to tell you that you can start yourself.  Yes, start earning yourself with your website.

Promote your own ads and everything.

Watch the video to know more.

Important links:

PPT: https://turjoysaha.tech/ppt​ eBook: https://turjoysaha.tech/CRO​ Music: https://www.bensound.com/​ Video: https://www.pexels.com/

Hope you get success and grow!

Thanks to Deepak Kanakaraju for pushing me into doing this video.

Please do comment below to let me know what you think.

RSS
LinkedIn
Share