4/9/2017 JavaScript: Operator new
HTMLCSSJavaScriptDOMSVG
JavaScript:Operatornew
[Link].Lastupdated:20170409.
Thekeywordnewisaoperator.
Thisoperatorisusedtocreatenewobjects,togetherwithafunction,inthissyntax:
newfunction_name();
JavaScript
//exampleofcreatingaobjectwithuserdefinedconstructor
//defineafunction,noreturnstatement
functionFF(){
this.b=4;//addingaproperty
}
//createanewobject
varx=newFF();
[Link](x);//{b:4}
Functionsdesignedtobeusedwithnewarecalledconstructor,andbyconventionthefirstletterofthefunctionname
iscapitalized.
seeJavaScript:What'sConstructor?
WhatDoesnewDoExactly?
Here'[Link]'ssaywehavenewF().
[Link]"prototype"seeJavaScript:PropertyKey"prototype"
[Link]{"constructor":F}(thatis,aobjectwithapropertykey
"constructor",withvalueofthefunctionitself).seeJavaScript:PropertyKey"constructor"
[Link]'scallthisnewobject
[Link]
[Link],withF'[Link]:thisBinding
[Link],oritdoesbutreturnsavaluethatisnotaobject,thenthetempObjisthe
[Link]:What'sObject?IfFreturnsavaluethatisaJavaScriptobject,thenthatobjectis
theresult.
//exampleshowingdifferenceofconstructorwithdifferenttypeofreturnvalueJavaScript
[Link] 1/6
4/9/2017 JavaScript: Operator new
varF1=function(){this.b=4;};
varF2=function(){this.b=4;return3;};
varF3=function(){this.b=4;return{"c":7};};
varx1=newF1();
varx2=newF2();
varx3=newF3();
[Link](x1);//prints{b:4}
[Link](x2);//prints{b:4}
[Link](x3);//prints{c:7}
//whatnewF()returnsdependsonwhetherFreturnsaobject
What'stheParentofaObjectCreatedwithnew?
IftheconstructorfunctionFdoesnothaveareturnstatementorreturnsanonobjectvalue,thentheparentof
[Link]()iscalled.
Iftheconstructorfunctionhasareturnstatement,and,thereturnvalueisaobjectX,then,thisobjectXisthe
[Link],[Link]
functioncreatedX.
//showingtheprototypeofaobjectcreatedbyaconstructorthatdoesn'thave JavaScript
areturnstatement
varFF=function(xx){[Link]=xx;};
varoo=newFF(3);
[Link]([Link](oo)===[Link]);//true
//showingtheprototypeofaobjectcreatedbyaconstructorthatreturnsa JavaScript
object
//thisfunctionreturnsaobject
varFF=function(xx){return{"yy":3};};
varoo=newFF(3);
//[Link]
[Link]([Link](oo)===[Link]);//false
//becausethefunctionFFreturnsaobject
//so,thenewlycreatedobjectiswhateverthefunctionreturned.
//inthiscase,theobjectiscreatedbyliteralexpression{},andbydefaultits
[Link]
[Link]([Link](oo)===[Link]({}));//true
[Link]([Link](oo)===[Link]);//true
seeJavaScript:PrototypeandInheritance
ChangingConstructor'sPrototypePropertyDoesNotChangeParentofExistingObject
//changingconstructor'sprototypepropertydoesnotchangeparentofexisting JavaScript
object
functionFF(){};
[Link]={xx:5};
[Link] 2/6
4/9/2017 JavaScript: Operator new
varaa=newFF();
[Link]([Link]);//5
[Link]={yy:6};
[Link]([Link]);//undefined
Reference
ECMAScript2015ECMAScriptLanguage:Expressions#secnewoperator
JSConstructorTopic
[Link]:thisBinding
[Link]:What'sConstructor?
[Link]:PropertyKey"prototype"
[Link]:Operatornew
[Link]:instanceofOperator
[Link]:PropertyKey"constructor"
SingleUkraine JavaScript: FreeGuideon JavaScript:
Ladies Prototypeand... PowerShell MethodChaining...
Ad [Link] [Link] Ad [Link] [Link]
CUBAPlatform JavaScript: WhatLanguages XahWebDevBlog
OpenSource... SemicolonRules toHate
Ad [Link] [Link] [Link] [Link]
[Link] 3/6
4/9/2017 JavaScript: Operator new
Likewhatyouread?
BuyJavaScriptin
Depth
or,buyanew
keyboard,see
KeyboardReviews.
JSBasics
JSinDepth
Function
1. DefineFunction
2. FunctionParameters
3. VariableDeclarationOrder
4. FunctionLevelVariableScope
5. fDeclarationvsExpression
6. Closure
7. FunctionalPrograming
8. [Link]
9. ArgDefaultValue
10. RestParams
11. ArrowFunction
Properties
1. PropertyOverview
2. PropertyKey
3. DotvsBracketNotation
4. Create/DeleteProperty
5. Read/WritetoProperty
6. CheckPropertyExistence
7. ListProperties
8. PropertyAttributes
9. Getter/Setter
[Link] 4/6
4/9/2017 JavaScript: Operator new
10. PropertyDescriptor
Object,Inheritance
1. ObjectOverview
2. What'sObject?
3. Prototype,Inheritance
4. CreateObject
5. ObjectLiteralExpression{}
6. FindObject'sParent
7. CreateObjectwithParentX
8. PreventAddingProperty
9. TypeofObject
10. PrimitiveTypesObjectWrapper
11. CloneObject
12. EqualityTestofObjects
13. Boolean()ConstructorObject
Array
1. Array
2. CreateArray
3. SparseArray
4. ArrayLikeObject
5. ArrayHowTo
Constructor
1. thisbinding
2. What'sConstructor?
3. Propertyprototype
4. Operatornew
5. Operatorinstanceof
6. Propertyconstructor
JSObjectReference
ES2015
JSMisc
DOMScripting
[Link] 5/6
4/9/2017 JavaScript: Operator new
[Link] 6/6