Jump to content

L8V2L thoughts on JavaScript...


L8V2L

Recommended Posts

function makePerson(first, last){ return{  first:first,  last:last };}function personFullName(person){  return person.first + " " + person.last;}function personFullNameReversed(person){  return person.last + ', '+person.first;}s = makePerson("Simon","Willison");personFullName(s);personFullNameReversed(s);function makePerson(first, last) {  return{   first: first,   last: last,   fullName : function(){    return this.first + " "+ this.last;  },   fullNameReversed: function(){    return this.last + ', '+ this.first;  } };}s = makePerson("Simon", "Willison");fullName = s.fullName();s.fullName();//s.fullNameReversed();function Person(first, last){  this.first = first;  this.last = last;  this.fullName = function(){      return this.first + ' ' + this.last;  };  this.fullNameReversed = function(){      return this.last + ', ' + this.first;  }; }var s = new Person("Simon", "Willison");s.fullNameReversed();function personFullName() { /* <-- isn't this and the function that follow it polluting the global namespace?*/    return this.first + ' ' + this.last;}function personFullNameReversed() {    return this.last + ', ' + this.first;}function Human(first, last) {    this.first = first;    this.last = last;    this.fullName = personFullName; /*<-- cause of 'this'(literally and figuratively) this casue the to preseeding fucntion to attach themselves as methods to this function and any other function(construcotr) that happen to both in heirtate and reference to this method/function?*/    this.fullNameReversed = personFullNameReversed;}var hi = new Human("hi", "bye")function Animal(first, last) {    this.first = first;    this.last = last;    this.fullName = personFullName;    this.fullNameReversed = personFullNameReversed;}var dog = new Animal("happy", "joy");  console.log(hi.fullName()+"n"+dog.fullName());function Person(first, last) {    this.first = first;    this.last = last;}Person.prototype.fullName = function() { /*defining the function semantically assigning it to the prototype chain, I would say this is a better way of writing oops, since they have mention that each time the constructor function(and instances) are invoke, they recreate the function they have access to inside them, but with this, it's more of a reference to the function that is in the prototype chain. Please if I'm incorrect, correct me*/     return this.first + ' ' + this.last;};Person.prototype.fullNameReversed = function() {    return this.last + ', ' + this.first;};var s = new Person("Simon", "Willison");s.fullNameReversed();function addHandler() {    var el = document.getElementById('el');    el.onclick = function() {        this.style.backgroundColor = 'red'; // what is the rules for memory leaks?    };}function addHandler() {    var clickHandler = function() {        this.style.backgroundColor = 'red';    };    (function() {        var el = document.getElementById('el'); /* <-- just look at how date is being transform; ones this self invoke function is trigger by the event handler, it automatically assign the variable clickHandler as it's self, and... I mean I see what's going on, but do not understand it... Can some one explain this to me?*/         el.onclick = clickHandler;    })();}//circular references, and memory leaks introduced by a closure:function addHandler() {    var el = document.getElementById('el');    el.onclick = function() {        this.style.backgroundColor = 'red';/*Is when you reference one thing, and transfer back to anotherthing, but because of this creating a closure, date is... is being caught between it going back to the event handler, or to the element node that have an id of el.*/     };} 
Edited by L8V2L
Link to comment
Share on other sites

// define the Person Classfunction Person() {}Person.prototype.walk = function(){  alert ('I am walking!');};Person.prototype.sayHello = function(){  alert ('hello');};// define the Student classfunction Student() {  // Call the parent constructor  Person.call(this);};// inherit Person <--- L8V2L QUESTION FOR THIS!!!!Student.prototype = new Person(); // <-- I look in both IE, and firefox console and saw the different in commented this out and uncommented this out, but do not understand what it imply. Anyone? clarity? // correct the constructor pointer because it points to Person//Student.prototype.constructor = Student; // replace the sayHello method//Student.prototype.sayHello = function(){  //alert('hi, I am a student');//};// add sayGoodBye method//Student.prototype.sayGoodBye = function(){//  alert('goodBye');I//};var student1 = new Student();//student1.sayHello();//student1.walk();//student1.sayGoodBye();Person;Student;// check inheritance//alert(student1 instanceof Person); // true //alert(student1 instanceof Student); // true
Link to comment
Share on other sites

That was already discussed in one of your other topics.http://w3schools.invisionzone.com/index.php?showtopic=50075&page=6#entry277319

// define the Person Classfunction Person() {}Person.prototype.walk = function(){  alert ('I am walking!');};Person.prototype.sayHello = function(){  alert ('hello');};// define the Student classfunction Student() {  // Call the parent constructor  Person.call(this);};// inherit PersonStudent.prototype = new Person();//Student.prototype.__proto__ = new Person(); <-- USING THIS SEEM TO BE THE BEST SHORTEST WAY./*I don't really understand, but I understand that it set the constructor to Student and not Person, so I guess when making instance, it'll point to Student as the constructor and not Person... Is that correct? What is the benefit of doing this? And harm of keeping it as is?*///correct the constructor pointer because it points to PersonStudent.prototype.constructor = Student;//Student.prototype = Object.create(Person.prototype);// replace the sayHello method//Student.prototype.sayHello = function(){  //alert('hi, I am a student');//};// add sayGoodBye method//Student.prototype.sayGoodBye = function(){//  alert('goodBye');I//};var student1 = new Student();//student1.sayHello();//student1.walk();//student1.sayGoodBye();Person;Student;// check inheritance//alert(student1 instanceof Person); // true //alert(student1 instanceof Student); // true
Link to comment
Share on other sites

