DEV Community: Kuhanraja A R

Javascript - Objects

Kuhanraja A R — Tue, 29 Jul 2025 04:08:07 +0000

Objects:

programming element that groups data with relevant operations/behaviors

In real life, objects are things like : houses, cars, people, animals, or any other subjects.

Object Properties:

An object is a collection of properties, and a property is an association between a name (or key) and a value

A real life car has properties like weight and color

Object method:

Object Methods in JavaScript can be accessed by using functions. Functions in JavaScript are stored as property values. The objects can also be called without using brackets ().

A real life car has methods like start and stop:
car.start(), car.drive(), car.brake(), car.stop()

Difference between js variables and js objects:

Javascript variables are containers for data values.

Objects are variables too.. but objects contain many values.

const car = {type:"fiat", model:"500", color:"white"};

const keyword is the common practice to declare objects.

Object literal:

An Object Literal is a list of name:value pairs contain inside an object.

const person = {
first name: "john",
last name: "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName; 
}
};

to be discussed....

javascript conditional statements

Kuhanraja A R — Fri, 11 Jul 2025 05:00:20 +0000

Conditional statements:

JavaScript conditional statements allow you to execute specific blocks of code based on conditions. If the condition is met, a particular block of code will run; otherwise, another block of code will execute based on the condition.

Let see if statement:

The if statement:

The if statement evaluates a condition inside parentheses. If the condition is true, the block of code inside the curly braces {} runs. If it’s false, it skips that block.

let mark = 36;
let result;
if(mark >= 35)
{
result = "pass"
}
else{
result = "fail"
}

The if else statement:

The if-else statement will perform some action for a specific condition. Here we are using the else statement in which the else statement is written after the if statement and it has no condition in their code block.

if (ind>pak){
   console.log("ind win")
}else if ( pak > ind){
   console.log("pak won")
}  else{
console.log("draw")
}

Nested if else statement:

A nested if...else statement is an if...else structure placed inside another if or else block. This allows you to check multiple conditions in a hierarchical or layered way, making complex decision trees possible.

