DEV Community: Karthick (k)

JavaScript Math Reference

Karthick (k) — Thu, 02 Jul 2026 06:10:08 +0000

This guide is your complete reference to every Math property and method in JavaScript, all in one place — clean, concise, and ready to bookmark.

What is the Math Object?

The Math object in JavaScript lets you perform mathematical operations on numbers — everything from trigonometry and logarithms to rounding and random generation.

Math.sqrt(16); // 4
Math.PI;       // 3.141592653589793
Math.random(); // 0.5739201837

Commonly Used Examples

Math.max(10, 20, 5);  // → 20
Math.min(2, -3, 7);   // → -3
Math.pow(2, 3);       // → 8
Math.sign(-12);       // → -1
Math.floor(4.9);      // → 4
Math.random();        // → random value between 0–1

Want a random integer between 1 and 6 (like a dice roll)? Here’s your quick snippet:

Math.floor(Math.random() * 6) + 1;

More References

For a complete deep-dive on all JavaScript methods, syntax, and advanced examples, check the official MDN documentation or your favourite JS reference site.
(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)

Thank you.

How to Make a Resume

Karthick (k) — Wed, 01 Jul 2026 14:01:04 +0000

What is a Resume

A resume is a concise document that summarises your skills, experiences, and achievements to showcase your qualifications for a job. Understanding resume writing how-to is essential for creating a compelling resume that stands out. When learning how a resume is written, it’s important to focus on formatting, clarity, and relevance. Effective resume writing involves choosing the right structure, highlighting your most significant accomplishments, and tailoring the content to the job you’re applying for. By mastering how to write a resume, you can create a powerful tool that captures the attention of potential employers and helps you advance in your career.

I am attending a meeting with Payilagam Academy, and we got experiences and understanding of resume writing and how it is important the resume bulding resume and how it is essential for creating a resume. In the Muthu Sir meeting, Sir told me to write a resume for 10 minutes. C Joseph Vijay is a session very clear and powerful about resume-building written a small resume building about C Joseph Vijay.

C. Joseph Vijay

Summary:

C. Joseph Vijay is a former Chief Minister of Tamil Nadu. He founded the political party Tamilaga Vettri Kazhagam (TVK) in 2024 and recently took office as Chief Minister. Born on June 22, 1974, he is an Indian film actor and has been the ninth Chief Minister of Tamil Nadu since May 2, 2026. Vijay is recognised as the highest-paid actor in Tamil cinema. He is now applying for the post of Prime Minister. During his tenure as Chief Minister, he has initiated several projects, positioning him as a strong candidate for the role of Prime Minister.

Thank you

JavaScript DOM

Karthick (k) — Tue, 30 Jun 2026 16:13:54 +0000

Exploring JavaScript:
I am writing this because I have done several projects today, several projects done, and JavaScript DOM projects,

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Task -8 Word Counter</title>
</head>

<body>
    <h1>Word Counter</h1>

    <textarea id="Mytext" rows="7" cols="45" placeholder="Enter Something....."></textarea>
    <p>Words :<span id="wordcount">0</span></p>
    <p>Character :<span id="charcount">0</span></p>



    <script>
        let Mytext1 = document.getElementById("Mytext");
        let wordcount1 = document.getElementById("wordcount");
        let charcount1=document.getElementById("charcount")


        Mytext1.addEventListener("input", function () {
            wordcount1.textContent = Mytext1.value.split(" ").length;
            charcount1. textContent=Mytext1.value.length;

        })


    </script>
</body>

</html>

Today learned some interview questions about DOM JavaScript.

1.Get element=getElementById("id").

display on-screen content: text content.
innertext=show only gets visible text.

Conclusion:
Through this simple example, I've gained a deeper understanding of event handling in JavaScript and how we can dynamically manipulate the Document Object Model (DOM).

JavaScript DOM: The Backbone of Interactive Web Applications

Karthick (k) — Mon, 29 Jun 2026 12:27:59 +0000

Exploring JavaScript: Understanding `addEventListener` and `textContent`

In my recent exploration of web development, I delved into the fascinating world of JavaScript, particularly the use of addEventListener and textContent. I designed a simple HTML page to demonstrate these concepts, and I wanted to share my findings and the code with you all.

The Code

Here's the HTML structure I've created:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Button link</title>
</head>

