Skip to content

Translate to FR: TypeScript for new programmers #148

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Apr 29, 2022

Conversation

mk360
Copy link
Contributor

@mk360 mk360 commented Apr 24, 2022

No description provided.

@github-actions
Copy link
Contributor

Thanks for the PR!

This section of the codebase is owned by @ManuSquall and @Ascor8522 - if they write a comment saying "LGTM" then it will be merged.

@github-actions github-actions bot added translation fr French language translations labels Apr 24, 2022
@github-actions
Copy link
Contributor

github-actions bot commented Apr 24, 2022

Translation of TS for the New Programmer.md

title: TypeScript for new programmers
short: TS for new programmers
layout: docs
permalink: /fr/docs/handbook/typescript-from-scratch.html

oneline: Learn TypeScript from scratch

Congratulations, you chose TypeScript as your first language — already a good decision!

You may have already heard that TypeScript is a "variant" of JavaScript.
The relationship between the two is unique among existing programming languages, and studying this relationship will allow you to understand what TypeScript adds to JavaScript.

A Brief History of JavaScript

JavaScript (also known as ECMAScript) was originally a simple scripting language for browsers.
When it was invented, it was used for small snippets of code in a web page — going beyond a dozen lines was unusual.
As a result, browsers executed JS code quite slowly.
However, the popularity of JavaScript will grow over time, and web developers have begun to use it to create interactive experiences.

Web browser developers responded to this growth in frequency of use by optimizing runtime environments (dynamic compilation) and expanding the scope of what was possible with JS (by adding APIs). This contributed to an even more widespread use among web developers.
A modern website, these days, contains hundreds of thousands of lines of code. This is in line with how the web has grown, from a simple set of static pages, to a platform of rich applications for everything and everything.

In addition, JS has become popular enough to be used outside of browsers, as Node.js has marked the implementation of JS in a server-side environment.
This ability to run anywhere has made language a popular choice for cross-platform application development.
There are many developers whose technical stack consists only of JavaScript!

To summarize, this language was originally created to meet simple needs, and then evolved to support the execution of millions of rows.
Each language has its own weird and surprise points, the JS being no exception due to its beginnings:

  • The equality operator (==) Converts his arguments, leading to bizarre behavior:

    if ("" == 0) {
      // C'est vrai, mais pourquoi ?
    }
    if (1 < x < 3) {
      // C'est vrai peu importe la valeur de x !
    }
  • JavaScript allows access to non-existent properties:

    const obj = { width: 10, height: 15 };
    const area = obj.width * obj.heigth;
    // Bonne chance pour savoir pourquoi "area" est égale à NaN

Most languages would throw an error in these situations. Some do it at compilation — before anything is executed.
This absence of errors and its unpleasant surprises are manageable for small programs, but much less at the scale of a large application.

TypeScript: a static type checker

We were saying that some languages would prohibit the execution of erroneous code.
Detecting errors in the code without launching it is called the static verification.
The distinction between what is an error and what is not, starting from the values we work with, is called static type checking.

TypeScript checks for errors in a program before execution, and does this based on the value types, it is a static verifier.
For example, the above example had an error because of the type d'obj :

// @errors: 2551
const obj = { width: 10, height: 15 };
const area = obj.width * obj.heigth;

A typical JavaScript overlay

What does JavaScript have to do with TypeScript?

Syntax

TypeScript is a Wrapper JavaScript: a legal JS syntax is therefore a legal TS syntax.
Syntax defines how one writes a program.
For example, this code has an error of syntax because a missing ) :

// @errors: 1005
let a = (4

TypeScript does not necessarily consider JavaScript code to be invalid.
This means that you can take functional JavaScript code and put it in a TypeScript file without worrying about how exactly it is written.

Types

However, TypeScript is an overlay Typed. This means that TS adds rules governing how different types of values can be used.
The error about obj.heigth is not a mistake of syntax : it is an error where we used some kind of value (a type) incorrectly.

Another example is this JavaScript code that you can launch in your browser. He goes display a value:

console.log(4 / []);

This program - whose syntax is correct - displays Infinity.
But TypeScript considers that dividing a number by an array does not make sense, and will launch an error:

// @errors: 2363
console.log(4 / []);

You may want to Oh, really divide a number by an array, maybe just to see the result, but most of the time you've made a mistake.
The TS type checker is designed to accept valid programs, while reporting as many common errors as possible.
(We'll learn various settings later to control how strict you want TS to be with your code.)

When migrating JavaScript code to a TypeScript file, you may see type errors depending on the way it was written.
There may be real problems with your code, just as TypeScript may be too strict.
Through this guide, we will show how to add TypeScript syntax to eliminate these errors.

Runtime behavior

TypeScript is also a language that preserves the runtime behavior of JavaScript.
For example, dividing by 0 product Infinity instead of throwing an error.
TypeScript, as a matter of principle, does not change never JS code behavior.

This means that if you move code from JavaScript to TypeScript, it is guaranteed to run in the same way, even if TS thinks it has type-related errors.

Maintaining runtime behavior is one of the fundamental principles of TypeScript because it means that you can easily switch between the two languages without worrying about subtle differences that would prevent your program from launching.

Deleting types

Roughly speaking, once the TypeScript compiler finishes checking the code, it Clears the types to leave the resulting code.
This means that at the end of the compilation process, the JS code does not retain any type information.

It also means that TypeScript, based on the types present in the code, never alters the behavior of the program.

To summarize, even though you may have type errors during compilation, the type system does not affect how your program runs.

Finally, TypeScript does not provide any additional libraries.
Your programs will use the same standard or external libraries as your JS programs, so there is no additional framework to learn at the TS level.

Interestingly, it is possible to specify which version of JavaScript TypeScript should target when compiling. This affects the final code, which may or may not contain polyfills (code that redefines existing features in one version of JavaScript but absent in another).

Learn JavaScript and TypeScript

An often asked question is "Do I have to learn TypeScript or JavaScript", to which it is answered that it is not possible to learn TS without learning JS.

TypeScript has the same syntax, and behaves the same way as JavaScript, so you'll be able to use everything you learn with JavaScript, in TypeScript.

There are many, A lot resources available to learn JavaScript. These resources should not be ignored if you want to learn TypeScript. For example, there are about 20 times more StackOverflow questions tagged javascript that typescript, but all questions javascript also apply to TypeScript.

If you're looking for something like "how to sort an array into TypeScript," remember: TypeScript is JavaScript with a compile type checker. The way you sort an array in JavaScript is the same as in TypeScript.
If you find a resource that uses TypeScript, it's not worse, but don't think you need TS-specific answers for everyday JS tasks.

Timeline

It was a brief summary of the syntaxes and tools used in the everyday TypeScript. From there, you can:

Generated by 🚫 dangerJS against 2d84aab

Copy link
Contributor

@ManuSquall ManuSquall left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the PR and the translation 🥳🥳🥳 j
Just highlited some typos to fix

@ghost
Copy link

ghost commented Apr 29, 2022

CLA assistant check
All CLA requirements met.

Copy link
Contributor

@ManuSquall ManuSquall left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good

@ManuSquall
Copy link
Contributor

LGTM

@github-actions github-actions bot merged commit 452986c into microsoft:main Apr 29, 2022
@github-actions
Copy link
Contributor

Merging because @ManuSquall is a code-owner of all the changes - thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
fr French language translations translation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants