Week 1 (Beginning Jan 10th) Learning Week Cycle 2 - emcsquared2/2022-Learning GitHub Wiki
Week 1 (Beginning Jan 10th) Learning Week Cycle 2
GCSE Computer Science
The use of basic string manipulation Basic file handling operations
Takeaway learning
Basic recap over string manipulation methods I am familiar with Intro to a program reading and writing data from and to text files (.txt)
MIMO Mobile app
Takeaway learning
Revising the language of 'passing'... We access array elements from within a function by passing the array to the function
Professor Steve
1.Ternary Operator 2. Introduction to Arrays
Takeaway learning
1.I'm pretty confident with this already but good to revise at the beginning of the year (when using the command prompt...Arrow up on the terminal console repeats the previous command!) 2. Revision of array methods .push adds an element on the end .pop removes one off the end shift off of the start arr.shift() removes element 0 unshift on at the star arr.unshift('FirstPlace')
Codewars Exercise (Level 8) Grasshopper - Object syntax debug
My Solution
I debugged the code constaining nested objects
Takeaway learning
When you next an object in another object you don't use an equal sign. Just use a colon as below
var rooms = {
first: {
JS Practice
The next exercise in the JS track is about "null" and "undefined". It's a somewhat confusing explanation so will look at a Professor Steve Video for help....
Professor Steve
Null and Undefined
Takeaway learning
Null and undefined are falsy values Null is something that you put inside a variable to say that there is nothing there - empty, void Undefined is the lack of something being set
console.log(typeof null); //object
console.log(typeof undefined); //undefined
console.log(null===undefined) //false
// (=== is object equivalency i.e. are these two the same object?)
console.log(null==undefined) //true
// (== is the value equivlalent? i.e. both truthy or both falsy?)
var x ;
console.log(x); //undefined
function abc(){
};
console.log(abc()) //undefined
function abc(){
return null
};
console.log(abc()) //null
//If an object exists but a property doesn't e.g.
var x = global.blah;
console.log(x) // undefined
//If an object doesn't exist
var x = glob.blah;
console.log(x) //ReferenceError: glob is not defined
//Finally. Null can be used intentionally
var y = null;
console.log(y); // null
JS Practice
Now I have watched Professor Steve's video, I understand this better. There is a bit extra added on in the JS Practice... Optional chaining using the '?'
const obj = {
address: {
street: 'Trincomalee Highway',
city: 'Batticaloa',
},
};
obj.address.zipCode;
// => undefined
obj.residence.street;
// => TypeError: Cannot read property 'street' of undefined
obj.residence?.street;
// => undefined
//JavaScript only tries to access the nested key if the parent was not `null` or `undefined`.
Nullish Coalescing
let amount = 0;
amount = amount ?? 6;
console.log(amount) // 6
// If to the left of the ?? is null or undefined then it returns the value on the right (6)
//If not then return the value to the left instead
let amount = 0;
amount = amount ?? 6;
console.log(amount) // 0 (because amount to the left is defined as 0
var amount;
amount = amount ?? 'hello';
console.log(amount) // hello
JS Practice
This practice exercise felt tough but was really good practice. I probably spent too much time playing and trying to work everything out on my own. The community solutions were vital to help me with the nullish coalescing bit.
My solution
There's a lot of code and explanation for this exercise so not worth pasting all.
After a while, you get feedback from the employees that they want the ticket status to be easier to understand at the first glance.
They only want to see either the name of the visitor or that the ticket is invalid.
Write a function `simpleTicketStatus` that accepts the same arguments as `ticketStatus` in task 3.
This function only returns one of two different results.
- the name of the visitor if the ticket was sold
- `'invalid ticket !!!'` if the ticket was not sold yet or the identifier was not found in the tracking object
```javascript
const tickets = {
'0H2AZ123': null,
'23LA9T41': 'Verena Nardi',
};
ticketStatus(tickets, '23LA9T41');
// => 'Verena Nardi'
ticketStatus(tickets, '0H2AZ123');
// => 'invalid ticket !!!'
ticketStatus(tickets, 'RE90VAW7');
// => 'invalid ticket !!!'
//SOLUTION
export function simpleTicketStatus(tickets, ticketId) {
return tickets[ticketId] ?? "invalid ticket !!!"
/*
//My original solution
for (let id in tickets){
if(tickets[ticketId] === undefined || tickets[ticketId] === null){
return "invalid ticket !!!"
} else if (id === ticketId){
return `${tickets[ticketId]}`
}
}*/
throw new Error('Please implement the simpleTicketStatus function.');
}
//Last question...
Due to new legal requirements, newly created visitor objects now also contain detailed information on the "General Terms & Conditions" (GTC) that the user agreed to.
You can see an example of the new visitor object below.
The cashiers of the amusement park now need to check whether a visitor needs to sign a new version of the GTC.
For this, implement a function `gtcVersion` that accepts a visitor object as an argument and returns the GTC version if it is available.
If the version information is not available, nothing should be returned.
SOLUTION
function gtcVersion(visitor) {
return visitor.gtc?.version
}
Udacity (Object Orientated JavaScript - Free Course)
Invoking Object Methods
Takeaway learning
You can name a function as an object method but it's not essential e.g.
const greeter = {
greet: function sayHello() {
console.log('Hello!');
}
};
It is still invoked in the same way as an anonymous function...
greeter.greet();
// 'Hello!'
Good recap of the .this keyword which allows us to access the properties of the object that it is called on. It can be used to access and mutate properties within the object.
/*
Create an object called `chameleon` with two properties:
1. `color`, whose value is initially set to 'green' or 'pink'
2. `changeColor`, a function which changes `chameleon`'s `color` to 'pink'
if it is 'green', or to 'green' if it is 'pink'
*/
const chameleon = {
color: 'green',
changeColor: function(){
this.color = 'pink';
}
};