<body>
    <h1 id="mytext">Welcome to Html</h1>
    <h3 id="mytext-1">welcome to DOM</h3>

    <button id="myBtn">submit</button>

    <script>
        let text_new = document.getElementById('mytext');
        let text_new_two = document.getElementById('mytext-1');
        let button_values = document.getElementById('myBtn');
        let count = 0;

        button_values.addEventListener("click", function () {
            count = count + 1;

            if (count === 1) {
                text_new.textContent = "Welcome to Javascript Roadmap";
                text_new_two.textContent = "Welcome to DOM Roadmap";
            } else {
                count = 0;
                text_new.textContent = "Welcome to HTML";
                text_new_two.textContent = "Welcome to DOM";
            }
        });
    </script>
</body>

</html>

Explanation

HTML Structure:
- The code starts with a simple HTML structure including two header tags (<h1> and <h3>) and a button. The headers display some introductory text.
JavaScript Functionality:
- I used JavaScript to add interactivity. With the addEventListener method, I attached a click event to the button.
- The click event toggles the content of the headers between two states. The first click changes the text to welcome messages related to JavaScript and the DOM roadmap. A subsequent click resets the text back to the original messages.
Understanding addEventListener:
- This method is essential for handling events in JavaScript. It allows us to execute a function whenever a specified event occurs (in this case, a click event).
Using textContent:
- The textContent property sets or returns the text content of the specified node and its descendants. It allows us to dynamically change the text displayed in our HTML elements based on interaction.

Conclusion

Through this simple example, I've gained a deeper understanding of event handling in JavaScript and how we can dynamically manipulate the Document Object Model (DOM). The addEventListener and textContent features empower developers to create engaging and interactive web applications.

Happy coding!

🚀 My First ChennaiPy Meetup Experience – Learning Beyond the Classroom

Karthick (k) — Sun, 28 Jun 2026 10:17:50 +0000

I attended the ChennaiPy meetup at IMSc (Institute of Mathematical Sciences), Chennai.

As a student who is learning Python and software development, this was one of the most valuable experiences I've had outside the classroom.

Technical Sessions

The speakers covered several interesting topics.

One session introduced the Linux Graphics Stack, explaining how graphics work in Linux systems and how different layers interact.

Another session focused on team collaboration, showing how development teams manage projects, communicate effectively, and build software together.

There was also a discussion about AI Agents, modern AI tools, and how developers can build Minimum Viable Products (MVPs) quickly using Python and AI technologies.

These talks helped me understand that software development is much more than writing code. It also involves collaboration, problem-solving, and choosing the right tools.

Networking During Tea Break ☕

One of the best parts of the meetup was the networking session during the tea break.

I spoke with several experienced software engineers.

One engineer from Cisco shared valuable career advice and explained the interview process followed in many companies.

I was also fortunate to receive a referral opportunity, which motivated me to continue improving my skills.

Talking with professionals who have 10–12 years of industry experience gave me a much clearer understanding of what companies expect from developers.

Thank You

A big thank you to the ChennaiPy community, the speakers, volunteers, and everyone who made this event possible.

I'm looking forward to attending more meetups and continuing my learning journey.

JavaScript DOM

Karthick (k) — Fri, 26 Jun 2026 05:54:45 +0000

DOM stands for Document Object Model.

DOM API provides a set of functions and methods to modify the HTML document dynamically via JavaScript.

getElementById() – select an element by ID.

getElementsByName() – select elements by name.

getElementsByTagName() – select elements by a tag name.

getElementsByClassName() – select elements by one or more class names.

querySelector() – select elements by CSS selectors.

Example: This example shows accessing the JavaScript HTML DOM by id.

<html>
<head></head>

<body>
    <h1 id="demo">This is some text.</h1>
    <button onclick="changeText()">
      Change Text
      </button>

    <script>
        function changeText() {
            let element = document.getElementById("demo");
            element.textContent = "Text changed by JavaScript!";
        }
    </script>
</body>

</html>

Accessing Elements in the DOM

getElementById()

let heading = document.getElementById("title"); console.log(heading.textContent);

getElementsByClassName()

Returns a collection of elements with a specified class.

let items = document.getElementsByClassName("list-item"); console.log(items[0].textContent);

JavaScript Rest Parameters

Karthick (k) — Thu, 25 Jun 2026 15:57:24 +0000

How I Finally Understood JavaScript Rest Parameters (...args)

