I am small and live in Wuhan, do two years of new media, ready to use 6 months time to switch to the front end of the industry.

Lesson Objective for today

Yesterday, I learned object deconstruction based on search, and today IS ready to learn unpacking and boxing mentioned by a friend before, so today is a day for learning basic concepts of JS type conversion, come on, small and ！！！！

The content in today’s article refers to a retrieval article. I feel that the chapter structure of her article is very good, and it is also written in detail, so I will study it based on the article

Type conversion in js

Basic instructions

In JavaScript, most things are objects, from strings and arrays as core functions to browser apis built on top of JavaScript.

Today’s focus is on mandatory conversions between the six basic object data types, converting instances of other types of objects to specified data object types.

Today is mainly study the String, Number, Boolean, Object, the Date, the Array type of mutual transformation between ~ ~ ~ ~

Unpacking and packing

The operation of converting a base data type to the corresponding reference type is called boxing

// create an instance of String;
 
// call the specified method on the instance;
 
// (3) Destroy the instance;
var s1 = new String("some text"); var s2 = s1.substring(2); s1 = null;  s1/ /" s2// 'me text' sl// null Copy the code

The first time I printed s1, it was a “.

Converting a reference type to a primitive data type is called unboxing

To convert a reference type object to the corresponding value type object, this is done through valueOf() or toString() methods of the reference type. If it is a custom object, you can also customize its valueOf()/ toString () methods to unbox the object.

var objNum = new Number(123); 
var objStr = new String("123"); 

console.log( typeof objNum ); //object
console.log( typeof objStr ); //object
 console.log( typeof objNum.valueOf() ); //number console.log( typeof objStr.valueOf() ); //string console.log( typeof objNum.toString() ); // string console.log( typeof objStr.toString() ); // string Copy the code

Noun a dictionary

Explanations of variable nouns appear in this article

  var oo = new Object(a);  var oBool = new Boolean(true);
  var oNum = new Number(68);
  var oString = new String("hello world");
  var oArray = new Array("demo"."little"."you");
 var oDate = new Date(a);  var ooo = Object(oo);  var ooString = Object(oString);  var ooBool = Object(oBool);  var ooNum = Object(oNum);  var ooArray = Object(oArray);  var ooDate = Object(oDate);   var soo = String(oo);  var soString = String(oString);  var soBool = String(oBool);  var soNum = String(oNum);  var soArray = String(oArray);  var soDate = String(oDate);   var boo = Boolean(oo);  var boString = Boolean(oString);  var boBool = Boolean(oBool);  var boNum = Boolean(oNum);  var boArray = Boolean(oArray);  var boDate = Boolean(oDate);   var noo = Number(oo);  var noString = Number(oString);  var noBool = Number(oBool);  var noNum = Number(oNum);  var noArray = Number(oArray);  var noDate = Number(oDate);   var aoo = Array(oo);  var aoString = Array(oString);  var aoBool = Array(oBool);  var aoNum = Array(oNum);  var aoArray = Array(oArray);  var aoDate = Array(oDate);   var doo = Date(oo);  var doString = Date(oString);  var doBool = Date(oBool);  var doNum = Date(oNum);  var doArray = Date(oArray);  var doDate = Date(oDate);   function demoo(){} Copy the code

The variable name meaning For example,
objectName Name of the associated object type As the abovejsIn the codeObject.Boolean
varName The instantiated variable name of the associated object type As the abovejsIn the codeoo.oBool
param1,param2,param3,… ,paramN We need to pass in the values of the first to the NTH arguments As the abovejsIn the codetrue.68.hello world
functionName The name of the function Like abovedemoo

VarName Indicates the information before the conversion

Print the original relevant data

The original value

The instance name The original value Method of use
oo {} oo.constructor
oBool [Boolean: true] oBool.constructor
oNum [Number: 68] oNum.constructor
oString [String: ‘hello world’] oString.constructor
oArray [ ‘demo’, ‘little’, ‘you’ ] oArray.constructor
oDate Tue May 19 2020 22:35:18 oDate.constructor

constructor

The instance name constructs Method of use
oo [Function: Object] oo.constructor
oBool [Function: Boolean] oBool.constructor
oNum [Function: Number] oNum.constructor
oString [Function: String] oString.constructor
oArray [Function: Array] oArray.constructor
oDate [Function: Date] oDate.constructor

__proto__

