Introduction: I have been working on the Vue3 project of Shangpinhui. It is actually not difficult to do the project with the accumulation of the previous foundation. However, the network is very poor during my recent business trip and I can't do it. In order to make use of my spare time during the business trip, I just decided to Let’s practice the basics again. When I was learning python, I thoroughly studied every case in the book, so I was able to use pyqt or find bugs in the async library with ease. Of course, doing projects will definitely stimulate interest than learning the basics. The effect is better, but it cannot be said that learning the basics is useless. This time I chose the Rhinoceros book "JavaScript Definitive Guide", compared with the red book "JavaScript Advanced Programming" (I have read the entire book) , Rhinoceros Book is slightly more difficult, but the version is slightly newer, so the operability is slightly stronger, but it is also suitable for programmers who are not so novices to learn and practice (such as me). If it is used as a reference book, the Red Book will be more All in all. After finishing this, I will get the basics of html and css to practice my skills and make use of the time without internet. I am confident that I can become a competent front-end programmer. It is easy to become a qualified front-end engineer by self-study from scratch (I study by myself in my spare time without pressure, so my learning progress is slow. If I were unemployed and started from scratch at home, I would definitely make progress in learning. It will be faster, but the process will definitely be more painful), and it is more difficult to record your journey along the way. So I want to record my self-study process for reference by beginners. After all, when I actually enter the industry, I may be so busy that I forget my original intention. Oh, by the way, I have interviewed with several companies in Hangzhou and Fuzhou before, and I roughly know the current requirements of the front-end industry and my own shortcomings. After interviewing several companies, I will share my interview questions and interview experience. Of course Because I have an iron job, I'm not in a hurry right now, so I won't talk too much and just take notes.
Chapter One:
1.1 and 1.2: JavaScript is the most popular programming language because it is a weakly typed language (the current typescript is used to correct this). ES6 is the biggest change in previous version changes, adding class and module syntax. For backward compatibility, some features of earlier versions (before ES6) are retained, but using the use strict directive or using new language features will trigger strict mode. You can use browser developer tools or nodejs environment, or write html and open it in the browser to use js. In the latter two, console.log syntax is often used to print the results.
1.3: Let and const have been used throughout this book, so we can boldly abandon the previous var. Here are some data types (numeric values, strings, Boolean values, null, undefined, objects, arrays), but I don’t know if they are all complete. An object is a collection of key-value pairs, similar to a dictionary in python. If you encounter something you don’t understand, practice more and write more. The key here can omit "", but it is actually a string. You can use book.topic or book["topic"] to access the attribute. When the attribute name is a variable or number It can only be used in the form of book[], and the value of the object must be one of the basic types or a variable pointing to them.
There is also an ES2020 syntax mentioned here? It is somewhat similar to the non-greedy operator in regular expressions. As you can see, it is different from the ternary operator (if the former attribute is not available, undefine will be returned and the latter one will not be used).
Array syntax is no different from other languages. The first index is 0, and data structures can also be nested.
The first two uses of functions, function myfunction(a){} and let a=function(a){};a(); are no different from other languages.
There is also a very important arrow function unique to js, which is new after ES6. This is very important. Many interviews will ask about the new features of ES6. () can be omitted when the arrow function has only one parameter, and {} and return can be omitted when there is only one statement.
Data in JS has built-in methods whether it is literals or objects. Congruent === can be used when using basic types such as numeric and bool values, but even two reference objects with the same content will not ===. Here we also use the syntax of a class to write a Point class. The essence of the implementation of the js class is the prototype chain, although classes appeared after es6 and its writing method is very similar to other languages.
1.4 This is a complete case program. Beginners can skip it directly. Those with basic knowledge can run it for review. It uses many APIs and even has appointments. In the current situation where framework training courses are rampant, learning the basics is still very necessary. of. When you see some unfamiliar syntax, such as..., you can write your own code and run it to deepen your impression.
This program has a certain complexity, and you can look back at it after completing the subsequent courses for better results.
2.1 Some common sense about js. js syntax is case-sensitive, ignores spaces between symbols, recognizes tab characters, ASCII control characters and Unicode intervals as spaces, and recognizes line feed characters, carriage returns, and /line feed sequences as line terminators. At first I thought this was a feature of vscode. After testing, you can see that it is indeed a js syntax feature. If the semantics are coherent, you can write it directly in multiple lines, otherwise you have to add it; of course, you can also write multiple short sentences in a single line (less commonly used in practice). After understanding these characteristics, you can be targeted when writing programs later.
2.2 Two comment methods // and /* */
2.5 Unicode can be used as an identifier. The identifier is the variable name. The popular understanding of Unicode is Chinese and languages other than English.
2.5.1 In order to use unicode in the old system, the ascii escape sequence of unicode will be used. This situation is actually relatively rare now, but you can still understand it and know what to do when you encounter the form \u in the future. Just look it up.
2.5.2 In translation, if you use Chinese as a variable name, you must consider that the same Chinese name is interpreted as two variables. This is due to the different encoding methods of unicode to ascii. This conversion process needs to be unified by yourself. , but generally this situation is relatively rare.
2.6 This is the same as the js parsing rule mentioned before. It will parse as many things as possible into a sentence. Based on this rule, anything starting with (,[,/,+,- may be regarded as the continuation of the previous line. In practice, ( and [ are used more often, especially ( () often appears as an immediate execution function iifc. According to the general Programming method (single sentence line break), if you do not use;, you only need to pay attention to ( and [.