if (budget <= 25000)
{
  if (budget == "samsung")
    {
      if(cam == "64mp")
        else{
              (cam == "48mp")
            }
     }  
else if{
      if (brand == "oppo") {
      if (cam == "72mp") {
      }
}

javascript fundamentals -2

Kuhanraja A R — Wed, 09 Jul 2025 14:04:33 +0000

welcome to my blog

in javascript no++ means no+=1;

no = 5;
no = no * 5; (no*=5)

Comparison operator:
Comparison operators are used in logical statements to determine equality or difference between variables or values.
Types of comparison operator:
`== (equal value)
=== (equal type)
!= (not equal)
!==(not equal type and equal value)

(greater than)
< (less than)
= (greater than equal to)
<= (less than equal to)`

double(==):
15 == 5 (true) "10" == 10 (true) --> Dynamic typing

(triple ===):
Strictly checks the datatype too..
"10"===10 -->false

Not operator and Not equal operator
10!=10 --> false 10!="10" --> false 10!=="10" --> True.

Does Javascript supports dynamic typing in less than and greater than operator

Yes, JavaScript supports < (less than) and > (greater than) in dynamic typing — meaning you can compare variables of different types (like numbers, strings, booleans, etc.

(greater than >)
(less than <)
(greater than equal to >=)
(less than equal to <=)

`10 < 5 --> false
10 < 10 --> false
10 > 10 --> false
10 <= 10 --> True
11 > 10 --> True
11 >= 10 --> True
"11" >= 10 --> True

no = 10
(no++ > 10) --> false
(10 > 10)`

because it doesnot increment it displays the same number given and increment the number in the memory.

(++no > 10) --> True
(11 > 10)

In this case it is pre increment operator. It displays the incremented number at the first.

Logical AND and Logical OR.
condition 1 && condition 2 --> It is the operator for AND operator..

condition 1 || condition 2 --> It is the operator for OR operator..

In AND operator The condition passes when both the condition is true.

In OR operator The condition passes when either one of the condition is true

no = 10
(no ++ > 10 && --no < 15)

result : False

Ans is 11. This is why because,the first compared value is false. So, it takes 1st value itself. The first condition itself false in the AND operator. So, it doesn't check the another condition..

Javascript fundamentals

Kuhanraja A R — Tue, 08 Jul 2025 23:26:50 +0000

After a long days leave I am restarting my blog. I suffered from fever and i can't do things perfectly.

I am fighting with brain fog now. Ok, thanks to nobody but me..
Because I recovered from that......

First of all what is javascript and why javascript ?

JavaScript, often abbreviated as JS, is a programming language and core technology of the World Wide Web, alongside HTML and CSS. Ninety-nine percent of websites use JavaScript on the client side for webpage behavior. Web browsers have a dedicated JavaScript engine that executes the client code. These engines are also utilized in some servers and a variety of apps. The most popular runtime system for non-browser usage is Node.

Why Javascript ?

JavaScript is used to create dynamic and interactive content on websites, enhancing user experience by enabling features like animations, form validation, and real-time updates. It is also employed in web applications, mobile app development, and server-side scripting, making it a versatile programming language.

Javascript Datatypes

*String
*Number
*Bigint
*Boolean
*Undefined
*Null
*symbol
*Object

What is an Object?

Object has some shape and behaviour.Object is nothing bt Collection of attributes.

person{
name
age
qualification
gender
weight
height
}

In this person is an object and these data are the attributes.

Interview question:

Difference between Null and Undefined?

In JavaScript, both null and undefined represent the absence of a value, but they convey different meanings and arise in different contexts.

undefined indicates that a variable has been declared but has not yet been assigned a value. It also occurs when attempting to access a non-existent property of an object or when a function does not explicitly return a value.

null represents the intentional absence of any object value. It is a primitive value that signifies an empty or unknown value that has been explicitly assigned.

In simple words from my understanding,
If the assigned thing is single then it is variable.

If the assigned thing is collective then it is a object.

In Javascript variable consists of 3:
var,let,const

const - static or unchangeable once it is assigned.
let - we can declare the variable at first and we cant declare twice but we can assign any variable
var - we can declare it twice in the program

Javascript can be written internally and externally.

without index.html It can't be executed.

<br> ----> internal js file<br> <script> </p> <p><script src="myscripts.js"> ----> external js file

log is a debugging function here..

First program:

let i = 10;
console.log(i)


output:
10

let i = true;
console.log(type of(i));

type of -->datatype identifier --> number or string or boolean..

statically type : | dynamically type:

String name = "abc" | No need of mentioning

int no = 10; | data-type

Basically statically typed programming is also called as duck-typed programming.

variable --> initialization , declaration.

let i -- > declaration of the variable
let i = 10; --> initialization of the variable

let allows the assign the memory to anything after declaration

constant:
const i = 10;
i=15;
log(i); Ans:10.

because of constant variable. It value declaration is inchangeable.

interpreter --> line by line execution.
Compiler --> whole page execution.

const i = 10;
console.log("before" + i);
i=15;
console.log("after" + i);

output:
before10
type error: constant variable can't be assigned

History of javascript

JavaScript was created by Brendan Eich at Netscape in 1995, initially named Mocha, then LiveScript, and finally, JavaScript. It was designed to add dynamic and interactive elements to web pages, complementing the static nature of HTML and CSS. Its initial implementation was in Netscape Navigator, and it has since become the dominant scripting language for the web, standardized as ECMAScript.

Variables and Datatypes..

--> Dynamic type datascript.

let i = 10;
console.log(i+"5")

It automatically recognises that it is a number datatype..

ex: "pushpa" + 2

If we give commands like "abc" - 5;
it shows NaN which means not a number

increment operator and decrement operator

variable++
variable--

is the syntax for the increment and decrement operator.

It also consists of two :
pre-increment (++no)
post - increment (no++)

Difference between Var and let

Scoping: var (Function-scoped or Global-scoped): Variables declared with var are scoped to the nearest function or, if declared outside any function, to the global scope. This means they are accessible throughout the entire function or globally, regardless of block boundaries (like if statements or for loops).

let (Block-scoped):
Variables declared with let are block-scoped, meaning they are only accessible within the specific block (defined by curly braces {}) where they are declared. This provides more granular control over variable visibility and helps prevent unintended side effects.

Hoisting: var: var declarations are hoisted to the top of their scope (function or global) and initialized with undefined. This means you can reference a var variable before its declaration in the code without a ReferenceError, though its value will be undefined until the declaration line is reached.

let:
let declarations are also hoisted, but they are not initialized with a default value. Attempting to access a let variable before its declaration results in a ReferenceError due to the "Temporal Dead Zone."

Re-declaration: var: var allows for re-declaration of variables within the same scope without error. This can lead to accidental overwriting of variables, making code harder to debug.

let:
let does not allow re-declaration of variables within the same block scope. Attempting to re-declare a let variable will result in a SyntaxError. This helps enforce stricter variable management and reduce potential bugs.

In summary:
Use let (and const when a variable's value should not be reassigned) in modern JavaScript development to leverage block-scoping and prevent common pitfalls associated with var, leading to more predictable and robust code.

for example :

let k = 5;
console.log(k++ - --k + k++ - ++k + k--);
console.log(k)

output:
5
6

in first it displays 5 and stores 6 in the memory. Then due to pre decrement we have to set that into 5 again. then again it display 5 in third operator 5 and stores 6 again. then by increment in 4th operator. it shows 7 in the 4th operator and as the 6th operator has decrement it shows 7 only but it stores as 6.

Avalothaan pa ithudan vilaiyattu seithigal mudivadaikirathu......

Instagram replica using html, css

Kuhanraja A R — Thu, 26 Jun 2025 21:13:31 +0000

Two days I am leave.

With my acquired knowledge. I am managed to create html,css.

But there a lot of blunder.

Athu epdi thimingalam. Antha vandi mattum mileage nalla poguthu(vijay sir work)

Service vitta vandi athu apdi thaan pogum.(vijay sir work)
Vandi -

Practice makes a human perfect.

naan ipa thaan vandi eduthuruken aana vandi vandiya illa partsaa.. irukku

ipa thaan otti raceku vidanum..

Ellame thappu thappa panren..
etho panniruken. Epdi panrennu therla.

Ore Confusionaa.. irukku rightuu.. polamburatha.. vitutu senjiten..

git la publish pannen. aana branch connect aagala..

mudiyala mudiyala....

code is in my gilab account:

https://gitlab.com/june-webdesigning/front-end

HTML class about tables

Kuhanraja A R — Sat, 21 Jun 2025 00:06:40 +0000

I am just writing the blog what i have learnt in that class.

Note:
Don't take this as a reference. Then, I am not responsibility for your exam marks.

Ok, asusual late for class. Class started already iam just 5 to 9 minutes late. I think so,

I learned about:

display:flex;
justify-content - center;

This is for row-wise alignment.

For column - wise
align-items:center;

then, unordered list and giving inside a list of ordered items.
ul
li /li
/ul

Then I have learned about tables how it works.

tables
head
tr
th /th
/tr
/head
body
tr
td /td
/tr
/body

this is the method to create table.

I cant use the tag symbol here. because, It is not showing anything. Don't think he is wrong.
(Adthane paatu ketute eludhunaa thappu thappa thaan eludhuva)
It is not like that.
I think i caught you're mind voice..

This will create borders on every tags you are given.
If you want to remove borders inside that.
border-collapse : collapse;

for giving the body colour. Target the body tag and give
background : linear-gradient(to left, colour, colour, colour)

That's all for today, if you see any mistakes (add comments) and rectify me.

If you want detailed information see internet.

disclaimer: I am not internet. I am a student. Search yourself and learn. we are not in stone age.

Subversion (SVN) is a centralized version control system where all files and revision history are maintained on a single central server. Developers work by checking out files, making changes, and committing them back to the server. This setup makes it easy to manage but requires a constant connection to the server and can create bottlenecks if the server is unavailable.

Mercurial is a distributed version control system, meaning each user has a complete copy of the entire repository, including its history. It allows developers to work offline and commit locally before pushing changes to a shared repository. Mercurial is known for its speed, simplicity, and consistent command structure, although it's less widely adopted than Git.

Perforce (Helix Core) is a version control system optimized for large-scale development environments, particularly where large binary assets are involved, such as in game or enterprise software development. While it can operate in a centralized way, it also supports distributed workflows. Perforce is powerful and scalable but often more complex to configure and use than other systems.

As I said I told about other version control systems too..

I'll to try to create a project resume and publish in gitlab.
$$MaranaBeethi
$$Nee Yeri adi kabila idhu namma kaalam

If i put hastag it showcases like headings.(ennada ipdi kaal vaikura edam ellam kanni vedi vachaa enna thaan panrathu...)
See you tomorrow. Eat healthy feel positive, Because you want some separate energy to read by blog..

And Very Most important Stay alive for my next blog..

Now go and sleep. Read in the morning everyone. Because it's get bored while reading in the morning..

next blog time ..... Therla(You_fill_it)

Today learning about html/Css

Kuhanraja A R — Fri, 20 Jun 2025 23:39:40 +0000

Of course, I joined in the middle of the class. Class started. I went to class by 12pm. It's late.

Ok I sat in the first desk of the class. Vijay sir started teaching about how grid works.

What is Grid in Css?
In Cascading Style Sheets, CSS grid layout or CSS grid creates complex responsive web design grid layouts more easily and consistently across browsers. Historically, there have been other methods for controlling web page layout methods, such as tables, floats, and more recently, CSS Flexible Box Layout.

By using this command:
display-grid
grid-template-columns 1fr 2fr

fr - fractional unit

Literally I crashed in the middle of the class. So I don't know many commands in it.

some of commands which I learnt:
img src = " " alt=" "
src->source
alt->alternative

this tag is used for adding image.

border radius -> Used for image border circling.

display : flex;
justify-content : center;

-> horizontal rule.
hr is a standalone tag

-> unordered list
li -> list tag
colour : white;

colour -> text-colour

This all the commands I learnt in that class.
There a website named Frogg flexbox to learn clearly about grid

Suddenly a man crashed our class. Muthu Sir,

**Started with F-droid opensource benefits

Ended with his tea addiction.**

Like Boarding the flight in Philippines

Departing in the flight in USA

Class ended there.

Then Sir continued the class at 4pm.

That's all for today's blog..

Stay alive for my next blog

Today no class (explained Toss conference)

Kuhanraja A R — Wed, 18 Jun 2025 20:20:23 +0000

Ok Blog starts....

One of the friend from java class told me that it already starts at 11.00am.

I went to class by 11.30am. It is not my fault. My class starts by 11.30am. Already it is a medical miracle. I came early to the class. which was clearly on time.

Usually I come to class by 11.45am but today its unusual.

My fate "Today no class". In corner of my mind a vadivelu joke is loading like -
"pothum naa savaal vittathum pothum naa sangadapadurathu pothum"

ok jokes apart..

Today a seminar was conducted from tamil linux community related to toss conference.

Speaker named himself as Syed Jaffer.
he is working in Bosch international Company.

I don't know who he is.
and then I shocked..

I'll tell later. Save your curiosity..for a short while..

Then we went to upstairs due to overload of human availability.(I mean Students).

Then he explained the importance of opensource tools and DSA (Data Structures and Algorithms)

Then he said who are all interested to put stall in toss conf.
everyone raised their hands.

There are 3 options to put stall:
i) If you are developing a tool and you want to showcase your tool to others.
ii) If you know any open-source tool and you are ready to share your thoughts.
iii) They give you any open-source tool and explain it to you. You have to explain, experience your thoughts.

For me ofcourse,iii) option...

