Note: This article is chapter 5 of the relearning JavaScript advanced Programming series. About “relearning JavaScript advanced programming” is a review of the basics of JS learning.

A value (object) of a reference type is an instance of the reference type. In ES, a reference type is a data structure used to organize data and functionality together, also known as a class. Reference types are sometimes called object definitions because they describe the properties and methods of a class of objects.

An object is an instance of a particular reference type. New objects are created using the new operator and a constructor. The constructor is itself a function, but it is defined for the purpose of creating a new object, as follows:

var person = new Object();
Copy the code

The above line creates a new instance of the Object reference type, and then stores it in the variable Person. The constructor used is Object, which defines only the default properties and methods for the new Object.

1. Object type

There are two ways to create an object instance. The first uses the new operator followed by the object function, and the second uses the representation of an object literal, which is a shorthand for the definition of an object.

Person.name = 'nice' person.age = 20Copy the code

We can access properties of objects in two ways

p.name = nice
p['name'] = nice
Copy the code

2. Array type

Each item of the array in ES can hold any type of data. That is, you can use the first position of the array to hold strings, the second position to hold values, and the third position to hold objects. In addition, the size of the array is dynamically adjustable and can grow automatically as data is added to accommodate new data.

There are two ways to create arrays

  1. Use the Array constructor
Var c = new Array() var b = new Array(20)'a'.'b'// An array of elements A and bCopy the code
  1. Use the array literal notation
Var a = [1,2,3] var n = []'a'.'c'] // An array of two stringsCopy the code
  1. Reads the value of the array
A [0] // 1 is the index of the array. Return the value of the array a[4] // If the value exceeds the length of the array, it is incremented to the length of the index n[2] // [undefined, undefined]Copy the code

Note: The length of the array is not arbitrary. You can set this property to add deletions to the array. The index of the last item in the array is always Length-1, so the position of the next item is length. In addition, the array can contain up to 4294967295 items,

2.1 Conversion method

In the previous description, all objects have toLocaleString(), toString(), and value() methods, where the toString() and valueOf() methods that call arrays return the same value, That is, the string form of each value in the array is concatenated into a comma-separated string. As follows:

var a = ['a', 'b', 'c'];
a.toString()    // a,b,c
a.valueOf()     // a,b,c
Copy the code

The array inherited toLocaleString(), toString(), and valueOf methods all return an array item as a comma-separated string by default. If the ‘join’ method is used, the string can be constructed using the specified delimiter. It takes a single argument, used as a delimiter string, and returns a string containing all the array items. The following

var c = ['a', 'b', 'c']
c.join(',')     // a,b,c
c.join('/')     // a/b/c
Copy the code

Note: if the valueOf an item in the array is null or undefined, the value is null in the string returned by join(), toLocaleString(), toString(), valueOf()

2.2 the stack method

ES also provides a way for arrays to behave like other data structures, that is, arrays can behave like stacks, limiting the number of data structures that can be inserted and deleted. The stack is last in, first out, and the latest item is deleted first. The insertion and removal of items in the stack occur only at the top of the stack. ES provides pop() and push() methods for arrays

Let a = [1,2] a.pan (3) // [1,2,3] pop() removes the last item of the array a.pan () // [1,2]Copy the code

2.3 Queue Method

Stack data structures follow the fifO, whereas queue data structures have fifO access rules. Add items to the end of the queue and remove items from the front of the list. Since push() is a method that adds items to the end of an array, the Shift () method is needed to get the first item of the array. There is also the unshift() method, which is added at the top of the array.

Let a = [1, 2] a.s hift () / / 1 a = > [2] a.u nshift (3) / / a = > [3, 2]Copy the code

2.4 Reordering method

Arrays can be sorted using reverse() and sort(), where reverse() reverses the array. By default, sort() sorts arrays in ascending order, but it can be controlled by conditions.

Let a = [1, 2, 3, 4] a.r everse () / / a = >,3,2,1 [4] let a =,3,5,2,7 [1] a.s ort () / / a = >,2,3,5,7 [1]Copy the code

2.5 Operation Methods

ES provides many methods for arrays, and concat() creates a new array based on the current array.

Rules:

  1. By default, a copy of the current array is created, and the arguments received are appended to the end of the copy, returning the new array
  2. With no arguments passed, the current array is copied and returned
  3. One or more arrays are passed, and each entry of those arrays is added to the result array. If the value passed is not an array, the value is appended to the end of the array

