mentorship fundamental JS

4 fundamentals in programming.js

// fundamental of any progamming langguage

1) variables
  var namaVar = 'fikri'
  let namaLet = 'fikri'
  const namaConst = 'fikri'

  const umur = 20
  const biodata = {
    tarikh_lahir: '20-10-1999',
    tempat_lahir: 'kuala lumpur',
    umur: 12,
  }

  const makananKegemaran = ['nasi lemak', 'roti canai', 'teh tarik']
  const pembahagi = (a, b) => a / b

// 2) loops

  for (let i = 0; i < 10; i++) {
    console.log(i)
  }

  makananKegemaran.forEach((makanan) => {
    console.log(makanan)
  })

  makananKegemaran.map((makanan) => {
    console.log(makanan)
  }

// 3) conditionals

  if (condition) {
    // code blocks
  } else if (condition) {
    // code blocks
  } else {

  }

  if (condition) {

  }

  switch (new Date().getDay()) {
    case 0:
      day = "Sunday";
      break;
    case 1:
      day = "Monday";
      break;
    case 2:
       day = "Tuesday";
      break;
    case 3:
      day = "Wednesday";
      break;
    case 4:
      day = "Thursday";
      break;
    case 5:
      day = "Friday";
      break;
    case 6:
      day = "Saturday";
  }

  const user = {
    jantina: 'lelaki'
  }

  // tenary operator

  const salutation = user.jantina === 'lelaki' ? 'mr' : 'mrs'

  const salutation
  if  (user.jantina === 'lelaki') {
    salutation = 'mr'
  } else {
    salutation = 'mrs'
  }


  {condition && <div>hello</div>}


// 4) functions

  function namaFunction() {

  }
  const namaFunction = () => {

  }

  const namaFunction = () => ()

array_filter.js

var numbers = [1,2,3,4,5,6,7,8,9]
console.log('nombor asal', numbers);
const bawah5 = numbers.filter(number => number < 5)

console.log(bawah5) // [1,2,3,4]

numbers[0] = 10
console.log('numbers', numbers)
console.log('bawah5', bawah5) // [1,2,3,4]

contoh conditioanal rendering dalam react.js

function Greeting(props) {
  const isLoggedIn = props.isLoggedIn;
  if (isLoggedIn) {
    return <UserGreeting />;
  }
  return <GuestGreeting />;
}

function Greeting(props) {
  const isLoggedIn = props.isLoggedIn;
  {isLoggedIn ? <UserGreeting /> : <GuestGreeting />}
}

function Greeting(props) {
  const isLoggedIn = props.isLoggedIn;
  {isLoggedIn && <UserGreeting />}
  {!isLoggedIn && <GuestGreeting />}
}

const root = ReactDOM.createRoot(document.getElementById('root')); 
// Try changing to isLoggedIn={true}:
root.render(<Greeting isLoggedIn={false} />);

function.js

const helloAwak = (nama, susunNama) => {
  console.log(`Hello ${susunNama(nama)}`);
}

helloAwak('ahmad', (nama) => {
  return nama.toUpperCase()
})

loop.js

const makananKegemaran = ['nasi lemak', 'roti canai', 'teh tarik']

const tambahAyat2 = (makanan, index) => {
  if (index > 1) {
    return 
  }
  console.log('saya suka makan ' + makanan)
  return makanan
}
const makanans = makananKegemaran.forEach(tambahAyat2)

// console.log(makanans);

// const tambahAyat = (makanan, index) => {
//   const msg = 'saya suka makan ' + makanan + ' ' + index
//   console.log(msg)
// }

// const tambahAyat = (makanan, index) => (
//   'saya suka makan ' + makanan + ' ' + index
// )

// const makanans = makananKegemaran.map(tambahAyat)

console.log(makanans);

object destructuring.js

const customer = {
  name: 'ahmad',
  age: 20,
  address: {
    street: 'jalan 1',
    city: 'jakarta'
  },
  hobbies: ['makan', 'tidur'],
  sayHello: function() {
    console.log('hello ')
  }
}

const customer2 = {...customer}

customer2.name = 'ali'

customer.name = 'nama lain'
console.log(customer2);
console.log('---------------customer 2-');

customer['pekerjaan'] = 'programmer'



const newCustomer = {
  ...customer,
  name: 'abu',
  kereta: 'proton',
  address: undefined

}




// const newCustomer = {
//   name: customer.name,
//   age: customer.age,
//   address: customer.address,
//   hobbies: customer.hobbies,
//   sayHello: customer.sayHello,
//   name: 'abu',
//   kereta: 'proton'
// }

console.log(newCustomer);
console.log('----------------');

console.log(customer);
console.log('----------------');

object.js

// use case utk dot
// utk object

const customer = {
  name: 'ahmad',
  age: 20,
  address: {
    street: 'jalan 1',
    city: 'jakarta'
  },
  hobbies: ['makan', 'tidur'],
  sayHello: function() {
    console.log('hello ')
  }
}

// console.log(customer.name);
// console.log(customer.address.city);

// Object.keys(customer).forEach((key) => {
//   console.log(key);
// })

console.log(customer.sayHello)
customer.sayHello
console.log('----------------');
const newFunction = customer.sayHello
console.log('sini dia kata hello');
newFunction()