They asked us to login their group through telegram..
Toss conference is conducting for 2 days july19,july20 in St.joseph college chennai.

After i logged in i shocked that.He is parotta salna. I mean he is the admin for the youtube channel parotta salna. clearly unexpected..

ok this was the things happened today.

There is nothing much to talk about. Again sleepy time..

Wait for the next blog..Until then be alive for my next blog..
Eat well, sleep well..
Because you want some strength to read my blog..

Ok i'll finish my confusion here..

What is git? and what is .yml file

Kuhanraja A R — Tue, 17 Jun 2025 20:49:37 +0000

What is git?

Git is a distributed version control system, which means that a local clone of the project is a complete version control repository. These fully functional local repositories make it easy to work offline or remotely. Developers commit their work locally, and then sync their copy of the repository with the copy on the server. This paradigm differs from centralized version control where clients must synchronize code with a server before creating new versions of code.

What is version control system?

Version control, also known as source control, is the practice of tracking and managing changes to software code. Version control systems are software tools that help software teams manage changes to source code over time. As development environments have accelerated, version control systems help software teams work faster and smarter. They are especially useful for DevOps teams since they help them to reduce development time and increase successful deployments.

There are two types of popular version control systems which I know:

One is Github and another one is Gitlab

But,Github is so popular which is used by many people across the world
Why gitlab is not popular.