Slice () creates a new array based on one or more items in the current array. Takes one or two arguments that return the start and end positions of the array. If there is only one argument, all values from the start to the end of the array are returned. It doesn’t affect the original array. In the case of two arguments, it returns the value between the first and the last value.

Let a = [1,2,3,4,5,6,7,8] a.ice (2,4) // [3, 4]Copy the code

Splice () deletes, inserts, and replaces the values of an array.

  1. Delete You can delete any number of items by specifying 2 arguments, the first location to delete and the number of items to delete. Splice (0,2) deletes the first two pieces of the array
  2. Insert You can insert any number of items into a specified location with three arguments. Starting position, 0, the item to insert. Splice (2,0,’a’) inserts ‘a’ from the second item in the array
  3. Substitution can insert any number of items into a specified location and delete any number of items. You need three parameters: the starting position, the number of items to delete, and any number of items to insert. The number of inserts need not equal the number of deleted items.

3. Date type

Var now = new Date() can be used to retrieve specific Date and time objects via date.parse () and date.utc ()

Date.parse() takes a string argument representing a Date. Date.utc () returns the number of milliseconds representing the DateCopy the code

3.1 Methods of inheritance

Like the other types, the Date type overrides the toLocaleString(), toString(), and valueOf() methods. ToLocalString () returns different values in different browsers and time zones.

3.2 Format of date

The Date type provides the following methods for formatting a Date as a string:

  • ToDateString () displays the day of the week, month, day, and year in an implementation-specific format
  • ToTimeString () displays hours, minutes, seconds, and time zone in an implementation-specific format
  • ToLocaleDateString () displays the day of the week, month, day, and year in locale-specific format
  • ToLocaleTimeString () displays hours, minutes, and seconds in an implementation-specific format
  • ToUTCString () the full UTC time in an implementation-specific format

4. The RegExp type

Regular expressions are supported through the RegExp type

G stands for global pattern, that is, the pattern is applied to all strings and not stopped immediately on the first match found

I represents case insensitive mode, that is, the case of the mode and the string is ignored when determining a match

M stands for multi-line mode, that is, when the end of a line of text is reached, the search continues to see if there is an item matching the pattern in the next line

5. The Function type

Each Function is an instance of the Function type and has attributes and methods like any other reference type. Since a function is an object, a function name is actually a pointer to a function object and is not bound to a function, which is usually defined using function declaration syntax. As follows:

Var s = function(a,b){return a + b}Copy the code

5.1 No Overloading

If you name two identical functions, the latter will override the former

function a(b) {
    retrun b + 100
}

function a(b){
    return b + 200
}

a(100)  // 300
Copy the code

5.2 Function expressions and function declarations

When loading data in the execution environment, function expressions and function declarations are read by the parser first and made available before any code is executed, whereas function expressions are not actually executed until the parser reaches their line of code.

5.3 Functions as values

Because function names in ES are themselves variables, functions can also be used as values, that is, not only can one function be passed to another as an argument, but one function can be returned as the result of another function.

5.4 Function internal Attributes

Inside the function, there are two special objects: Arguments and this. Arguments is an arraylike object that holds all arguments to the function passed in. Although arguments’ main purpose is to hold function arguments, this object also has a property called Callee that is a pointer to the function that holds the arguments object.

This refers to the object on which the function operates, or to the scope in which the function executes, if global this refers to window

Note: The name of a function is simply a variable containing a pointer.

5.4 Function attributes and methods

ES functions are objects, so functions also have properties and methods, each containing two properties: Length and Prototype. Where length represents the number of named arguments that the function wishes to receive.

Prototype is where all of their instance methods are actually stored; in other words, methods like toString() and valueOf() are actually stored under prototype. It is simply accessed through instances of the respective objects.

Each function contains two non-inherited methods: apply() and call(). The purpose of both methods is to call a function in a particular scope and essentially set the value of this object within the function.

Apply () takes two arguments: the scope of the function it runs and an array of arguments. The second argument can be an instance of Array or arguments object. Call () and apply() do the same thing, except they take arguments differently. The first argument is the same as apply(), and the second argument is a list of arguments rather than an array.Copy the code

6. Basic packaging types