The instance name The default value Method of use
oo {} oo.__proto__
oBool [Boolean: false] oBool.__proto__
oNumber [Number: 0] oNum.__proto__
oString [String: ”] oString.__proto__
oArray [] oArray.__proto__
oDate Date {} oDate.__proto__

Whether the instance Object’s prototype chain contains an Object’s prototype chain

Through varName instanceof Object, oo, oBool, oNum, oString, oArray and whether oDate contains the Object’s prototype chain are true.

Whether the instance object prototype chain contains the prototype chain of String

The instance name Attribute values Method of use
oo false oo instanceof String
oBool false oBool instanceof String
oNumber false oNum instanceof String
oString true oString instanceof String
oArray false oArray instanceof String
oDate false oDate instanceof String

Whether the instance object stereotype chain contains a Boolean stereotype chain

The instance name Attribute values Method of use
oo false oo instanceof Boolean
oBool true oBool instanceof Boolean
oNumber false oNum instanceof Boolean
oString false oString instanceof Boolean
oArray false oArray instanceof Boolean
oDate false oDate instanceof Boolean

Whether the instance object stereotype chain contains the stereotype chain of Number

The instance name Attribute values Method of use
oo false oo instanceof Number
oBool false oBool instanceof Number
oNumber true oNum instanceof Number
oString false oString instanceof Number
oArray false oArray instanceof Number
oDate false oDate instanceof Number

Whether the instance object prototype chain contains the Array prototype chain

The instance name Attribute values Method of use
oo false oo instanceof Array
oBool false oBool instanceof Array
oNumber false oNum instanceof Array
oString false oString instanceof Array
oArray true oArray instanceof Array
oDate false oDate instanceof Array

Whether the prototype chain of the instance object contains the prototype chain of Date

The instance name Attribute values Method of use
oo false oo instanceof Date
oBool false oBool instanceof Date
oNumber false oNum instanceof Date
oString false oString instanceof Date
oArray false oArray instanceof Date
oDate true oDate instanceof Date

Cast list

The method name explain Method of use
Object Convert objects of other types to objects of type Object Object(varName)
String Convert objects of other types to String objects String(varName)
Boolean Convert objects of other types to Boolean objects Boolean(varName)
Number Convert objects of other types to objects of type Number Number(varName)
Array Convert objects of other types to objects of Array type Array(varName)
Date Convert objects of other types to objects of type Date Date(varName)

Instanceof usage

grammar

object instanceof constructor
Copy the code

parameter

  • @param1 Object Indicates the object to be detected.
  • Param2 constructor Specifies a constructor

describe

The instanceof operator is used to test whether constructor. Prototype exists on the prototype chain of the parameter Object.

Matters needing attention

  • Note that the constructor passed to the method contains six data object type names, as well as the function method name, which is an error if passed, such as if passedvarNameAnd complainsExpecting a function in instanceof check, but got #<C>.
  • Basic data types (NULL, undefined, String, Number, Boolean), failednewKeyword orCast castingImplicitly declared variables, defaultPrototype chainIs undefined
  • throughnewKeyword instantiationfunctionNameWhen usinginstanceofCheck for inclusionobjectThe prototype chain goes backtrue.
  • objectName instanceof functionNameThe value offalseThat does not representfunctionName instanceof objectNameValues arefalse
  • When two objects or functions that have a parent-child relationship instantiate a child object or method without modifying the prototype chain of the parent and childinstanceofReturns when detecting a child or parent object or methodtrue.
  • Notice that if the expressionvarName instanceof functionNamereturntrue, does not mean that the expression will always be returnedtrue.
  • becausefunctionName.prototypeThe value of the property may change, and the changed value may not existvarNameIn which case the value of the original expression becomesfalse.
  • In another case, the value of the original expression is changed, that is, the object is changedvarNamethePrototype chainThe situation, though, in the presentES specificationIn, we can only read objectsThe prototypeYou can’t change it, but by means of non-standard__proto__Magic properties can be implemented, such as executionvarName.__proto__ = {}After that,varName instanceof functionNameIt will returnfalse.

There are some twists in this paragraph ~~~~~~

Summary of today’s lesson


Today the mood

Today is mainly to learn the basic concept of mutual transformation of types, but also the basic understanding of the type of boxing and unboxing, I hope tomorrow when the actual learning, can deepen the understanding of ~~~, this hope to learn more tomorrow ~~~~


This article is formatted using MDNICE