I think my guess is, Microsoft bought github in 2018.so, that it became popular through promotions and many useful things to use.

Gitlab is still an opensource why gitlab is not so popular compared to git hub

GitHub has a slight edge here due to its extensive marketplace of third-party integrations. It offers seamless integration with project management tools, code quality analysis tools, deployment platforms, and more. While also providing integrations, GitLab may have a smaller selection than GitHub

Comparison chart:

In my point of view, Both are good in its work. Github has more Projects and gitlab can add more contributors.

But Local repository git commands works same on both github as well as gitlab.

If you want to gossip with friends. when whatsapp and all social medias down.And show your manger that you are really working by showing blue colour contributed boxes Use gitlab...

or if you want to steal projects for college purposes. Dont want to get zero mark on project final review and get a nice name among friends and try to put some ice on HOD's Head. Use Github..

There are other Version Control Systems too...

Subversion (SVN), Mercurial, and Perforce...
Lets talk about next blog. Time is night 2..

What is yml?

A .yml file, often referred to as a YAML file, is a human-readable data serialization format. It's commonly used for configuration files and data exchange between systems due to its simplicity and ease of understanding. YAML stands for "YAML Ain't Markup Language"

YAML is a human-readable data serialization language that is often used for writing configuration files. Depending on whom you ask, YAML stands for yet another markup language or YAML ain't markup language (a recursive acronym), which emphasizes that YAML is for data, not documents.