As a beginner learning JavaScript, I was confused when I first saw the ...args syntax. I thought it was something very advanced. After practising, I realised it is actually simple and very useful.

What is a Rest Parameter?

A rest parameter allows us to collect multiple arguments into a single array.

Example:

function showNumbers(...numbers) {
    console.log(numbers);
}

showNumbers(10, 20, 30, 40);

Output:

[10, 20, 30, 40]

The ...numbers syntax collects all values and stores them in an array called numbers.

Why Use Rest Parameters?

Sometimes we don't know how many values a user will pass to a function.

For example:

sum(10, 20);
sum(10, 20, 30);
sum(10, 20, 30, 40, 50);

Instead of creating many parameters, we can use a rest parameter.

Example: Sum All Numbers

function sum(...numbers) {
    let total = 0;

    for (let num of numbers) {
        total += num;
    }

    return total;
}

console.log(sum(10, 20, 30, 40));

Output:

What I Learned

...args collects multiple values.
Rest parameters create an array.
They are useful when we don't know the number of arguments.
They are commonly used in modern JavaScript.

As a beginner, practising small examples helped me understand this concept much better than just reading the theory.

JavaScript Array Methods

Karthick (k) — Tue, 23 Jun 2026 07:33:14 +0000

JavaScript .forEach() for Array Iteration

The .forEach() Method

The .forEach() method is an array method that takes a callback function as an argument. It iterates through the elements in the array and executes the callback function on each element. The callback function can be defined as a function expression, an arrow function or a reference to a function. The syntax for .forEach() with an arrow function is as follows:

The syntax for .forEach()

