How to quickly learn to read CAD drawings, how to quickly learn to edit videos

This article mainly introduces how to quickly learn to type 26 keys without pinyin. It has certain reference value and friends in need can refer to it. I hope you will gain a lot after reading this article. Let the editor take you to understand it together.

【Tutorial】Learn JavaScript quickly

• Remark
• 1. Introduction to JavaScript
• 2. Grammar Basics
• • 1. Combination method
  • 2. Comments
  • 3.Data type
  • 4.Variables
  • 5.Operators
  • 6. Process control
• 3. Basic objects
• • 1. Function object (Function)
  • 2. Array object (Array)
  • 5. Regular object (RegExp)
  • 4. Global objects
  • 5. Other objects
• 4. Browser Object Model (BOM)
• • 1. History object (History)
  • 2. Address bar object (Location)
  • 3.Window object (Window)
  • 4. Browser object (Navigator)
  • 5. Monitor screen object (Screen)
• 5. Document Object Model (DOM)
• • 1. Document object (Document)
  • 2. Element object (Element)
  • 3. Node object (Node)
  • 4.Events

Remarks

2021/6/10 Thursday
Finally finished writing html and css, it’s JavaScript’s turn

1. Introduction to JavaScript

JavaScript is a client-side scripting language that has almost nothing to do with JAVA. It runs in the browser and can enhance the interaction between users and HTML pages and control the elements of HTML pages to achieve dynamic effects. When we want to implement some program functions on the client, we can use JavaScriptGPT rewriting. Due to the historical development process, many client-side script languages have appeared. In order to maintain market order, the ECMA organization has formulated ECMAScript as the standard for this type of language. JavaScript is a language that maintains some of its own characteristics while complying with these standards. door language.

2. Grammar Basics

1. Combination method

There are two ways to combine JavaScript and HTML, internal connection and external connection. No matter which method is introduced, the execution order of the JS code is affected by the introduction position.
Internal connection:
The internal connection method is implemented by writing js code directly in the <> tag.

<>JS code</>

External connections:
The external connection method is implemented by introducing external js files through the src attribute of the <> tag.

< src="js file"></>

2. Comments

Like most languages, // is a single-line comment and /**/ is a multi-line comment.

3.Data type

JS is a weakly typed programming language. Data types are divided into primitive data types and reference data types. The primitive data types are:

1. number: There are three types of numbers, integers, decimals and NaN (numbers that are not numbers)
2. string: characters and strings are both strings
3. boolean: true and false
4. null: empty object
5. undefined: a variable with no initial value

4. Variables

To apply for variables in js, just use var plus the variable name.

var variable name = value;

When we want to get the data type of a variable, we can use the typeof() function

5.Operator

Basically the same as other languages, it has addition (+), subtraction (-), multiplication (*), division (/), remainder (%), positive (+) negative (-) sign, assignment (=), and auto-increment (+ + ) decrements (–), compares (>, >=, <, <=), equals (==), all equals (===), AND ( & amp; & amp;) or (||) NOT ( !), ternary operator (? : )
Note: Type conversion will occur when comparison operators compare different types (when comparing numbers and strings, the string will be converted into a number, and a string that cannot be converted normally will become NaN)

6. Process control

The flow control statements of js are not much different from common languages such as c language and java, so I won’t go into details. There are a total of branch if, else, switch, loop while, dowhile, and for statements.

3. Basic objects

1. Function object (Function)

Create:

• var function name = new Function(parameter list, function body);
  This method is not commonly used, and it is not easy to use. We generally do not use it. We only need to know it.

  //Pop up the function of the sum of the two variables a and b.
  var fun = new Function("a","b","alert(a + b)");
  

• function function name (formal parameter list){
  function body;
  }

  //Pop up the function of the sum of two variables a and b
  function sum(a,b){
  alert(a + b);
  }
  

• var function name = new Function (formal parameter list){
  function body;
  }

  //Pop up the function of the sum of two variables a and b
  var sum = new Function(a,b){
  alert(a + b);
  }
  

Properties:
Functions in JS have attributes. For example, the length attribute is the number of formal parameters.
Features:
In JS, if you define functions with the same name, the function defined later will overwrite the function defined first without reporting an error.
In JS, the number of formal parameters and the number of actual parameters do not need to correspond one to one. The formal parameters will obtain the values of the actual parameters in turn, and there is an array arguments inside the function, and arguments has an attribute. length is the length of the array, so we can also get the values of all actual parameters in this way.

2. Array object (Array)

Create:

• var array name = new Array(element list);
  Example: var arr = new Array(1,2,3);
• var array name = new Array(number of elements);
  Example: var arr = new Array(3);
• var array name = [elements list];
  Example: var arr = [1,2,3];
  Properties:
  Arrays have a length attribute, which represents the length of the array.
  Method:
  In js, arrays have many methods, the following ones will be used

Method name	Function
concat	Join two arrays and return the result
join	Join the arrays into a string according to the format
reverse	Invert array elements
posh	Add elements to the end of the array
pop	Delete and return the last element
shift	Delete and return the first element
sort	Sort