I took that yml data from 2 different internet sources. Take anything you like. It is also a open-source to use..(laugh emoji)

Why so long gap? In writing blog?
I dont know the answer.

That's all about today's blog. I wrote that open_hearted,open_sourced, open_(you fill it)

my mind stops working now. Let me take rest....BYE

See you in Next blog. Until then be alive for my next blog and Take care...

18 april at payilagam (For loop using string)

Kuhanraja A R — Fri, 18 Apr 2025 14:24:55 +0000

For Statement:

The for statement in Python differs a bit from what you may be used to in C or Pascal. Rather than always iterating over an arithmetic progression of numbers (like in Pascal), or giving the user the ability to define both the iteration step and halting condition (as C), Python’s for statement iterates over the items of any sequence (a list or a string), in the order that they appear in the sequence.

# Vowels in name
name = "kuhan"
print("aeiou" in name)

sen = "today is a friday"
print("friday" in sen)
print("abcd" not in sen)
print("fri" in sen)
print("abcd" not in sen)

# indexing
sentence = input("enter name : ")
print("Your First letter is : ",sentence[0])
print("Your Last letter is : ",sentence[-1])

sen = "salman"
for every_letter in sen:
    print(every_letter[0:1])

name = "mohd salman"
for letter in name:
    print(letter)