The definitive guide(pocket version) is very wordy... at least at the beginning(lexical description). As I said before; "I like reading documentation, manual, guide books with plenty of example toward each topic cover with explanation."(<-- I do best with learning from such format) Hopefully it'll pick up with that later on.Any one have any books that comes to mind with "documentations, manuals, guides with plenty of example toward each topic cover with explanation"There was a part in the book where it said it's okay to leave trailing commas in array. I do not agree, as I learn reading mdn(a couple of times) it is good/better practice to make sure no trailing commas are there, for it is no need if they are going to be ignore by the interpreter(the interpreter first have to read it before it can ignore it(in my opinion; you can't ignore something with out first acknowledging it existence is there.) With that said, it would be reasonable that it'll have some effects on performances.) hopefully this only being chapter three, and not the primary topic for those objects/entities.Again(me not asking of a book, but a particle style/type), do anyone know of any; documentation, manual, guide books with plenty of example toward each topic cover with explanation."

Link to comment
Share on other sites

var count = 0;while(count < 10){count++console.log(count);//count++}for(var i = 0; i < 10; i++){console.log(i); /*this been puzzling me ever since a while ago. Why won't(... wont... won't <-- What's up with that!) Why won't it log 10 if it is incremented after checking the expression. The onlything that make sense to me is that one is not incremented when console.log it; cause if it was, zero would never log. I thought if I pre-increment it...(Don't know why, but I do things like that, try stupid things  that I know they want work.(I'm the type that would put in a wrong answer to see if it compute right out of experimenting))(<-- I realize that I do the very thing I hate books to do, get off track... to which why I hate it.) But yeah, anyone care to explain?*/ }
Edited by L8V2L
Link to comment
Share on other sites

No it's not stupid at all. It's all a part of the learning process. :)

 

The reason you're not getting 10 logged is because you're telling the loop to loop through as long as count and i are less than 10. If you change the conditional operator to <= you will see 10 logged.

Link to comment
Share on other sites

In the for() loop, i++ occurs after the rest of the code in the loop has run.

 

In your while() loop, you're incrementing count before running the rest of the code.

 

In both loops you told it to leave the loop when the variable is less than 10, so 10 will never be displayed.

Link to comment
Share on other sites

For the loop questions where you are simply confused about how a variable is reaching a certain value I would like to see you using the browser console debugger -- and single-stepping through your code. Single-stepping through code is how any beginner learns how loops work. I'm sure you can find a Youtube tutorial on using the browser debugger.

 

https://www.youtube.com/watch?v=tdIk2PztcL0

 

https://www.youtube.com/watch?v=a9ylYZ5v-nY

Link to comment
Share on other sites

No it's not stupid at all. It's all a part of the learning process. :) The reason you're not getting 10 logged is because you're telling the loop to loop through as long as count and i are less than 10. If you change the conditional operator to <= you will see 10 logged.

Oh NOOOOOOOO!!!!!! Please everyone read this PLEASE!!! I know that, I really do, my mistake, I wasn't paying attention as I was typing... or I wasn't thinking... (refer to the picture.) What I was really asking is 1, who(<-- I look back over this and see a mistake! I meant 'why') did it start at zero no matter if it was post increment, and(another mistake I meant 'or') pre increment. I can't believe that(I made that mistake), please everyone read this... I hope I type this correctly.
Link to comment
Share on other sites

It starts at zero because that's what you told it to do.

var count = 0;...for(var i = 0; i < 10; i++)
Link to comment
Share on other sites

It starts at zero because that's what you told it to do.

var count = 0;...for(var i = 0; i < 10; i++)

 

I'm looking more at the increment, does it skip the increment the first time around?
Link to comment
Share on other sites

In the for loop, the third part is executed after all the rest of the code in the block, as shown in the W3Schools tutorial: http://www.w3schools.com/js/js_loop_for.asp

The For Loop

The for loop is often the tool you will use when you want to create a loop.

The for loop has the following syntax:

for (statement 1; statement 2; statement 3) {    code block to be executed}

Statement 1 is executed before the loop (the code block) starts.

Statement 2 defines the condition for running the loop (the code block).

Statement 3 is executed each time after the loop (the code block) has been executed.

 

The equivalent while loop to a for loop is like this:

statement 1;while(statement 2) {    code block to be executed    statement 3;}
  • Like 1
Link to comment
Share on other sites

In the for loop, the third part is executed after all the rest of the code in the block, as shown in the W3Schools tutorial: http://www.w3schools.com/js/js_loop_for.asp The equivalent while loop to a for loop is like this:

statement 1;while(statement 2) {    code block to be executed    statement 3;}
Sorry... Sometime it just help me get it if someone point it out. Thank you Ingolme. :)

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...