DEV Community: Maks Szymczak

Wszystko, co musisz wiedzieć o pętlach w JavaScript

Maks Szymczak — Wed, 21 Feb 2024 14:20:19 +0000

Witaj w świecie JavaScript, języku, który napędza interaktywne strony internetowe, aplikacje webowe, a nawet serwery. Dzisiaj skupimy się na jednym z fundamentalnych konceptów programowania w JavaScript – pętlach. Pętle są niezbędne, by wykonywać powtarzalne zadania bez konieczności pisania tego samego kodu wielokrotnie. Jeśli dopiero zaczynasz swoją przygodę z programowaniem, tak jak ja, ten post jest dla Ciebie. Przyjrzymy się różnym typom pętli dostępnym w JavaScript i wyjaśnimy, kiedy i jak ich używać.

Co to jest pętla?

W najprostszych słowach, pętla to konstrukcja programistyczna pozwalająca na wielokrotne wykonanie fragmentu kodu. Wyobraź sobie pętlę jako instrukcję dla komputera, która mówi: "Robi to x razy" lub "Kontynuuj robienie tego, dopóki spełniony jest dany warunek".

Rodzaje pętli w JavaScript

W JavaScript mamy kilka typów pętli, każdy z nich ma swoje specyficzne zastosowania:

Pętla for
Jest to najbardziej podstawowa forma pętli. Używamy jej, gdy z góry wiemy, ile razy chcemy, aby nasz kod został wykonany.

Pętla while
Pętla while wykonuje się, dopóki określony w niej warunek jest prawdziwy. Jest idealna, gdy nie jesteśmy pewni, ile dokładnie razy musi zostać wykonany kod.

Pętla do...while
Podobna do pętli while, ale z tą różnicą, że kod wewnątrz pętli wykonuje się przynajmniej raz, a dopiero potem sprawdzany jest warunek kontynuacji.

Kiedy używać której pętli?
Wybór pętli zależy od specyfiki zadania:

Użyj for, gdy wiesz, ile razy pętla powinna się wykonać.
Wybierz while, jeśli liczba iteracji zależy od spełnienia warunku, którego nie da się łatwo przewidzieć przed rozpoczęciem pętli.
do...while jest dobrym wyborem, gdy chcesz, aby kod wykonał się przynajmniej raz.

Pamiętaj, że wybór odpowiedniego typu pętli może znacząco wpłynąć na czytelność i efektywność Twojego kodu. Mam nadzieję, że ten post pomógł Ci zrozumieć różnice między różnymi rodzajami pętli w JavaScript. Eksperymentuj z nimi i zobacz, jak mogą one ułatwić Ci życie podczas kodowania!

Przykład: Jak Pętle Ułatwiają Życie?

Załóżmy, że chcesz wyświetlić numery od 1 do 10. Zamiast pisać console.log dziesięć razy, możesz użyć pętli for:

Proste, prawda? Ale to dopiero początek magii pętli.

Świetne Ćwiczenie: Stwórz Choinkę!
Nasz cel to narysować coś takiego:

JavaScript Basics: Understanding STRING Data Types

Maks Szymczak — Wed, 07 Feb 2024 19:22:38 +0000

In today's post, we'll take a closer look at the basic data types in JavaScript, which are fundamental for anyone wanting to delve into the secrets of this language. JavaScript, being one of the most popular programming languages in the world, offers a variety of data types that help in manipulating values in our programs. Understanding these types is key to efficient coding and avoiding errors. Let's get to the heart of the matter:

String