# count of y:

count = 0
sen="today is friday"
for letter in sen:
    if letter == 'y':
        count+=1
else:
    print(count)

#Count of vowels

count_of_vowels=0
vowels = "aeiou"
name = "kuhanraja"
for every_letter in name:
    if every_letter in vowels:
        count_of_vowels+=1
else:
    print(count_of_vowels)

count_of_vowels = 0
vowels = "aeiou"
name = "kuhanraja"
for every_letter in name:
    if every_letter == 'n':
        break
    print(every_letter,end=' ')
else:
    print("Hi")

Day - 10 at payilagam "Discussion"

Kuhanraja A R — Fri, 11 Apr 2025 13:17:58 +0000

Father And Daughter Story :
Small Girl Asking to her father 5rs daily. Instead, father saying he'll give 1re on day1 and so on until day 5.

as per father :

total = 0
no = 1
while no<=5:
      total = total + no
      no=no+1
print(total)

Output:
15

As per Daughter :

total = 0
no = 1
while no < = 5:
      total = total + 5
      no = no + 1
print(total)

Output:
25

Day - 9 at payilagam "Looping"

Kuhanraja A R — Thu, 10 Apr 2025 11:18:18 +0000

What is loop

Loops or Iteration Statements in Programming are helpful when we need a specific task in repetition. They're essential as they reduce hours of work to seconds. In this article, we will explore the basics of loops, with the different types and best practices

While loop :
Python While Loop is used to execute a block of statements repeatedly until a given condition is satisfied. When the condition becomes false, the line immediately after the loop in the program is executed.

no1 = int(input("enter no :"))
no2 = int(input("enter no :"))

if no1>no2:
   print(no1)

elif no1<no2:
     print(no2)

else:
     print("no1 and no2 are not same")

instead:

no = 1
while no<=5
     print(no,end=' ')
     no+=1

Variable length argument.
print statement take many arguments as possible.


print("hi")
print("hi","hello")
print("mohammed","salman")
print(5,10,15)
print('09','April','2025',sep = '-',end='/')
print('09','April','2025',end='#')

Use python visualizer to visualize

*Addition of first N nnumbers : *

no = 1
total = 0
while no<=5:
    print(no,end=' ')
    total = total+no
    no+=1
print('\n',total,sep=' ')

Multiplication of First N numbers

no = 1
total = 5
while no < 5:
      print(no,end=' ')
      total = total * no
      no+=1
print('\n', total,sep=' ')

no = 1
while no<=10:
      if no%6 ==0:
         break
      print(no)
      no+=1


no = 1
while no<=5:
     if no%4 == 0:
        break
     print(no)
     no+=1
else :
    print("hi",no)

PS1 = "[OPMB10 $]" PS1 is an environment variable in Linux that defines the primary command prompt's appearance in the terminal. It allows users to customize their prompt to include information like the username, hostname, current directory, and even colors, enhancing the terminal experience.

TASK:
1) odd or even

no1 = 1
no2 = 10

while no1 <= no2:
    if start % 2 == 0:
        print("It is Even")
    else:
        print("It is Odd")
    no1 += 1

2)prime number

num = int(input("Enter a number: "))
i = 2

if num <= 1:
    print("Not Prime")
else:
    while i < num:
        if num % i == 0:
            print("Not Prime")
            break
        i += 1
    else:
        print("Prime")