Features:
In js, the element types in the same array can be different.
The length of the array in js is variable. When we access an out-of-bounds element (in c or java), js will automatically expand.

5. Regular object (RegExp)

Regular expressions are expressions used to define string rules, and js provides us with regular expression pairs.
Briefly introduce the rules of regular expressions

Symbol	Function	Explanation
[]	Single character	Character a [a], character a or b [ab], any one of characters a to z [a-z]
\d	A single number	is the same as [0-9]
\w	Any single character	is the same as [a-zA-Z0-9]
^ $	The start and end characters	have no actual meaning to indicate the beginning and end of the expression

Having these symbols is not enough. We also need to control the number of symbols. Regular expressions also provide us with quantifiers.

Symbol	Function
?	Does not appear or appears once
+	Appears once or multiple times
*	Does not appear or appears any number of times
{m,n}	The quantity is greater than or equal to m and less than or equal to n (m or n may not be written , indicating the most or least)

For example:
If you want to express that there is a in a string, you can write [a] +. If you want to match a string with a length of 8-10, you can write /w{8,10}.

There are two ways to create regular expression objects in js

• var variable name = new RegExp(“regular expression”);
• var variable name = /regular expression/;
  We generally use the test method to determine whether a string conforms to the regular rules. It returns true instead of false.

4. Global object

js provides us with some functions that can be called anywhere, similar to how c language uses functions

5. Other objects

In addition, js also provides us with common objects such as Number, String, Boolean, Date, Math, etc. and provides us with many methods, most of which are similar to the functions provided in java. I will not go into details here. You can check it yourself at any time.

4. Browser Object Model (BOM)

The browser object model encapsulates various components of the browser into objects to facilitate code operations.

1. History object (History)

The history object contains records of URLs visited in the current window and is part of the window object.
You can directly use history. to call its properties and methods
The attributes and methods of the history record object are very simple. There is only one attribute length and three methods back(), forward(), go(). The length attribute is the history of the current window. The number of records, back goes back, forward goes forward, go goes forward with positive numbers and goes back with negative numbers.

2. Address bar object (Location)

The address bar object contains the current url information and is part of the window object
You can directly use location. to call its properties and methods, which are mainly used to obtain url information and load html documents (such as refreshing)

3.Window object (Window)

The window object window does not need to be created and can be used directly. The methods of the window object can be used directly without window.
The main functions of the window object are to create pop-up windows (alert, prompt, confirm), open and close windows (open, close), and timer methods (TimeOut, Interval)
The window object can be used to obtain other bom and dom objects

window.history
window.location
window.navigator
window.screen
window.documnet

4. Browser object (Navigator)

The browser object can obtain the browser name, version, language, operating system information, etc.
You can check the relevant manual when you need to use it, but I won’t go into details here.

5. Monitor screen object (Screen)

The display object can obtain the width, height, resolution, refresh rate and other information of the display
You can check the relevant manual when you need to use it, but I won’t go into details here.

5. Document Object Model (DOM)

DOM is an object used to control the content of html documents, and html will encapsulate all tags into Element objects, so the content of html documents can be modified in some ways.
There are three types of Dom objects: core Dom objects, htmlDom objects and xmlDom objects.
Core Dom objects include Document objects, Element objects, Attribute objects, Text objects, Comment objects, and Node objects.

1. Document Object (Document)

The document object is mainly used to obtain element objects and create other Dom objects
Creating other Dom objects is achieved through the method document.createXXX() (Attribute, Text, Comment, Node). You can create a corresponding Dom object in the html document

2. Element object (Element)

For Element objects, we generally have two operations, setting the properties of the Element object and modifying the content of the Element object.
The Document object provides us with a method to obtain the Element object. The most common method is to obtain it through the id value.

var element = document.getElementById("id value");

The obtained element object can modify the attribute value of the HTML document element

element.property name = value;

Create a non-existing property or delete a property

element.addAttribute();
element.removeAttribute();

You can also modify the content of html document elements (this method of operation belongs to htmlDom)

element.innerHTML = "value";

There are many similar functions for modifying properties. You can check the relevant manuals to obtain them.

3. Node object (Node)

Each HTML document can be regarded as a Dom tree, and each object has its corresponding level.

The node object is the parent object of other Dom objects. This concept is somewhat similar to the object object in Java. All Dom objects are Node objects, which provide a unified set of operations that can be used to add, delete, and modify nodes.

4.Event

Events are specific codes that are executed when certain specific operations are triggered on an HTML element. There are two ways to specify events: directly specified in the attributes of the HTML document element, and specified through the Dom object in the JavaScript code.

• Write directly in html attributes

<img src="img/1.jpg" onclick="alert(1);">
or call function
<img src="img/1.jpg" onclick="func();">

• Bind events through element objects

var elemenet = document.gerElementById("id");
element.onclick = alert(1);
or call function
element.onclick = func();

Function	Function
encodeURI()	URI encoding the string
dncodeURI()	URI decoding the string
encodeURIComponent()	URI-encode the string (more characters will be encoded)
dncodeURIComponent()	URI decode the string (used for matching)
isNaN()	To determine whether a variable is NaN (NaN is different from each other, you need to use this method to judge)
eval()	Execute the string as js code