The string type represents sequences of characters. We can think of it as words or sentences. In JavaScript, strings are enclosed with single ('), double ("), or backticks (`), which allow for the interpolation of variables and expressions.

Number

Number is a data type that includes both integers and floating-point numbers. JavaScript uses a 64-bit double-precision floating-point number, which means there is no separate type for integers and floating-point numbers - all are treated as number.

BigInt

For very large numbers that exceed the safe representation limit for the number type, JavaScript introduced BigInt. It allows for safe operations on large integers, even those exceeding 2^53.

Boolean

Boolean is a data type that takes one of two values: true or false. It is used for performing logical operations, such as testing conditions in conditional statements.

Undefined

Undefined is the type assigned to variables that have not been initialized, meaning they have not been assigned any value.

Symbol

Symbol is a new data type in ES6 that allows for the creation of unique and immutable identifiers. Symbols are often used to create unique properties of objects.

Null

Null In JavaScript, null is a type that has exactly one value: null. It signifies "no value" or "unknown value" and is often used to deliberately set a variable to a state where it has no value.

Różnice między var, let i const w JavaScript

Maks Szymczak — Wed, 07 Feb 2024 15:36:43 +0000

W świecie JavaScript, zarządzanie zmiennymi jest kluczowym elementem każdego projektu. Od ES6 (ECMAScript 2015) programiści mają do dyspozycji trzy słowa kluczowe do deklarowania zmiennych: var, let i const. Każde z nich ma swoje unikalne cechy i zastosowania. W tym artykule przyjrzymy się bliżej różnicom między nimi i najlepszym praktykom ich używania.

var – Stary, ale jary

var to najstarszy sposób deklarowania zmiennych w JavaScript. Zmienne zadeklarowane za pomocą var mają zasięg funkcji (function scope), co oznacza, że są dostępne w całej funkcji, w której zostały zadeklarowane, lub globalnie, jeśli zostały zadeklarowane poza funkcją.

Hoisting

Zmienne zadeklarowane za pomocą var są poddawane hoistingowi, co oznacza, że są "przenoszone" na górę swojego zasięgu przed wykonaniem kodu. Jednakże, tylko deklaracja jest przenoszona, nie inicjalizacja.

Przykład:

let – Nowoczesna alternatywa

let zostało wprowadzone w ES6 jako sposób na rozwiązanie niektórych problemów związanych z var, zwłaszcza w kontekście zasięgu blokowego. Zmienne zadeklarowane za pomocą let mają zasięg blokowy (block scope), co oznacza, że są dostępne tylko w bloku, w którym zostały zadeklarowane.

Brak hoistingu
W przeciwieństwie do var, zmienne zadeklarowane za pomocą let nie są poddawane hoistingu, co oznacza, że nie można się do nich odwołać przed ich deklaracją.

Przykład:

const – Stałe wartości
const również zostało wprowadzone w ES6 i służy do deklarowania zmiennych, których wartość nie może być zmieniona przez ponowne przypisanie. Podobnie jak let, const ma zasięg blokowy.

Niezmienność

Warto zauważyć, że const zapewnia niezmienność tylko na poziomie przypisania. Oznacza to, że jeśli przypiszemy do const obiekt, możemy zmieniać jego właściwości.

Przykład:

Kiedy używać var, let i const?

var: Ze względu na swoje ograniczenia i potencjalne problemy związane z hoistingiem oraz zasięgiem, stosowanie var jest obecnie zalecane tylko w przypadkach, gdy pracujemy z istniejącym kodem, który z niego korzysta, lub gdy mamy do czynienia z bardzo specyficznymi przypadkami użycia.

let: Jest to dobry wybór, gdy potrzebujemy zmiennej, której wartość może się zmieniać i która ma być dostępna tylko w określonym bloku kodu.

const: Powinno być domyślnym wyborem przy deklarowaniu każdej zmiennej, której wartość nie będzie zmieniana w przyszłości. Używanie const może pomóc w zapobieganiu błędom związanym z niechcianym przypisaniem nowych wartości.

Podsumowanie
Rozumienie różnic między var, let i const oraz ich odpowiednie stosowanie może znacząco wpłynąć na czytelność, bezpieczeństwo i wydajność naszego kodu. Przechodząc na nowoczesne standardy ES6, zaleca się ograniczenie użycia var na rzecz let i const, co przyczynia się do tworzenia bardziej przewidywalnego i łatwiejszego do zarządzania kodu.

Caesar Cipher in JavaScript: Simple Magic of Encryption with 3 Shifts

Maks Szymczak — Thu, 18 Jan 2024 15:17:00 +0000

I recently discussed the topic of the Caesar Cipher with my mentor, and it greatly intrigued me. Ciphers have always sparked our curiosity. Today, we will explore one of the oldest and simplest - the Caesar Cipher. Named in honor of the famous Roman general Julius Caesar, this shifting cipher will introduce us to the fascinating world of cryptography. We will try to understand if, despite its simplicity, it can be used for secure information transmission. To do this, we will use the JavaScript language to implement and observe in action this classical cipher.

What exactly is the Caesar Cipher?

The Caesar Cipher is a type of substitution cipher in which each letter in the plaintext is replaced by a letter shifted by a constant number of positions in the alphabet. In the case of this cipher, the shift value is known as the encryption key.

Is the Caesar Cipher secure?

Unfortunately, despite its simplicity, the Caesar Cipher does not offer a high level of security. The limited number of possible shifts and the common occurrence of certain letters make maintaining the confidentiality of information challenging.

Let's see how the Caesar Cipher with a shift of 3 positions looks for the text in JavaScript.

On the console, you will see the Caesar Cipher

Now let's analyze the code that I worked on with my mentor.

1. Defining the encrypt function:

We are specifying exactly what our function should do. We named it "encrypt" indicating that its purpose will be to encrypt text.

2. Converting text to Unicode codes:

Each character in the text is converted to its Unicode code. The "charCodeAt(0)" function in JavaScript transforms each character in the text into its corresponding Unicode code.

3.Shifting codes by 3 positions up:

We're adding an encryption step that shifts each character in the "textToEncrypt" array by 3 positions up in the alphabet.

4.Converting codes back to characters:

After shifting Unicode codes, we obtain new codes that need to be converted back to characters. The "String.fromCharCode" function in JavaScript performs this conversion, turning codes into their corresponding letters.

5.Displaying the encrypted text:

In the final step, we showcase the encrypted text in the console using "console.log". This allows us to see the outcome of the encryption.

A Simplified Version of the Caesar Cipher Implementation

It's crucial to point out that our implementation of the Caesar Cipher is quite basic. This is not a comprehensive representation of the traditional Caesar Cipher but a significantly simplified version. We've taken this approach for ease of understanding and demonstration purposes, so keep in mind that a full-fledged implementation would involve additional complexities and considerations.

What Can Be Improved?

At the end:
In our exploration of the classic Caesar Cipher, it's important to note that we're not confined to the decimal system. We can just as easily represent encrypted texts in binary or hexadecimal form. This flexibility keeps the Caesar Cipher as an intriguing tool in the realm of information security.

Happy Coding!👨🏻‍💻

🚀 Exploring the Craft of Troubleshooting in Coding 🚀

Maks Szymczak — Tue, 16 Jan 2024 11:01:39 +0000

Introduction:

Embarking on the coding journey inevitably introduces us to challenges in problem-solving. Let's dive into the intricacies of troubleshooting and unveil strategies to hone this indispensable skill.

Embracing the Problem-Solving Mindset:
Recognize that tackling issues is a natural part of the coding process:

Shift your perspective to view challenges as opportunities for learning and enhancement.
Nurture patience and persistence when dealing with coding hiccups.

Making the Most of Problem-Solving Tools:
Check out and get comfy using the tools you've got

Learn the ropes of the built-in debuggers in your coding setup.
Familiarize yourself with browser tools, especially if you're into web development.

Taking a Closer Look with Logs and Prints:
Use logs and prints like a secret weapon

Drop in some logs to follow the path your code takes.
Throw in print statements strategically to spot variables and flow.

Decoding Messages and Errors:
Understand those cryptic coding messages like a pro

Learn to read error messages like a champ.
Look up online resources when you're puzzled about what went wrong.

Team Up for Problem-Solving:
Join forces with others for some group problem-solving

Share your screen and code with a coding buddy.
Chat about possible fixes and troubleshoot together.

Breaking Down and Recreating Issues:
Get good at isolating and recreating problems

Create a simplified example of the issue.
Figure out exactly what leads to the coding hiccup.

Learning Through Code Exploration:
Take a peek at others' code for some learning

Jump into code review sessions for mutual learning.
Borrow some tricks from different ways people troubleshoot.

Keeping Up the Learning Momentum:
Stay in the loop with effective troubleshooting practices

Try out new techniques and tools for problem-solving.
Read up on real-world cases of tricky troubleshooting scenarios.

Keeping a Log of Problem-Solving Adventures:
Write down your journey in facing coding challenges

Note down the problems you face and how you tackle them.
Think about what you learn each time you troubleshoot.

Cheering for Problem-Solving Wins:
Give yourself a pat on the back for cracking the code

Celebrate when you find and fix bugs.
Share your success with the coding community.

Conclusion:
Mastery in the realm of problem-solving is an ongoing journey. By embracing effective strategies and welcoming challenges, you'll refine your troubleshooting skills and evolve into a more adept coder.

Happy Coding!👨🏻‍💻

Developing Your Skills as a Programmer

Maks Szymczak — Tue, 09 Jan 2024 13:16:23 +0000

Programming | Beginners | Productivity | Career
At times, we find ourselves stuck in our programming journey. That's when having people who push us in the right direction becomes invaluable. Recently, a my mentor shared a video that resonated with me: Watch the video here.

Here's what I took away from it:

Learn How to Learn
As programmers, continuous learning is a necessity. Having a personalized learning formula makes the process simpler and more effective. It's said that we remember:

10% of what we read
20% of what we hear
30% of what we see
50% of what we see and hear
70% of what we discuss with others
80% of what we personally experience
95% of what we teach others (Edgar Dale)

While the Feynman method is another approach, I'm still working on implementing it into my learning routine.

Why Learning is Crucial

Rapidly changing technologies
Code is a tool for your customer, solving problems
Adaptability – you need to learn fast to fill the gap
Independent learning – not everything is in documentation, practical experience is key
Productivity – efficiency in learning gives you more time for other activities
Your Motivation
Understanding what excites you and why you code is crucial. Whether it's for your career, building an app, or simply a hobby, having a clear motivation helps during challenging times.

Fundamentals Are Key

Using specific technologies to solve specific problems is emphasized:

Web-> HTML/CSS/JS, then learn backend
Mobile IOS-> Swift
Mobile Android -> Kotlin, Java
Mobile Android and IOS -> ReactNative, Flutter
Video games -> Unity (C#), GODOT (C#), Unreal (C++)
Machine Learning -> Python

While this is valid, flexibility is essential. Choose the right technology for your problem.

Avoiding Tutorial Overload
Set a limit on watching tutorials; use gathered knowledge to solve problems. Challenge yourself, build a portfolio, and let your code speak for itself.

Circle of Learning

Write code (don't aim for perfection initially)
Learn
Iterate
Improve
This process can be challenging, but avoid overthinking. Measure results and seek advice from experienced individuals.

Buddy/Mentor or Share Your Code

Sharing your code accelerates the learning process. Feedback from others, whether through peer review or mentorship, is invaluable. As the video suggests, hard work is essential, and now you know where to focus.

Feel free to adjust the content as needed!