array.forEach((element) => { // do something with element });

Iterating Over an Array with .forEach()

let numbers = [1, 2, 3, 4, 5];

for (let i = 0; i < numbers.length; i++) { console.log(numbers[i]); } /* OUTPUT 1 2 3 4 5 */

Or you could do it with the .forEach() method like this:

`let numbers = [1, 2, 3, 4, 5];

numbers.forEach((number) => console.log(number));
/*
OUTPUT
1
2
3
4
5
*/`

Arguments of the .forEach() Callback Function

The callback function that you pass to the .forEach() method can take up to three arguments. The first argument is the current element in the array. The second argument is the index of the current element. The third argument is the array itself:

array.forEach((element, index, array) => { // do something with element, index, and array });

The arguments are as follows:

element: The current element in the array
index: The index of the current element
array: The array itself

*JavaScript Map Array Method *

The .map() method effectively "maps" the values to a new array.

When to Use the Map Method

A map, in programming terms, is a transformation of values. The .map() method is a way for you to say, "transform each value according to my instructions". Maybe you want to double each value in the list? With .map(), it's straightforward:

const values = [1, 2, 3, 4, 5]; values. map((value) => value * 2); // [2, 4, 6, 8, 10]

Arguments to the .map() Callback

Like many array methods, the callback accepts more arguments than just the element in the array. With .map() it calls the callback with the element, index, and original array.

const values = [1, 2, 3, 4, 5]; values.map((value, index, array) => { console.log(value, index, array); }); // 1 0 [ 1, 2, 3, 4, 5 ] // 2 1 [ 1, 2, 3, 4, 5 ] // 3 2 [ 1, 2, 3, 4, 5 ] // 4 3 [ 1, 2, 3, 4, 5 ] // 5 4 [ 1, 2, 3, 4, 5 ]

What is Flattening?

Flattening refers to the process of converting a multidimensional array (an array that contains other arrays) into a single-dimensional array. This means taking all the nested elements and bringing them up one level in the hierarchy.

For example, if you have the following array:

const nestedArray = [1, 2, [3, 4, [5, 6]]];

Flattening this array would result in:

const flatArray = [1, 2, 3, 4, 5, 6];

Array Methods in JavaScript

Karthick (k) — Mon, 22 Jun 2026 06:08:00 +0000

*JavaScript Array Important Method *

To help you perform common tasks efficiently, JavaScript provides a wide variety of array methods. These methods allow you to add, remove, find, and transform array elements with ease.

JavaScript Array length

The length property of an array returns the number of elements in the array. It automatically updates as elements are added or removed.

let a = ["HTML", "CSS", "JS", "React"]; console.log(a.length);

JavaScript Array toString() Method

The toString() method converts the given value into a string with each element separated by commas.

let a = ["HTML", "CSS", "JS", "React"]; let s = a.toString(); console.log(s);

JavaScript Array join() Method

This join() method creates and returns a new string by concatenating all elements of an array. It uses a specified separator between each element in the resulting string.

let a = ["HTML", "CSS", "JS", "React"]; console.log(a.join('|'));

JavaScript Array.push() Method

The push() method is used to add an element at the end of an Array. As arrays in JavaScript are mutable objects, we can easily add or remove elements from the Array.

let a = [10, 20, 30, 40, 50]; a.push(60); a.push(70, 80, 90); console.log(a);

JavaScript Array.pop() Method

The pop() method is used to remove elements from the end of an array.

let a = [20, 30, 40, 50]; a.pop(); console.log(a);

JavaScript Array.shift() Method

shift() is a built-in JavaScript function that removes the first element from an array. The shift() function directly modifies the JavaScript array with which you are working. shift() returns the item you have removed from the array.

The shift() function removes the item at index position 0 and shifts the values at future index numbers down by one.

array.shift();

const array1 = [1, 2, 3];

const firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1`

JavaScript Array map() Method

The map() method creates an array by calling a specific function on each element present in the parent array. It is a non-mutating method.

`let a = [4, 9, 16, 25];
let sub = a.map(geeks);

function geeks() {
return a.map(Math.sqrt);
}
console.log(sub);`

What is the output of the following code?

let a = ["HTML", "CSS", "JS", "React"];

console.log(a.length);

Tell me Answer===>Command me

Solving Problems

Karthick (k) — Sun, 21 Jun 2026 14:40:56 +0000

Bouncing Back: Solving Problems, Writing Functions, and Pushing to GitLab

We all have days where life gets busy and we miss our study routine. After taking a short two-day break from my classes, I knew the most important thing was to just get back to the keyboard today.

Consistency isn't about being perfect every single day; it’s about starting again. Today, I broke the pause, dove back into my logic, and got things done!

What I Worked On Today

Instead of just reading theory, I focused heavily on hands-on practice. Here is what I covered during my session:

Problem Solving: I tackled logic problems to sharpen my analytical thinking and get back into the coding mindset.
Functions: I practised writing reusable blocks of code, focusing on how data goes into a function and how it returns a result.
Git & GitLab: Once my code worked locally, I staged my changes, committed them, and pushed everything up to GitLab to save my progress.

My GitLab Workflow

If you are learning version control, successfully running your Git commands feels like a massive win. Here is the exact sequence I used today to keep my cloud repository updated:

git status — To check which files I changed.
git add . — To stage my new code changes.
git commit -m "Add solved problems and function practice" — To save a snapshot of my work.
git push origin main — To send it safely up to GitLab.

Key Takeaway: Pushing your work to GitLab or GitHub is just as important as writing the code itself. It builds great professional habits and keeps your project safe!

Conclusion

It felt incredible to solve code logic and see that successful push message in my terminal today. Taking a break happens to everyone, but the comeback is what matters.

If you are on a learning journey too, don't worry if you miss a day or two. Just open your editor today and write that next function!

What did you build or practice today? Let me know in the comments!

Mastering JavaScript Arrays: Techniques and Best Practices

Karthick (k) — Fri, 19 Jun 2026 06:27:08 +0000

JavaScript Arrays

Introduction to JavaScript arrays

In JavaScript, an array is an ordered list of values. Each value is called an element specified by an index:

let car1 = "Saab"; let car2 = "Volvo"; let car3 ="BMW";

Declaration
There are two syntaxes for creating an empty array:

let arr = new Array(); let arr = [];

`let fruits = ["Apple", "Orange", "Plum"];

alert( fruits[0] ); // Apple
alert( fruits[1] ); // Orange
alert( fruits[2] ); // Plum`

In JavaScript, arrays aren't primitives but are instead Array objects with the following core characteristics:

JavaScript arrays are resizable and can contain a mix of different data types. (When those characteristics are undesirable, use typed arrays instead.)

JavaScript arrays are not associative arrays, and so, array elements cannot be accessed using arbitrary strings as indexes, but must be accessed using nonnegative integers (or their respective string form) as indexes.

JavaScript arrays are zero-indexed: the first element of an array is at index 0, the second is at index 1, and so on, and the last element is at the value of the array's length property minus 1.

JavaScript array-copy operations create shallow copies. (All standard built-in copy operations with any JavaScript objects create shallow copies, rather than deep copies.

Day 1 of Mastering Logic: Cracking 16 Essential Looping Problems

Karthick (k) — Thu, 18 Jun 2026 16:13:04 +0000

description: Today, my friend and I teamed up to tackle 16 fundamental looping and number-theory problems in JavaScript. Here is our Day 1 roadmap!

tags: JavaScript, programming, logic, learning

🚀 The Journey Begins: Day 1 of Looping & Logic

Today was an intense and highly productive day! My friend and I teamed up to push our programming logic to the next level. We decided to stop just reading code and start building logic from scratch.

We set a goal to complete 16 foundational looping and number-theory programs in Python. Working together made debugging faster and keeping each other accountable so much easier.

Since we spent all our energy crushing the logic, I’m keeping this blog brief, but I wanted to share the exact problem set we conquered today. If you are a beginner looking to build strong analytical skills, try solving these!

📋 The Day 1 Challenge List

We broke our challenges into two major categories: Pattern & Sequence Generation, and Number Properties & Theory.

Part 1: Sequence & Series Generation

Constant Series: Print 1 1 1 1 1 using a loop.
Linear Series: Print consecutive numbers 1 2 3 4 5.
Odd Numbers: Print the first five odd numbers 1 3 5 7 9.
Multiples of 3: Print the sequence 3 6 9 12 15.

Part 2: Number Theory & Divisibility

Common Multiples (AND): Find and print numbers that are multiples of both 3 and 5.
Combined Multiples (OR): Find and print numbers that are multiples of either 3 or 5.
Divisors Finder: Find all the mathematical divisors of a given number.
Count Divisors: Calculate the total number of divisors for a specific input.
Prime Number Check: Determine if a given number is prime (only divisible by 1 and itself).

Part 3: Digit Manipulation & Special Numbers

Reverse Printing: Take a number and print its digits in reverse order dynamically.
Count Digits: Count how many total digits are in a given number.
Sum of Digits: Extract and sum all individual digits of a number.
Reverse the Number: Mathematically reverse an integer (e.g., turning 123 into 321).
Palindrome Number: Check if a number reads the same backward as forward (like 121).
Armstrong Number: Verify if the sum of its digits raised to the power of the number of digits equals the original number (e.g., $153 = 1^3 + 5^3 + 3^3$).
Neon Number: Check if the sum of the digits of its square equals the original number (e.g., $9^2 = 81$, and $8 + 1 = 9$).

💡 Key Takeaways from Today

Two Brains Are Better Than One: Group studying helped us catch edge cases (like handling 0 or negative numbers in digit extraction) much faster.
The Power of Modulo (%): Whether it's finding divisors, checking primes, or stripping digits one by one, the % operator is an absolute king when working with loops.
Building a Foundation: Special numbers like Armstrong and Neon seemed tricky at first, but once you master Digit Extraction (using % 10 and // 10), they become simple variations of the same core logic.

💬 Let's Connect!

Have you solved these problems before? What was the hardest special number logic for you to crack when you started? Drop your thoughts in the comments!

Thank you---

DEV Community: Karthick (k)

JavaScript Math Reference

What is the Math Object?

How to Make a Resume

JavaScript DOM

JavaScript DOM: The Backbone of Interactive Web Applications

Exploring JavaScript: Understanding addEventListener and textContent

The Code

Explanation

Conclusion

🚀 My First ChennaiPy Meetup Experience – Learning Beyond the Classroom

JavaScript DOM

JavaScript Rest Parameters

How I Finally Understood JavaScript Rest Parameters (...args)

What is a Rest Parameter?

Why Use Rest Parameters?

Example: Sum All Numbers

What I Learned

JavaScript Array Methods

Array Methods in JavaScript

Solving Problems

Bouncing Back: Solving Problems, Writing Functions, and Pushing to GitLab

What I Worked On Today

My GitLab Workflow

Conclusion

Mastering JavaScript Arrays: Techniques and Best Practices

Day 1 of Mastering Logic: Cracking 16 Essential Looping Problems

tags: JavaScript, programming, logic, learning

🚀 The Journey Begins: Day 1 of Looping & Logic

📋 The Day 1 Challenge List

Part 1: Sequence & Series Generation

Part 2: Number Theory & Divisibility

Part 3: Digit Manipulation & Special Numbers

💡 Key Takeaways from Today

💬 Let's Connect!

Exploring JavaScript: Understanding `addEventListener` and `textContent`