Chuyển đến nội dung chính

freecodecamp: Object Oriented Programming

freecodecamp: Object Oriented Programming


I go for a long long road, start from a little steps. Happy coding!!

Create a Basic JavaScript Object

"let dog = {
name:"",
numLegs:2
};"

Use Dot Notation to Access the Properties of an Object

"console.log(dog.name);
console.log(dog.numLegs);
"

Create a Method on an Object

"sayLegs: function(){ return "This dog has "+dog.numLegs+" legs.";}"

Make Code More Reusable with the this Keyword

" sayLegs: function() {return "This dog has " + this.numLegs + " legs.";}"

Define a Constructor Function


"function Dog() {
this.name = "Albert";
this.color = "blue";
this.numLegs = 4;
}"

Use a Constructor to Create Objects


"let hound= new Dog();
"

Extend Constructors to Receive Arguments

"function Dog(name, color) {
this.name=name;
this.color=color;
this.numLegs=4;
}
let terrier=new Dog('teddy', 'blue');"

Verify an Object's Constructor with instanceof

"// Add your code below this line
let myHouse={
numBedrooms:4
};
myHouse instanceof House;"

Understand Own Properties

"for (let own in canary){
if(canary.hasOwnProperty)
{
ownProps.push(own);
}
}"

Use Prototype Properties to Reduce Duplicate Code

"function Dog(name) {
this.name = name;
}
// Add your code above this line
let beagle = new Dog("Snoopy");
Dog.prototype.numLegs=4"

Iterate Over All Properties


"// Add your code below this line
for(let own in beagle){
if(beagle.hasOwnProperty(own)){
ownProps.push(own);
}
else{
prototypeProps.push(own);
}
}
"

Understand the Constructor Property

"function joinDogFraternity(candidate) {
if(candidate.constructor== Dog){
return true;
}
else return false;
}
"

Change the Prototype to a New Object


"// Add your code below this line
numLegs: 4,
eat: function(){ return '';},
describe: function(){ return '';}
};"

Remember to Set the Constructor Property when Changing the Prototype


"constructor: Dog,"


Understand Where an Object’s Prototype Comes From


"
Dog.prototype.isPrototypeOf(beagle);
"

Understand the Prototype Chain


"Object.prototype.isPrototypeOf(Dog.prototype);
"

Use Inheritance So You Don't Repeat Yourself

"function Cat(name) {
this.name = name;
}

Cat.prototype = {
constructor: Cat,
};

function Bear(name) {
this.name = name;
}

Bear.prototype = {
constructor: Bear,
};

function Animal() { }

Animal.prototype = {
constructor: Animal,
eat: function() {
console.log("nom nom nom");}
};"

Inherit Behaviors from a Supertype

"let duck=Object.create(Animal.prototype); // Change this line
let beagle=Object.create(Animal.prototype); // Change this line"

Set the Child's Prototype to an Instance of the Parent


"Dog.prototype= Object.create(Animal.prototype);"

Reset an Inherited Constructor Property


"Bird.prototype.constructor= Bird;
Dog.prototype.constructor= Dog;"

Add Methods After Inheritance

"// Add your code below this line
Dog.prototype= Object.create(Animal.prototype);
Dog.prototype.constructor= Dog;
Dog.prototype.bark= function(){ return '';};"

Override Inherited Methods


"Penguin.prototype.fly= function(){return "Alas, this is a flightless bird.";}"

Use a Mixin to Add Common Behavior Between Unrelated Objects

"// Add your code below this line
let glideMixin= function(obj){
obj.glide= function(){
return '';
};
}
glideMixin(bird);
glideMixin(boat);"

Use Closure to Protect Properties Within an Object from Being Modified Externally


"function Bird() {
let weight = 15;
this.getWeight= function(){
return weight;
}
}"

Understand the Immediately Invoked Function Expression (IIFE)


"(function () {
console.log("A cozy nest is ready");
})();
// makeNest(); "

Use an IIFE to Create a Module


"let funModule=(function(){
return{
isCuteMixin: function(obj) {
obj.isCute = function() {
return true;
};
},
singMixin: function(obj) {
obj.sing = function() {
console.log("Singing to an awesome tune");
};
}
}})();"




Nhãn:

Nhận xét

Đăng nhận xét

Bài đăng phổ biến từ blog này

freecodecamp: React

freecodecamp: React step by step to practice Create a Simple JSX Element " const JSX = <h1>Hello JSX!</h1>; " Create a Complex JSX Element " const JSX=<div> <h1></h1> <p></p> <ul> <li></li> <li></li> <li></li> </ul> </div>; " Add Comments in JSX " const JSX = ( /* here in first time */ <div> <h1>This is a block of JSX</h1> <p>Here 's a subtitle</p> </div> ); " Render HTML Elements to the DOM " const JSX = ( <div id= 'challenge-node' > <h1>Hello World</h1> <p>Lets render this to the DOM</p> </div> ); // change code below this line ReactDOM.render(JSX,document.getElementById( 'challenge-node' )); " Define an HTML Class in JSX " cons...
Đăng nhận xét
Đọc thêm

freecodecamp: javascript debugging

freecodecamp: javascript debugging I note that passed code to help coder find the solution Use the JavaScript Console to Check the Value of a Variable "console.log(a);" Understanding the Differences between the freeCodeCamp and Browser Console " console.log(outputTwo); console.clear(); console.log(outputOne); " Use typeof to Check the Type of a Variable " console.log( typeof (seven)); console.log( typeof (three)); " Catch Misspelled Variable and Function Names "" //copy &past variable Catch Unclosed Parentheses, Brackets, Braces and Quotes " let myArray = [ 1 , 2 , 3 ]; let arraySum = myArray.reduce((previous, current) => previous + current); " Catch Mixed Usage of Single and Double Quotes " let innerHtml = "<p>Click here to <a href=\"#Home\">return home</a></p>" ; " Catch Use of Assignment Operator Instead of Equality Ope...
Đăng nhận xét
Đọc thêm

freecodecamp: regular expression

freecodecamp: regular expression How to pass these challenge? I note that snippet code. Help people to help myself. Regular Expressions - Reuse Patterns Using Capture Groups " let reRegex = /^(\d+)\s\1\s\1$/; // Change this line " Use Capture Groups to Search and Replace " let fixRegex = /good/; // Change this line let replaceText = "okey-dokey" ; // Change this line " Remove Whitespace from Start and End " let wsRegex = /\s{2,}/g; // Change this line let result = hello.replace(wsRegex, '' ); // Change this line "
Đăng nhận xét
Đọc thêm