To facilitate manipulation of primitive type values, ES also provides three special reference types: Boolean, Number, and String.

6.1 a Boolean type

A Boolean type is a reference type corresponding to a Boolean value. To create a Boolean object, call the Boolean constructor as follows and pass in a true or false value.

let a = new Boolean(true)
Copy the code

Note: There are two other differences between booleans for primitive types and reference types. First, the Typeof operator returns “Boolean” for primitive types and “object” for reference types. Second, because Boolean objects are instances of Boolean types, testing Boolean objects with the instanceof operator returns true, while testing Boolean values of primitive types returns false.

6.2 Number type

Number is the reference type corresponding to the numeric value. To create a Number object, you pass the corresponding value into it by calling the Number constructor. As follows:

let n = new Number(10)
Copy the code

Number provides the toFixed() method to format as a string

When using the Typeof operator to test primitive type values, number is always returned, while when testing a number object, Object is returned. The Number object is an instance of type Number. Values of primitive types do not.

6.3 type String

String is the object wrapper type for a String, as follows:

let s = new String('zifuchuan')
Copy the code
  1. Characters of the method
CharAt () // Takes one argument, based on the character position of 0. Returns the character at a given position as a single string.let s = 'abc'A.charcodeat (1) // a charCodeAt() // also takes an argument, but returns the encoding of the string a.charcodeat () // 97Copy the code
  1. String manipulation methods
Concat () // accepts any string and concatenates the string slice() // intercepts the string from the first argument to the second argument, or to the last bit if there is no second argument substring() // ditto as above substr() // ditto as aboveCopy the code
  1. Position method of a string
IndexOf() // Both search for the given substring lastIndexOf() from the first stringCopy the code
  1. String case conversion
ToLocaleUpperCase () // Uppercase toUpperCase() // toLocaleLowerCase() // uppercase toLocaleLowerCase() // lowercase toLowerCase() // same as aboveCopy the code
  1. Pattern matching method for strings
Match () // takes one argument, either a regular expression or a RegExp object.Copy the code
  1. LocaleCompare () method
Comparing two strings returns the following: - If the string should precede the string arguments in the alphabet, it returns a negative number - if the string is equal to the string arguments, it returns 0, - if the string is alphabetically after the string arguments, it returns a positive number.Copy the code

7. Built-in objects

Objects that do not depend on the host environment and exist before the ES program executes. That is, you don’t have to explicitly instantiate built-in objects.

7.1 the Global object

Properties and methods that do not belong to any other object are ultimately its properties and methods. There are no Global variables or functions. All properties and functions defined in the Global scope are properties of the Global object.

7.2 Math object

There is a common place in ES to hold mathematical formulas and information, the Math object.

8. To summarize

  • Reference types are similar to classes in traditional object-oriented programming, but their implementation is different
  • Object is a base type from which all other types inherit their basic behavior.
  • The Array type is an ordered list of values and provides the ability to manipulate and convert those values
  • The Date type provides information about the Date and time, including the current Date and time, and related computing capabilities
  • The RegExp type is an interface of ES support for regular expressions, providing basic and some advanced regular expression functionality.
  • Functions are actually instances of the Function type, so functions are also objects, which is what makes Javascript special. Since functions are objects, all functions also have methods.
  • Each wrapper type maps to a base type of the same name
  • When a primitive type value is accessed in read mode, an object of the corresponding primitive wrapper type is created to facilitate data manipulation.
  • The newly created wrapper type is destroyed as soon as the statement that operates on the base type value completes execution
  • There are already two built-in objects in scope, Global and Math, before any code executes.

Welcome to pay attention to the public account [Xiaoyao students]

Re-learn js series

Relearn JS JavaScript introduction

Relearn JS to use JavaScript in HTML

Data types => Data types

Relearn the basic JavaScript concepts of JS (middle) => operator

Relearn the basic JavaScript concepts of JS (part 2) => operator

Relearn JavaScript variables, scope, and memory issues in JS

ES6 Introduction series

ES6 Introduction to let and cont

ES6 introduction to variable deconstruction assignment

ES6 starter string extension

ES6 – An extension to get started with re

ES6 introduction to numerical extension

Extension of ES6 introductory functions

ES6 introduction to the array extension

Extensions to ES6 starter objects

ES6 Symbol for beginners

Git tutorial

Front-end Git basics tutorial