title
Object Oriented JavaScript

description
Get the Cheat Sheet Here : http://goo.gl/CQVZsW Best Object Oriented JavaScript Book : http://amzn.to/1L0Mvs8 Support me on Patreon : https://www.patreon.com/derekbanas MY UDEMY COURSES ARE 87.5% OFF TIL December 19th ($9.99) ONE IS FREE ➡️ Python Data Science Series for $9.99 : Highest Rated & Largest Python Udemy Course + 56 Hrs + 200 Videos + Data Science https://bit.ly/Master_Python_41 ➡️ C++ Programming Bootcamp Series for $9.99 : Over 23 Hrs + 53 Videos + Quizzes + Graded Assignments + New Videos Every Month https://bit.ly/C_Course_41 ➡️ FREE 15 hour Golang Course!!! : https://bit.ly/go-tutorial3 01:50 JavaScript Objects 02:36 Objects in Objects 04:12 Constructor Functions 05:58 instanceof 06:28 Passing Objects to Functions 08:09 Prototypes 09:34 Adding Properties to Objects 10:44 List Properties in Objects 11:38 hasOwnProperty 12:42 Add Properties to Built in Objects 14:31 Private Properties 18:01 Getters / Setters 21:20 defineGetter / defineSetter 24:38 defineProperty 27:07 Constructor Function Getters / Setters 29:40 Inheritance 37:13 Intermediate Function Inheritance 39:14 Call Parent Functions 41:51 ECMAScript 6 47:31 Singleton Pattern 49:32 Factory Pattern 52:53 Decorator Pattern 54:52 Observer Pattern

detail
{'title': 'Object Oriented JavaScript', 'heatmap': [{'end': 295.938, 'start': 216.311, 'weight': 0.766}, {'end': 442.541, 'start': 398.33, 'weight': 0.729}, {'end': 510.519, 'start': 471.98, 'weight': 1}, {'end': 582.162, 'start': 542.134, 'weight': 0.724}, {'end': 1019.229, 'start': 981.328, 'weight': 0.72}, {'end': 1096.848, 'start': 1050.358, 'weight': 0.814}, {'end': 1309.482, 'start': 1199.092, 'weight': 0.701}, {'end': 1820.907, 'start': 1738.282, 'weight': 0.748}, {'end': 2004.395, 'start': 1923.408, 'weight': 0.969}, {'end': 2985.083, 'start': 2944.782, 'weight': 0.715}, {'end': 3205.823, 'start': 3161.605, 'weight': 0.735}], 'summary': 'The video《object oriented javascript》covers object-oriented javascript, object creation, manipulation, prototypes, private properties, getters and setters, inheritance, ecmascript 6 features, design patterns, and the observer pattern, with detailed explanations and examples provided.', 'chapters': [{'end': 112.398, 'segs': [{'end': 83.436, 'src': 'embed', 'start': 12.828, 'weight': 0, 'content': [{'end': 19.694, 'text': "We're going to cover objects, properties, constructors, prototypes, private properties, numerous different ways to create getters and setters,", 'start': 12.828, 'duration': 6.866}, {'end': 23.477, 'text': 'how to use defined property inheritance, how to call parent methods.', 'start': 19.694, 'duration': 3.783}, {'end': 28.701, 'text': "I'm going to cover some design patterns and even OOP in ECMA scripts 6,", 'start': 23.537, 'duration': 5.164}, {'end': 34.484, 'text': 'or what would be commonly known as the future of how to do object-oriented programming in JavaScript.', 'start': 28.701, 'duration': 5.783}, {'end': 38.987, 'text': 'In the description underneath the video, I have timestamps to all the different things that I cover.', 'start': 34.684, 'duration': 4.303}, {'end': 43.929, 'text': 'so if you want to just click on those and jump around in the video and learn only what you want to learn, feel free to do that.', 'start': 38.987, 'duration': 4.942}, {'end': 46.911, 'text': 'And of course, all the code is also available in the description.', 'start': 43.989, 'duration': 2.922}, {'end': 49.032, 'text': "And I have a lot to do, so let's get into it.", 'start': 47.051, 'duration': 1.981}, {'end': 55.984, 'text': 'Okay, so on the left side of the screen I just have Sublime Text here, Basic Text Editor, and you can see all of the code.', 'start': 50, 'duration': 5.984}, {'end': 58.165, 'text': "that's right there, and this is where I'm going to be typing everything.", 'start': 55.984, 'duration': 2.181}, {'end': 64.41, 'text': "Over here, I have Google Chrome, and I just went over here and went File and Open File, and then I opened it up, and that's it.", 'start': 58.306, 'duration': 6.104}, {'end': 73.396, 'text': "Later on, whenever I cover ECMA Script 6, I'm going to come inside of here and I'm going to come down inside of here, where we have More Tools,", 'start': 64.65, 'duration': 8.746}, {'end': 78.379, 'text': "and I'm going to click on Developer Tools and a whole bunch of things popped up inside here errors and such.", 'start': 73.396, 'duration': 4.983}, {'end': 83.436, 'text': "And what I'm going to do is open this up and I'm going to click on scratch JS.", 'start': 78.912, 'duration': 4.524}], 'summary': 'Covering oop in ecma script 6, including objects, properties, constructors, prototypes, private properties, and design patterns. timestamps and code available.', 'duration': 70.608, 'max_score': 12.828, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE412828.jpg'}, {'end': 127.308, 'src': 'embed', 'start': 98.849, 'weight': 5, 'content': [{'end': 105.253, 'text': "And also, just so I'll be able to follow my different errors I may make, I'm going to click on View and Developer and JavaScript Console.", 'start': 98.849, 'duration': 6.404}, {'end': 108.576, 'text': "And that's going to open up a little console here and tell me if I make any errors.", 'start': 105.294, 'duration': 3.282}, {'end': 112.398, 'text': "And if you haven't watched my JavaScript tutorial, you should probably check that out.", 'start': 108.936, 'duration': 3.462}, {'end': 117.622, 'text': "But it's not necessarily needed because I'm going to cover some things here that I covered there along with a whole bunch of other things.", 'start': 112.478, 'duration': 5.144}, {'end': 121.825, 'text': "Well, first thing I'm going to do is I'm going to create a basic object inside of here.", 'start': 117.762, 'duration': 4.063}, {'end': 127.308, 'text': "And I'll show you a couple different ways to do this, but you'll be able to come in here and define some different properties,", 'start': 122.045, 'duration': 5.263}], 'summary': 'Introduction to javascript console and object creation.', 'duration': 28.459, 'max_score': 98.849, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE498849.jpg'}], 'start': 0.137, 'title': 'Object-oriented javascript', 'summary': 'Covers objects, properties, constructors, prototypes, private properties, getters and setters, defined property inheritance, parent methods, design patterns, and oop in ecma scripts 6, with code and video timestamps provided.', 'chapters': [{'end': 112.398, 'start': 0.137, 'title': 'Object-oriented javascript tutorial', 'summary': 'Covers everything about object-oriented javascript, including objects, properties, constructors, prototypes, private properties, getters and setters, defined property inheritance, parent methods, design patterns, and oop in ecma scripts 6, with code and video timestamps provided.', 'duration': 112.261, 'highlights': ['The tutorial covers objects, properties, constructors, prototypes, private properties, getters and setters, defined property inheritance, parent methods, design patterns, and OOP in ECMA scripts 6, providing comprehensive knowledge on object-oriented JavaScript.', 'Video timestamps are available in the description for easy navigation to specific topics, allowing viewers to learn what they want at their convenience.', 'The code is available in the description, ensuring that viewers have access to all the code used in the tutorial.', 'Instructions are provided on using Developer Tools like scratch JS and JavaScript Console for debugging and error tracking during the tutorial.', 'The tutorial emphasizes the use of Sublime Text and Google Chrome for coding and learning, demonstrating practical implementation of the concepts.', 'The presenter recommends checking out the JavaScript tutorial for additional foundational knowledge, providing further learning resources for viewers.']}], 'duration': 112.261, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4137.jpg', 'highlights': ['The tutorial covers objects, properties, constructors, prototypes, private properties, getters and setters, defined property inheritance, parent methods, design patterns, and OOP in ECMA scripts 6, providing comprehensive knowledge on object-oriented JavaScript.', 'Video timestamps are available in the description for easy navigation to specific topics, allowing viewers to learn what they want at their convenience.', 'The code is available in the description, ensuring that viewers have access to all the code used in the tutorial.', 'Instructions are provided on using Developer Tools like scratch JS and JavaScript Console for debugging and error tracking during the tutorial.', 'The tutorial emphasizes the use of Sublime Text and Google Chrome for coding and learning, demonstrating practical implementation of the concepts.', 'The presenter recommends checking out the JavaScript tutorial for additional foundational knowledge, providing further learning resources for viewers.']}, {'end': 485.827, 'segs': [{'end': 138.416, 'src': 'embed', 'start': 112.478, 'weight': 0, 'content': [{'end': 117.622, 'text': "But it's not necessarily needed because I'm going to cover some things here that I covered there along with a whole bunch of other things.", 'start': 112.478, 'duration': 5.144}, {'end': 121.825, 'text': "Well, first thing I'm going to do is I'm going to create a basic object inside of here.", 'start': 117.762, 'duration': 4.063}, {'end': 127.308, 'text': "And I'll show you a couple different ways to do this, but you'll be able to come in here and define some different properties,", 'start': 122.045, 'duration': 5.263}, {'end': 129.87, 'text': "like the customer's name being Tom Smith.", 'start': 127.308, 'duration': 2.562}, {'end': 134.493, 'text': 'We can also come in here and define a function for our customer.', 'start': 130.13, 'duration': 4.363}, {'end': 138.416, 'text': "And in this situation, we're just going to return a string.", 'start': 134.913, 'duration': 3.503}], 'summary': 'Demonstrating how to create a basic object with defined properties and a function.', 'duration': 25.938, 'max_score': 112.478, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4112478.jpg'}, {'end': 295.938, 'src': 'heatmap', 'start': 216.311, 'weight': 0.766, 'content': [{'end': 221.115, 'text': 'How I would refer to the inside of that object is just to refer to it like this.', 'start': 216.311, 'duration': 4.804}, {'end': 222.656, 'text': 'Address Save that.', 'start': 221.395, 'duration': 1.261}, {'end': 226.024, 'text': 'Reload And you can see Tom Smith lives at 123 Main Street.', 'start': 222.717, 'duration': 3.307}, {'end': 228.847, 'text': "So that's how we'd be able to refer to objects inside of objects.", 'start': 226.084, 'duration': 2.763}, {'end': 231.91, 'text': "We're also going to be able to come in here and add properties.", 'start': 229.147, 'duration': 2.763}, {'end': 233.591, 'text': "So we'll just say customer.", 'start': 232.05, 'duration': 1.541}, {'end': 237.955, 'text': "Let's say that I wanted to add to the address object country.", 'start': 233.651, 'duration': 4.304}, {'end': 239.557, 'text': 'Also, I could do it this way.', 'start': 238.315, 'duration': 1.242}, {'end': 241.138, 'text': 'And I could just go US.', 'start': 239.897, 'duration': 1.241}, {'end': 242.599, 'text': 'And there it is inside of there.', 'start': 241.378, 'duration': 1.221}, {'end': 249.385, 'text': "And of course, I'd be able to come in here and output that information again just by referring to it in exactly the same way.", 'start': 242.88, 'duration': 6.505}, {'end': 251.943, 'text': 'Country and you can see US pops up there.', 'start': 249.586, 'duration': 2.357}, {'end': 257.889, 'text': 'Now, if you wanted to be able to come in here and create multiple different objects of the same type,', 'start': 252.164, 'duration': 5.725}, {'end': 260.651, 'text': "you're going to use something called a constructor function,", 'start': 257.889, 'duration': 2.762}, {'end': 267.597, 'text': 'and basically a constructor is going to provide the functions that classes provide in other object oriented programming languages,', 'start': 260.651, 'duration': 6.946}, {'end': 274.583, 'text': "and you start it off by just going function, And then you're going to define exactly what you want your object to be called.", 'start': 267.597, 'duration': 6.986}, {'end': 279.526, 'text': 'And if you wanted to receive certain properties sent into it and set, you do it this way.', 'start': 274.903, 'duration': 4.623}, {'end': 283.549, 'text': 'And you would set those values just by going this name is equal to name.', 'start': 279.966, 'duration': 3.583}, {'end': 286.351, 'text': "You don't have to define the data type or anything like that.", 'start': 283.569, 'duration': 2.782}, {'end': 289.393, 'text': 'And we can do the same thing with street, of course.', 'start': 286.611, 'duration': 2.782}, {'end': 295.938, 'text': "And then if we wanted to define a function this way, we're going to do it in a different way than what you see up here.", 'start': 289.793, 'duration': 6.145}], 'summary': 'The transcript discusses accessing and adding properties to objects, and creating multiple objects using constructor functions in object-oriented programming.', 'duration': 79.627, 'max_score': 216.311, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4216311.jpg'}, {'end': 267.597, 'src': 'embed', 'start': 229.147, 'weight': 1, 'content': [{'end': 231.91, 'text': "We're also going to be able to come in here and add properties.", 'start': 229.147, 'duration': 2.763}, {'end': 233.591, 'text': "So we'll just say customer.", 'start': 232.05, 'duration': 1.541}, {'end': 237.955, 'text': "Let's say that I wanted to add to the address object country.", 'start': 233.651, 'duration': 4.304}, {'end': 239.557, 'text': 'Also, I could do it this way.', 'start': 238.315, 'duration': 1.242}, {'end': 241.138, 'text': 'And I could just go US.', 'start': 239.897, 'duration': 1.241}, {'end': 242.599, 'text': 'And there it is inside of there.', 'start': 241.378, 'duration': 1.221}, {'end': 249.385, 'text': "And of course, I'd be able to come in here and output that information again just by referring to it in exactly the same way.", 'start': 242.88, 'duration': 6.505}, {'end': 251.943, 'text': 'Country and you can see US pops up there.', 'start': 249.586, 'duration': 2.357}, {'end': 257.889, 'text': 'Now, if you wanted to be able to come in here and create multiple different objects of the same type,', 'start': 252.164, 'duration': 5.725}, {'end': 260.651, 'text': "you're going to use something called a constructor function,", 'start': 257.889, 'duration': 2.762}, {'end': 267.597, 'text': 'and basically a constructor is going to provide the functions that classes provide in other object oriented programming languages,', 'start': 260.651, 'duration': 6.946}], 'summary': 'Demonstrates adding properties to objects and using constructor functions for creating multiple objects.', 'duration': 38.45, 'max_score': 229.147, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4229147.jpg'}, {'end': 407.745, 'src': 'embed', 'start': 376.655, 'weight': 4, 'content': [{'end': 381.783, 'text': "And then instance of, and it's just asking if it is a person object.", 'start': 376.655, 'duration': 5.128}, {'end': 385.774, 'text': 'and you can see Bob Smith is a person that comes back as true.', 'start': 382.17, 'duration': 3.604}, {'end': 388.558, 'text': "all these things are very useful to know, because you're going to use them a lot.", 'start': 385.774, 'duration': 2.784}, {'end': 394.225, 'text': "another thing we'll be able to do is pass an object to a function and change its values, and to do that,", 'start': 388.558, 'duration': 5.667}, {'end': 398.33, 'text': "we'll just create another function and let's call this function change name.", 'start': 394.225, 'duration': 4.105}, {'end': 400.6, 'text': "it's going to receive a person.", 'start': 398.33, 'duration': 2.27}, {'end': 401.48, 'text': 'we can then just go.', 'start': 400.6, 'duration': 0.88}, {'end': 407.745, 'text': "person name is equal to, and sue Smith, and I'll show you later on how to make these private.", 'start': 401.48, 'duration': 6.265}], 'summary': 'The transcript covers object instances, function parameters, and value changes in javascript.', 'duration': 31.09, 'max_score': 376.655, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4376655.jpg'}, {'end': 442.541, 'src': 'heatmap', 'start': 398.33, 'weight': 0.729, 'content': [{'end': 400.6, 'text': "it's going to receive a person.", 'start': 398.33, 'duration': 2.27}, {'end': 401.48, 'text': 'we can then just go.', 'start': 400.6, 'duration': 0.88}, {'end': 407.745, 'text': "person name is equal to, and sue Smith, and I'll show you later on how to make these private.", 'start': 401.48, 'duration': 6.265}, {'end': 410.326, 'text': "so it's not so easy to come in there and mess them up.", 'start': 407.745, 'duration': 2.581}, {'end': 419.032, 'text': "we will then call the change name function and pass Bob Smith inside of it, and we're gonna then be able to come in and output this change.", 'start': 410.326, 'duration': 8.706}, {'end': 428.278, 'text': "so we'll say Bob became, make sure you put quotes around this, and now we'll come in and we'll say something like Bob Smith and name,", 'start': 419.032, 'duration': 9.246}, {'end': 430.599, 'text': 'and you can see that Bob Smith became Sue Smith.', 'start': 428.278, 'duration': 2.321}, {'end': 436, 'text': "It's also important to know that objects are only going to be equal if they reference the exact same object.", 'start': 430.699, 'duration': 5.301}, {'end': 441.181, 'text': "It doesn't mean that they'll be equal if they contain the same data, and we can see that that is true.", 'start': 436.04, 'duration': 5.141}, {'end': 442.541, 'text': "Let's just come in and go.", 'start': 441.421, 'duration': 1.12}], 'summary': 'Demonstrating object manipulation and equality in programming.', 'duration': 44.211, 'max_score': 398.33, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4398330.jpg'}, {'end': 441.181, 'src': 'embed', 'start': 419.032, 'weight': 2, 'content': [{'end': 428.278, 'text': "so we'll say Bob became, make sure you put quotes around this, and now we'll come in and we'll say something like Bob Smith and name,", 'start': 419.032, 'duration': 9.246}, {'end': 430.599, 'text': 'and you can see that Bob Smith became Sue Smith.', 'start': 428.278, 'duration': 2.321}, {'end': 436, 'text': "It's also important to know that objects are only going to be equal if they reference the exact same object.", 'start': 430.699, 'duration': 5.301}, {'end': 441.181, 'text': "It doesn't mean that they'll be equal if they contain the same data, and we can see that that is true.", 'start': 436.04, 'duration': 5.141}], 'summary': 'Objects must reference exact same object to be equal.', 'duration': 22.149, 'max_score': 419.032, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4419032.jpg'}], 'start': 112.478, 'title': 'Javascript objects', 'summary': 'Explains how to create and work with javascript objects, covering various methods for object creation, including nesting objects, and demonstrating object manipulation, instance checking, and passing objects to functions.', 'chapters': [{'end': 192.193, 'start': 112.478, 'title': 'Javascript object creation', 'summary': 'Explains how to create a basic object in javascript, demonstrating various ways to define properties and functions, while also showcasing the ability to nest objects within objects and output the object using a write statement.', 'duration': 79.715, 'highlights': ['The chapter demonstrates creating a basic object in JavaScript, showcasing the definition of properties and functions within the object, and the ability to nest objects within objects.', "The chapter emphasizes the separation of properties and values within the object using commas, providing examples like defining the customer's name and creating an address object with properties like street and state.", 'The chapter also highlights the use of a write statement to output the created object to the browser, emphasizing the practical application of the object creation process in JavaScript.']}, {'end': 485.827, 'start': 192.253, 'title': 'Working with javascript objects', 'summary': 'Demonstrates how to work with javascript objects, including accessing and modifying object properties, creating multiple objects of the same type using constructor functions, checking object instances, passing objects to functions, and understanding object equality.', 'duration': 293.574, 'highlights': ['Creating multiple objects using constructor functions The chapter explains the use of constructor functions to create multiple objects of the same type, demonstrating how to define the object properties and functions within the constructor, and then creating and accessing objects of that type.', "Accessing and modifying object properties The transcript illustrates accessing and modifying object properties, such as retrieving information from nested objects and adding new properties to existing objects, with a practical example of adding a 'country' property to an 'address' object.", "Checking object instances It describes how to check if a specific object is an instance of a particular object type and demonstrates checking the instance of the 'person' object type for an object named 'Bob Smith'.", "Understanding object equality The chapter explains the concept of object equality, distinguishing between the equality of objects based on reference versus the equality based on containing the same data, and provides an example demonstrating the difference using 'double equals' and 'triple equals' comparisons.", "Passing objects to functions It demonstrates passing objects to functions, specifically changing the values of an object passed to a function, and shows an example of a function 'changeName' that modifies the name of a person object."]}], 'duration': 373.349, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4112478.jpg', 'highlights': ['The chapter demonstrates creating a basic object in JavaScript, showcasing the definition of properties and functions within the object, and the ability to nest objects within objects.', 'Creating multiple objects using constructor functions The chapter explains the use of constructor functions to create multiple objects of the same type, demonstrating how to define the object properties and functions within the constructor, and then creating and accessing objects of that type.', "Understanding object equality The chapter explains the concept of object equality, distinguishing between the equality of objects based on reference versus the equality based on containing the same data, and provides an example demonstrating the difference using 'double equals' and 'triple equals' comparisons.", "Accessing and modifying object properties The transcript illustrates accessing and modifying object properties, such as retrieving information from nested objects and adding new properties to existing objects, with a practical example of adding a 'country' property to an 'address' object.", "Passing objects to functions It demonstrates passing objects to functions, specifically changing the values of an object passed to a function, and shows an example of a function 'changeName' that modifies the name of a person object."]}, {'end': 1060.561, 'segs': [{'end': 514.604, 'src': 'embed', 'start': 485.987, 'weight': 0, 'content': [{'end': 488.388, 'text': "That's just different ways to check equality.", 'start': 485.987, 'duration': 2.401}, {'end': 490.689, 'text': "Now let's take a closer look at prototypes.", 'start': 488.628, 'duration': 2.061}, {'end': 496.252, 'text': "Now every function is going to have a prototype property that's going to contain an object.", 'start': 491.69, 'duration': 4.562}, {'end': 500.774, 'text': "And you're going to be able to add properties and methods to the prototype object.", 'start': 496.392, 'duration': 4.382}, {'end': 507.435, 'text': 'And then whenever you call for them to execute, they are used just as if they belong to your object, which they do.', 'start': 500.987, 'duration': 6.448}, {'end': 510.519, 'text': "So let's just come in here and create a generic function.", 'start': 507.655, 'duration': 2.864}, {'end': 514.604, 'text': 'Because like I said, every function contains a prototype object.', 'start': 510.679, 'duration': 3.925}], 'summary': 'Functions have a prototype property to add methods and properties, used as if belonging to the object.', 'duration': 28.617, 'max_score': 485.987, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4485987.jpg'}, {'end': 582.162, 'src': 'heatmap', 'start': 542.134, 'weight': 0.724, 'content': [{'end': 548.576, 'text': "We're also going to be able to add properties and methods to an object using prototype, so let's go and let's create another one here.", 'start': 542.134, 'duration': 6.442}, {'end': 556.458, 'text': "This is going to be an object in this situation, so we'll go function, and then we'll create a mammal function, or a mammal object.", 'start': 548.836, 'duration': 7.622}, {'end': 563.103, 'text': "and we'll just come in here once again and go this name is equal to the name that they passed in this,", 'start': 556.918, 'duration': 6.185}, {'end': 573.511, 'text': "and then we'll create a function for it equal to function like this, and it's just going to return mammals name is and then pass back the name.", 'start': 563.103, 'duration': 10.408}, {'end': 582.162, 'text': "and now we'll use prototype to come in here and add an additional variable to it by just referencing the function's name, followed by prototype.", 'start': 573.511, 'duration': 8.651}], 'summary': 'Using prototype to add properties and methods to an object, creating a mammal object with specified functions.', 'duration': 40.028, 'max_score': 542.134, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4542134.jpg'}, {'end': 673.73, 'src': 'embed', 'start': 642.026, 'weight': 2, 'content': [{'end': 644.027, 'text': "We're going to be doing a lot of things with prototype.", 'start': 642.026, 'duration': 2.001}, {'end': 647.39, 'text': 'Could also be able to come in here and list all the properties of an object.', 'start': 644.167, 'duration': 3.223}, {'end': 651.132, 'text': "And for this, I'm going to use the for in looping structure.", 'start': 647.77, 'duration': 3.362}, {'end': 653.454, 'text': "So we're going to do a variable prop,", 'start': 651.413, 'duration': 2.041}, {'end': 661.4, 'text': 'which is going to be the temporary holding cell for each property that we find inside of Grover in this situation as we cycle through all of its properties.', 'start': 653.454, 'duration': 7.946}, {'end': 663.322, 'text': "And we'll just go document right.", 'start': 661.801, 'duration': 1.521}, {'end': 667.665, 'text': "And let's say that we want to just print out the property that we have for it.", 'start': 663.662, 'duration': 4.003}, {'end': 669.907, 'text': 'And then specific type here.', 'start': 667.885, 'duration': 2.022}, {'end': 673.73, 'text': "So Grover, how we'll reference those properties is right like this.", 'start': 669.927, 'duration': 3.803}], 'summary': "Using 'for in' loop to list properties of grover object.", 'duration': 31.704, 'max_score': 642.026, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4642026.jpg'}, {'end': 723.348, 'src': 'embed', 'start': 698.277, 'weight': 3, 'content': [{'end': 705.96, 'text': 'Could also come in and verify if a property belongs to the prototype part of an object or the object Grover itself.', 'start': 698.277, 'duration': 7.683}, {'end': 708.302, 'text': "So let's just come in here, document right.", 'start': 706.181, 'duration': 2.121}, {'end': 712.523, 'text': 'And we can see if name is a part of prototype or Grover.', 'start': 708.742, 'duration': 3.781}, {'end': 715.525, 'text': "So we'll say property of Grover.", 'start': 712.543, 'duration': 2.982}, {'end': 719.166, 'text': "And to be able to find that out, we're just going to say Grover.", 'start': 716.005, 'duration': 3.161}, {'end': 721.988, 'text': "And then we'll say has own property.", 'start': 719.186, 'duration': 2.802}, {'end': 723.348, 'text': 'And use cheat sheets.', 'start': 722.388, 'duration': 0.96}], 'summary': 'Verify property ownership in grover using hasownproperty method.', 'duration': 25.071, 'max_score': 698.277, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4698277.jpg'}, {'end': 795.547, 'src': 'embed', 'start': 767.809, 'weight': 4, 'content': [{'end': 771.791, 'text': "What's also cool is we'd actually be able to add methods to build in JS objects.", 'start': 767.809, 'duration': 3.982}, {'end': 781.015, 'text': "So let's say we wanted to do something, add in an additional function or method or whatever you want to call it, to the array build in object.", 'start': 772.311, 'duration': 8.704}, {'end': 782.838, 'text': 'We just go array prototype.', 'start': 781.377, 'duration': 1.461}, {'end': 788.082, 'text': 'And one function that is missing from the array object is in array,', 'start': 783.198, 'duration': 4.884}, {'end': 792.425, 'text': 'which is going to allow us to search through an array and find out if an item is inside of it.', 'start': 788.082, 'duration': 4.343}, {'end': 795.547, 'text': "So let's go and create it since it isn't already built in.", 'start': 792.645, 'duration': 2.902}], 'summary': 'Adding a new method to the array build in object in js to search through an array and find an item.', 'duration': 27.738, 'max_score': 767.809, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4767809.jpg'}, {'end': 855.875, 'src': 'embed', 'start': 829.495, 'weight': 5, 'content': [{'end': 834.916, 'text': "And then otherwise, if we go through the entire loop and we don't find anything, we'll return false.", 'start': 829.495, 'duration': 5.421}, {'end': 840.066, 'text': "And that's how easy it is to add an additional function to a built-in object inside of JavaScript.", 'start': 835.404, 'duration': 4.662}, {'end': 843.428, 'text': "So let's come in here and verify that this actually is going to work.", 'start': 840.307, 'duration': 3.121}, {'end': 850.772, 'text': "Let's create a new array, throw in some sample values here, and then we'll be able to come in here and search it to see if it's true.", 'start': 843.488, 'duration': 7.284}, {'end': 855.875, 'text': 'So we could say something like 3 in array and find out if that actually comes out.', 'start': 850.892, 'duration': 4.983}], 'summary': 'Demonstrating how to add a function to a javascript built-in object to search an array for a specific value.', 'duration': 26.38, 'max_score': 829.495, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4829495.jpg'}, {'end': 909.175, 'src': 'embed', 'start': 880.249, 'weight': 6, 'content': [{'end': 885.611, 'text': 'However, you can make properties private by declaring them as variables inside of a constructor.', 'start': 880.249, 'duration': 5.362}, {'end': 887.331, 'text': "And I'm going to do that right here.", 'start': 885.911, 'duration': 1.42}, {'end': 892.532, 'text': "So let's say we have something called secret code and we want to protect our secret code,", 'start': 887.471, 'duration': 5.061}, {'end': 895.413, 'text': 'so nobody can come in there and alter it or get it or do anything.', 'start': 892.532, 'duration': 2.881}, {'end': 896.073, 'text': 'No problem.', 'start': 895.593, 'duration': 0.48}, {'end': 897.954, 'text': "We're just going to come in here and actually declare it.", 'start': 896.093, 'duration': 1.861}, {'end': 904.833, 'text': "So we'll go secret number is equal to 78, and I'll show you that it is indeed private and protected.", 'start': 898.034, 'duration': 6.799}, {'end': 909.175, 'text': "I'm gonna create a function, however, that is going to be able to interact with it.", 'start': 904.833, 'duration': 4.342}], 'summary': 'Private properties can be declared in a constructor to protect data; demonstrated with example of secret number set to 78.', 'duration': 28.926, 'max_score': 880.249, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4880249.jpg'}, {'end': 1019.229, 'src': 'heatmap', 'start': 981.328, 'weight': 0.72, 'content': [{'end': 985.571, 'text': "let's go and see if it did value a secret number and it comes back as undefined.", 'start': 981.328, 'duration': 4.243}, {'end': 988.132, 'text': "okay, so we weren't able to get the secret number that way.", 'start': 985.571, 'duration': 2.561}, {'end': 990.553, 'text': "let's try and see exactly what else we can do with it.", 'start': 988.132, 'duration': 2.421}, {'end': 993.675, 'text': 'well, we could just play nice and just call the function we created.', 'start': 990.553, 'duration': 3.122}, {'end': 997.357, 'text': "so let's just go is 70 the number?", 'start': 993.675, 'duration': 3.682}, {'end': 1003.901, 'text': "and we'll say secret and we'll say guess number, and the first number we're going to guess is 70,", 'start': 997.357, 'duration': 6.544}, {'end': 1007.488, 'text': "and you're going to see that it comes back with higher, that we need to guess a different number.", 'start': 1003.901, 'duration': 3.587}, {'end': 1014.633, 'text': "And indeed, if we come in and guess 78, that gives us the option to know that it's true, and you can see that you guessed it pops back.", 'start': 1007.928, 'duration': 6.705}, {'end': 1019.229, 'text': "Another thing that's interesting is, even if you go and add another function,", 'start': 1014.807, 'duration': 4.422}], 'summary': 'Trial and error to guess a secret number using functions and input values, achieving success with a guess of 78.', 'duration': 37.901, 'max_score': 981.328, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4981328.jpg'}], 'start': 485.987, 'title': 'Javascript prototypes, object manipulation, array search & private properties', 'summary': 'Covers usage of prototypes in javascript functions and objects, including adding properties and methods, manipulating objects, and checking property ownership. it also discusses creating a custom array search function in javascript and implementing private properties to protect data, with examples provided.', 'chapters': [{'end': 788.082, 'start': 485.987, 'title': 'Javascript prototypes and object manipulation', 'summary': 'Discusses the usage of prototypes in javascript functions and objects, including adding properties and methods, manipulating objects, and checking property ownership, providing examples and explanations along the way.', 'duration': 302.095, 'highlights': ['Objects can add properties and methods to an object using prototype Functions can add properties and methods to an object using prototype, allowing for easy manipulation and extension of objects.', 'Demonstration of adding properties and methods to a specific object The speaker demonstrates adding properties and methods to a specific object, Grover, including adding a sound and a make sound function.', 'Usage of for-in loop to list all properties of an object The for-in looping structure is used to list all properties of an object, demonstrating the ability to iterate through and access all properties.', 'Verification of property ownership using hasOwnProperty method The hasOwnProperty method is used to verify if a property belongs to the prototype part of an object or the object itself, providing a way to check property ownership.', 'Addition of methods to built-in JS objects using array prototype The speaker explains the ability to add methods to built-in JavaScript objects, using the example of adding a function to the array built-in object.']}, {'end': 1060.561, 'start': 788.082, 'title': 'Javascript array search & private properties', 'summary': 'Covers creating a custom array search function in javascript and implementing private properties to protect data, demonstrating how to add a custom function to an array in javascript and create private properties to protect data, with an example of custom array search function and private property protection.', 'duration': 272.479, 'highlights': ['Creating a custom array search function in JavaScript Demonstrates the process of creating a custom function to search for an item inside an array, using a for loop to iterate through the array and return true if the item is found, else false.', 'Implementing private properties to protect data in JavaScript Illustrates the use of private properties by declaring them as variables inside a constructor, preventing direct access or manipulation of the property values, and showcasing how even added functions cannot access the private property.']}], 'duration': 574.574, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE4485987.jpg', 'highlights': ['Objects can add properties and methods to an object using prototype', 'Demonstration of adding properties and methods to a specific object', 'Usage of for-in loop to list all properties of an object', 'Verification of property ownership using hasOwnProperty method', 'Addition of methods to built-in JS objects using array prototype', 'Creating a custom array search function in JavaScript', 'Implementing private properties to protect data in JavaScript']}, {'end': 1278.001, 'segs': [{'end': 1096.848, 'src': 'embed', 'start': 1060.681, 'weight': 0, 'content': [{'end': 1069.023, 'text': 'So there you can see that it is indeed possible to make private variables inside of objects in JavaScript and protect them, And yet in the same way,', 'start': 1060.681, 'duration': 8.342}, {'end': 1070.964, 'text': "we'll be able to come in here and work with them.", 'start': 1069.023, 'duration': 1.941}, {'end': 1073.566, 'text': 'And you can also see that inside of this function.', 'start': 1071.164, 'duration': 2.402}, {'end': 1080.051, 'text': "if I just go and throw a secret number inside of there instead of 78, you're also going to see that both of those also work.", 'start': 1073.566, 'duration': 6.485}, {'end': 1081.151, 'text': 'So pretty cool stuff.', 'start': 1080.271, 'duration': 0.88}, {'end': 1084.814, 'text': "Now let's take a look at a bunch of different ways to create getters and setters.", 'start': 1081.251, 'duration': 3.563}, {'end': 1089.377, 'text': "And while doing so, I'm going to teach you a whole bunch of other things about object-oriented JavaScript.", 'start': 1085.154, 'duration': 4.223}, {'end': 1096.848, 'text': "Now getters and setters are going to both protect your data, so, for example, they couldn't enter a number in for a name or something like that,", 'start': 1090.066, 'duration': 6.782}], 'summary': 'Javascript allows creating private variables and using getters and setters to protect data.', 'duration': 36.167, 'max_score': 1060.681, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41060681.jpg'}, {'end': 1137.13, 'src': 'embed', 'start': 1112.273, 'weight': 3, 'content': [{'end': 1118.037, 'text': "So what I created here is just a basic old address object and I'm going to create a getter for it.", 'start': 1112.273, 'duration': 5.764}, {'end': 1126.364, 'text': "So let's say get address and what it's going to do is it's going to combine all of the data that I have there into one line.", 'start': 1118.217, 'duration': 8.147}, {'end': 1130.847, 'text': "So it's going to come in and say return and just put in the street.", 'start': 1126.464, 'duration': 4.383}, {'end': 1137.13, 'text': "and it's also going to go and divide all this stuff up with commas, and there you can see.", 'start': 1131.567, 'duration': 5.563}], 'summary': 'Created a getter for a basic address object to combine data into one line.', 'duration': 24.857, 'max_score': 1112.273, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41112273.jpg'}, {'end': 1170.087, 'src': 'embed', 'start': 1148.115, 'weight': 4, 'content': [{'end': 1156.199, 'text': "and now what I'm going to do is I'm going to allow the user to send in three values that I'm then going to split up and stick them into their separate pieces and then,", 'start': 1148.115, 'duration': 8.084}, {'end': 1158.421, 'text': "of course, they'll still be able to be accessed using.", 'start': 1156.199, 'duration': 2.222}, {'end': 1158.981, 'text': 'get address.', 'start': 1158.421, 'duration': 0.56}, {'end': 1160.922, 'text': 'this is how you create a setter.', 'start': 1159.441, 'duration': 1.481}, {'end': 1170.087, 'text': "so we'll go set address and they'll pass in an entire address and of course i can't always guarantee they're going to pass in the data right and i should check it,", 'start': 1160.922, 'duration': 9.165}], 'summary': 'Creating a setter to split and store three user input values for address.', 'duration': 21.972, 'max_score': 1148.115, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41148115.jpg'}], 'start': 1060.681, 'title': 'Javascript object-oriented getters and setters', 'summary': 'Demonstrates how to create private variables in javascript objects and explores various ways to create getters and setters, emphasizing their role in protecting data and providing useful ways to set values. it also showcases the implementation of a getter and setter for an address object, allowing the manipulation of street, city, and state data.', 'chapters': [{'end': 1112.073, 'start': 1060.681, 'title': 'Javascript object-oriented getters and setters', 'summary': 'Demonstrates how to create private variables in javascript objects, and then proceeds to explore various ways to create getters and setters, emphasizing their role in protecting data and providing useful ways to set values in an object-oriented javascript context.', 'duration': 51.392, 'highlights': ['The chapter demonstrates how to create private variables in JavaScript objects, allowing for the protection of data while still being able to work with them.', 'The chapter explores various ways to create getters and setters, emphasizing their role in protecting data and providing useful ways to set values in an object-oriented JavaScript context.', 'Getters and setters in JavaScript are highlighted as not only protecting data from invalid entries but also providing useful ways to set values, offering multiple implementation methods.']}, {'end': 1278.001, 'start': 1112.273, 'title': 'Creating getter and setter for address object', 'summary': 'Demonstrates the implementation of a getter and setter for an address object, allowing the combination and manipulation of street, city, and state data, with the output showcasing the functionality and formatting of the address object.', 'duration': 165.728, 'highlights': ["Implementation of getter to combine street, city, and state data into one line The getter function 'get address' is created to retrieve and combine the street, city, and state data into one line, separated by commas.", "Creation of a setter to handle the input of an entire address The setter 'set address' is implemented to receive and split an entire address into its individual components, allowing for the assignment of street, city, and state based on the input.", "Demonstration of accessing and outputting the address data The chapter illustrates the usage of the getter function 'get address' to retrieve and output the combined address data, as well as the ability to access and print specific components of the address."]}], 'duration': 217.32, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41060681.jpg', 'highlights': ['The chapter explores various ways to create getters and setters, emphasizing their role in protecting data and providing useful ways to set values in an object-oriented JavaScript context.', 'The chapter demonstrates how to create private variables in JavaScript objects, allowing for the protection of data while still being able to work with them.', 'Getters and setters in JavaScript are highlighted as not only protecting data from invalid entries but also providing useful ways to set values, offering multiple implementation methods.', "Implementation of getter to combine street, city, and state data into one line The getter function 'get address' is created to retrieve and combine the street, city, and state data into one line, separated by commas.", "Creation of a setter to handle the input of an entire address The setter 'set address' is implemented to receive and split an entire address into its individual components, allowing for the assignment of street, city, and state based on the input.", "Demonstration of accessing and outputting the address data The chapter illustrates the usage of the getter function 'get address' to retrieve and output the combined address data, as well as the ability to access and print specific components of the address."]}, {'end': 1781.665, 'segs': [{'end': 1309.482, 'src': 'embed', 'start': 1278.142, 'weight': 4, 'content': [{'end': 1281.024, 'text': "So there's one demonstration on how to use getters and setters.", 'start': 1278.142, 'duration': 2.882}, {'end': 1284.928, 'text': "Now I'm going to show you a deprecated way of creators and getters and setters.", 'start': 1281.084, 'duration': 3.844}, {'end': 1285.829, 'text': 'It still works.', 'start': 1285.008, 'duration': 0.821}, {'end': 1291.332, 'text': "in all the different browsers, however, and it is very likely that you're going to see it eventually.", 'start': 1286.229, 'duration': 5.103}, {'end': 1298.816, 'text': "so now we're gonna create a constructor function and I'm gonna call this coordinates, and I'm gonna create a couple more getters and setters here.", 'start': 1291.332, 'duration': 7.484}, {'end': 1304.999, 'text': "I'm gonna show you some things that are still used a lot and you should know about, but I'm also, at the same time,", 'start': 1298.816, 'duration': 6.183}, {'end': 1309.482, 'text': 'going to show you the up-to-date way of using getters and setters.', 'start': 1304.999, 'duration': 4.483}], 'summary': 'Demonstration on using getters and setters, including deprecated and up-to-date methods.', 'duration': 31.34, 'max_score': 1278.142, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41278142.jpg'}, {'end': 1333.452, 'src': 'embed', 'start': 1309.482, 'weight': 1, 'content': [{'end': 1317.184, 'text': "actually, I'm gonna show you how to go and use getters and setters in JavaScript in a way that's not even implemented yet on all browsers,", 'start': 1309.482, 'duration': 7.702}, {'end': 1318.425, 'text': 'but soon will be.', 'start': 1317.184, 'duration': 1.241}, {'end': 1324.288, 'text': "and now what we're going to do is we're going to define the getter and setter for this now that we have latitude and longitude inside of there,", 'start': 1318.425, 'duration': 5.863}, {'end': 1333.452, 'text': "and how we would do that is go object dot two underscores and define getter two underscores, and then we're going to call call.", 'start': 1324.288, 'duration': 9.164}], 'summary': 'Teaching how to use getters and setters in javascript for latitude and longitude.', 'duration': 23.97, 'max_score': 1309.482, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41309482.jpg'}, {'end': 1462, 'src': 'embed', 'start': 1432.947, 'weight': 0, 'content': [{'end': 1437.109, 'text': 'And there you go, you just defined getters and setters for an object constructor.', 'start': 1432.947, 'duration': 4.162}, {'end': 1442.593, 'text': 'And we can come in here and test it as equal to create a new coordinates object.', 'start': 1437.61, 'duration': 4.983}, {'end': 1449.677, 'text': "And we'll be able to call the setter by going test coordinates and set chords like this.", 'start': 1443.053, 'duration': 6.624}, {'end': 1452.618, 'text': "Again, we're not going to use the parentheses.", 'start': 1449.957, 'duration': 2.661}, {'end': 1457.301, 'text': 'And then we can come in and just throw in a latitude and a longitude.', 'start': 1452.918, 'duration': 4.383}, {'end': 1462, 'text': "into this and then of course we'll be able to come in and output some information.", 'start': 1457.739, 'duration': 4.261}], 'summary': 'Defined getters and setters for an object constructor, tested with new coordinates object, and set latitude and longitude.', 'duration': 29.053, 'max_score': 1432.947, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41432947.jpg'}, {'end': 1508.303, 'src': 'embed', 'start': 1478.586, 'weight': 2, 'content': [{'end': 1482.548, 'text': "Now I'm going to show you how to create getters and setters using something called define property.", 'start': 1478.586, 'duration': 3.962}, {'end': 1489.672, 'text': "Now I went ahead and created a point constructor function and I'm going to show you a bunch of different ways to work with this.", 'start': 1482.828, 'duration': 6.844}, {'end': 1495.936, 'text': "Let's say we want to come in and add a getter and a setter using something called define property.", 'start': 1490.413, 'duration': 5.523}, {'end': 1503.901, 'text': 'How you would do that is reference object Which by the way is the object that every single object inside of JavaScript is inherited from.', 'start': 1495.996, 'duration': 7.905}, {'end': 1508.303, 'text': 'So every single function inside of object is available to everything else.', 'start': 1503.981, 'duration': 4.322}], 'summary': 'Creating getters and setters using define property in javascript.', 'duration': 29.717, 'max_score': 1478.586, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41478586.jpg'}, {'end': 1627.098, 'src': 'embed', 'start': 1605.834, 'weight': 3, 'content': [{'end': 1614.64, 'text': "position and then we'll just go a point like that and then how we will get a hold of the getters is to just go point position once again,", 'start': 1605.834, 'duration': 8.806}, {'end': 1618.771, 'text': 'same exact thing and close that off, And there you can see exactly how that works.', 'start': 1614.64, 'duration': 4.131}, {'end': 1622.694, 'text': 'Okay, so I showed you a bunch of different ways to use getters and setters.', 'start': 1619.051, 'duration': 3.643}, {'end': 1627.098, 'text': "Now I'll show you the pretty much most up-to-date way of creating getters and setters.", 'start': 1622.734, 'duration': 4.364}], 'summary': 'Demonstrated various ways to use getters and setters, followed by the most up-to-date method.', 'duration': 21.264, 'max_score': 1605.834, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41605834.jpg'}], 'start': 1278.142, 'title': 'Using getters and setters in javascript', 'summary': "Demonstrates the usage of getters and setters in javascript, including deprecated and up-to-date methods, with a focus on creating a constructor function and defining getters and setters for latitude and longitude coordinates. it also explains various methods for defining getters and setters in javascript, including using object constructor, 'define property' and the ecma script 5.1 version, with examples and quantifiable data demonstrating the functionality of each method.", 'chapters': [{'end': 1431.561, 'start': 1278.142, 'title': 'Using getters and setters in javascript', 'summary': 'Demonstrates the usage of getters and setters in javascript, including deprecated and up-to-date methods, with a focus on creating a constructor function and defining getters and setters for latitude and longitude coordinates.', 'duration': 153.419, 'highlights': ['The chapter explains the deprecated and up-to-date methods of using getters and setters in JavaScript, highlighting the importance of understanding both approaches.', 'The demonstration showcases the process of creating a constructor function and defining getters and setters for latitude and longitude coordinates, emphasizing its relevance in practical coding scenarios.', 'The detailed explanation of defining getter and setter functions for latitude and longitude coordinates provides a comprehensive understanding of the process, emphasizing the practical application of these concepts in JavaScript coding.']}, {'end': 1781.665, 'start': 1432.947, 'title': 'Creating getters and setters in javascript', 'summary': "Explains various methods for defining getters and setters in javascript, including using object constructor, 'define property' and the ecma script 5.1 version, with examples and quantifiable data demonstrating the functionality of each method.", 'duration': 348.718, 'highlights': ["The chapter explains various methods for defining getters and setters in JavaScript, including using object constructor, 'define property' and the ECMA script 5.1 version. It covers different techniques for defining getters and setters, showcasing the versatility of JavaScript in handling object properties.", 'The chapter provides examples and quantifiable data demonstrating the functionality of each method. It demonstrates the usage of each method with examples, such as creating and manipulating objects, calling setters and getters, and outputting relevant information.']}], 'duration': 503.523, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41278142.jpg', 'highlights': ['The demonstration showcases the process of creating a constructor function and defining getters and setters for latitude and longitude coordinates, emphasizing its relevance in practical coding scenarios.', 'The detailed explanation of defining getter and setter functions for latitude and longitude coordinates provides a comprehensive understanding of the process, emphasizing the practical application of these concepts in JavaScript coding.', "The chapter explains various methods for defining getters and setters in JavaScript, including using object constructor, 'define property' and the ECMA script 5.1 version. It covers different techniques for defining getters and setters, showcasing the versatility of JavaScript in handling object properties.", 'The chapter provides examples and quantifiable data demonstrating the functionality of each method. It demonstrates the usage of each method with examples, such as creating and manipulating objects, calling setters and getters, and outputting relevant information.', 'The chapter explains the deprecated and up-to-date methods of using getters and setters in JavaScript, highlighting the importance of understanding both approaches.']}, {'end': 2504.357, 'segs': [{'end': 1807.517, 'src': 'embed', 'start': 1782.025, 'weight': 0, 'content': [{'end': 1789.848, 'text': 'Now to understand how inheritance works inside of JavaScript, you have to understand exactly how prototype works inside of JavaScript.', 'start': 1782.025, 'duration': 7.823}, {'end': 1795.129, 'text': "Now, whenever you call for a function, let's say it's bark inside of dog.", 'start': 1790.108, 'duration': 5.021}, {'end': 1799.931, 'text': "it's going to first check the dog object and find bark and then it's going to execute it.", 'start': 1795.129, 'duration': 4.802}, {'end': 1807.517, 'text': "Let's say, however, you have a variable, name, that is stored in the prototype object, which is also inside a dog.", 'start': 1800.251, 'duration': 7.266}], 'summary': 'Javascript inheritance relies on prototype to access methods and variables, enabling efficient code execution.', 'duration': 25.492, 'max_score': 1782.025, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41782025.jpg'}, {'end': 2004.395, 'src': 'heatmap', 'start': 1923.408, 'weight': 0.969, 'content': [{'end': 1926.93, 'text': 'Now, if I want to overwrite the prototype for canine and wolf,', 'start': 1923.408, 'duration': 3.522}, {'end': 1934.555, 'text': "what I'm going to do is just go canine is and then go prototype and assign it to the animal object.", 'start': 1926.93, 'duration': 7.625}, {'end': 1938.362, 'text': 'Okay, so now the prototype is actually an animal object.', 'start': 1934.94, 'duration': 3.422}, {'end': 1945.045, 'text': 'Going to also do the same thing for wolf, and this is going to give us the ability to come in here and create multiple.', 'start': 1938.622, 'duration': 6.423}, {'end': 1948.107, 'text': "well, it's not multiple inheritance, but it's different levels of inheritance.", 'start': 1945.045, 'duration': 3.062}, {'end': 1953.23, 'text': "And in this situation, it's going to get the canine object assigned to that prototype.", 'start': 1948.507, 'duration': 4.723}, {'end': 1961.434, 'text': 'One thing to remember, however, is after you overwrite a prototype, its constructor is actually going to point to the main object object,', 'start': 1953.53, 'duration': 7.904}, {'end': 1963.515, 'text': "so you're going to have to reset the constructor for it.", 'start': 1961.434, 'duration': 2.081}, {'end': 1966.617, 'text': "You don't really need to worry about it, much more than just to know.", 'start': 1963.535, 'duration': 3.082}, {'end': 1973.18, 'text': 'to do this canine prototype and then follow that up with constructor is equal to canine okay?', 'start': 1966.617, 'duration': 6.563}, {'end': 1977.422, 'text': "So make sure that you do that and then you're going to do exactly the same thing with wolf.", 'start': 1973.48, 'duration': 3.942}, {'end': 1982.51, 'text': 'prototype and then go constructor, this is equal to wolf.', 'start': 1977.964, 'duration': 4.546}, {'end': 1983.131, 'text': 'so there you go.', 'start': 1982.51, 'duration': 0.621}, {'end': 1991.162, 'text': "we just assigned the animal objects and all the methods and variables inside of it to the canine prototype, so we'll be able to access them that way.", 'start': 1983.131, 'duration': 8.031}, {'end': 1997.249, 'text': "now we'll be able to come in and say something like arctic wolf is equal to new wolf,", 'start': 1991.162, 'duration': 6.087}, {'end': 2004.395, 'text': "and I'll show you how to get a hold of those parent or animal methods and fire those instead, even if you have the same name inside of them.", 'start': 1997.249, 'duration': 7.146}], 'summary': 'Overwriting prototypes for canine and wolf enables multiple levels of inheritance and access to parent methods and variables.', 'duration': 80.987, 'max_score': 1923.408, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41923408.jpg'}, {'end': 1973.18, 'src': 'embed', 'start': 1945.045, 'weight': 3, 'content': [{'end': 1948.107, 'text': "well, it's not multiple inheritance, but it's different levels of inheritance.", 'start': 1945.045, 'duration': 3.062}, {'end': 1953.23, 'text': "And in this situation, it's going to get the canine object assigned to that prototype.", 'start': 1948.507, 'duration': 4.723}, {'end': 1961.434, 'text': 'One thing to remember, however, is after you overwrite a prototype, its constructor is actually going to point to the main object object,', 'start': 1953.53, 'duration': 7.904}, {'end': 1963.515, 'text': "so you're going to have to reset the constructor for it.", 'start': 1961.434, 'duration': 2.081}, {'end': 1966.617, 'text': "You don't really need to worry about it, much more than just to know.", 'start': 1963.535, 'duration': 3.082}, {'end': 1973.18, 'text': 'to do this canine prototype and then follow that up with constructor is equal to canine okay?', 'start': 1966.617, 'duration': 6.563}], 'summary': 'Different levels of inheritance, resetting constructor after overwriting prototype.', 'duration': 28.135, 'max_score': 1945.045, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41945045.jpg'}, {'end': 2073.469, 'src': 'embed', 'start': 2046.615, 'weight': 5, 'content': [{'end': 2052.717, 'text': "It's going to jump from the wolf to the canine, the whole way up to the animal object, and use toString.", 'start': 2046.615, 'duration': 6.102}, {'end': 2057.8, 'text': "However, since name is inside of Wolf, it's going to use the proper name right here.", 'start': 2053.178, 'duration': 4.622}, {'end': 2058.54, 'text': 'So pretty cool.', 'start': 2058.02, 'duration': 0.52}, {'end': 2061.482, 'text': 'And also sort of a demonstration of polymorphism.', 'start': 2058.94, 'duration': 2.542}, {'end': 2067.806, 'text': "We're also, however, going to be able to check if wolf is an instance of animal.", 'start': 2061.661, 'duration': 6.145}, {'end': 2073.469, 'text': "And of course how we're going to do that is go arctic wolf instance of animal.", 'start': 2068.146, 'duration': 5.323}], 'summary': 'Demonstration of polymorphism using wolf and canine instances.', 'duration': 26.854, 'max_score': 2046.615, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42046615.jpg'}, {'end': 2139.183, 'src': 'embed', 'start': 2114.505, 'weight': 6, 'content': [{'end': 2124.67, 'text': 'and then reference sound which is only inside of the animal object, and then we could also come in and define sound differently using prototype.', 'start': 2114.505, 'duration': 10.165}, {'end': 2133.877, 'text': "it's not going to mess up anything, so we could design a different sound for our canine and also come in and define a different sound for our wolf,", 'start': 2124.67, 'duration': 9.207}, {'end': 2134.518, 'text': 'just like that.', 'start': 2133.877, 'duration': 0.641}, {'end': 2139.183, 'text': "So we're not being hampered in any way by assigning those objects to the prototype.", 'start': 2134.818, 'duration': 4.365}], 'summary': 'Objects can have different sounds defined using prototype without hampering assignments.', 'duration': 24.678, 'max_score': 2114.505, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42114505.jpg'}, {'end': 2310.202, 'src': 'embed', 'start': 2283.748, 'weight': 7, 'content': [{'end': 2292.295, 'text': 'so that sort of handles assigning the prototypes as well as assigning the constructor and making sure that everything works well for there.', 'start': 2283.748, 'duration': 8.547}, {'end': 2294.777, 'text': "and the reason why this is important is, let's say,", 'start': 2292.295, 'duration': 2.482}, {'end': 2304.141, 'text': 'we create another function called deer and we can say this name is equal to deer and this sound is equal to snort.', 'start': 2294.777, 'duration': 9.364}, {'end': 2310.202, 'text': "we'll then be able to very quickly assign deer to animal by just going extend,", 'start': 2304.141, 'duration': 6.061}], 'summary': "Prototype inheritance allows quick assignment of functions like 'deer' to 'animal' using 'extend'", 'duration': 26.454, 'max_score': 2283.748, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42283748.jpg'}, {'end': 2375.169, 'src': 'embed', 'start': 2349.358, 'weight': 2, 'content': [{'end': 2354.661, 'text': "So there's a bunch of different ways to streamline the process of inheritance inside of JavaScript.", 'start': 2349.358, 'duration': 5.303}, {'end': 2359.985, 'text': "Now I'm going to show you how to call parent methods or superclasses or whatever you want to refer to them as.", 'start': 2354.681, 'duration': 5.304}, {'end': 2368.743, 'text': "okay. so i created a vehicle object here and now i'm going to assign some functions to this parent object that we're going to be calling here in a second.", 'start': 2360.836, 'duration': 7.907}, {'end': 2375.169, 'text': 'so just go, prototype again is equal to, and then we can define a whole bunch of different functions here.', 'start': 2368.743, 'duration': 6.426}], 'summary': 'Streamline javascript inheritance with parent method calls and prototype functions.', 'duration': 25.811, 'max_score': 2349.358, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42349358.jpg'}], 'start': 1782.025, 'title': 'Javascript inheritance and prototypes', 'summary': 'Explores javascript inheritance and prototypes, covering the creation of objects, overwriting prototypes, accessing parent methods, demonstrating polymorphism, checking instance of objects, adding variables and functions to prototypes, and optimizing inheritance with an intermediate function.', 'chapters': [{'end': 1898.704, 'start': 1782.025, 'title': 'Javascript inheritance basics', 'summary': 'Explains javascript inheritance, demonstrating how objects can inherit properties from other objects using prototypes and how to overwrite functions, with a focus on the dog and animal objects.', 'duration': 116.679, 'highlights': ['JavaScript inheritance is based on prototype chaining, where objects can inherit properties from other objects. Explains the concept of inheritance and prototype chaining in JavaScript.', 'Demonstrates how to set a prototype equal to another object to inherit its properties. Illustrates setting the prototype of one object to another to inherit its properties.', 'Shows how to overwrite functions in JavaScript objects. Demonstrates the process of overwriting functions in JavaScript objects.']}, {'end': 2504.357, 'start': 1899.167, 'title': 'Javascript inheritance and prototypes', 'summary': 'Covers javascript inheritance and prototypes, demonstrating the creation of objects, overwriting prototypes, accessing parent methods, demonstrating polymorphism, checking instance of objects, adding variables and functions to prototypes, and optimizing inheritance with an intermediate function.', 'duration': 605.19, 'highlights': ['Demonstrates overwriting prototypes for different levels of inheritance and the need to reset the constructor after overwriting. The speaker explains the process of overwriting prototypes for different levels of inheritance and emphasizes the need to reset the constructor to avoid pointing to the main object, with an example of overwriting prototypes for the canine and wolf objects.', 'Illustrates accessing parent methods and demonstrating polymorphism in JavaScript. The speaker demonstrates how to access parent methods and polymorphism in JavaScript, using the example of calling the toString method in the arctic wolf object, which is inherited from the animal object.', 'Explains the process of checking if an object is an instance of another object. The speaker explains how to check if an object is an instance of another object, using the example of checking if the wolf object is an instance of the animal object, which returns true.', 'Shows how to add different variables and functions into prototypes without hampering the existing inheritance. The speaker demonstrates the addition of new variables and functions into prototypes without affecting the existing inheritance, using the example of adding a sound property to the canine and wolf objects without hampering the prototype assignment.', "Demonstrates an intermediate function to optimize inheritance and streamline the process of assigning prototypes. The speaker introduces an intermediate function 'extend' to optimize inheritance and streamline the process of assigning prototypes, showcasing the example of using the 'extend' function to quickly assign the deer object to the animal object."]}], 'duration': 722.332, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE41782025.jpg', 'highlights': ['JavaScript inheritance is based on prototype chaining, where objects can inherit properties from other objects. Explains the concept of inheritance and prototype chaining in JavaScript.', 'Demonstrates how to set a prototype equal to another object to inherit its properties. Illustrates setting the prototype of one object to another to inherit its properties.', 'Shows how to overwrite functions in JavaScript objects. Demonstrates the process of overwriting functions in JavaScript objects.', 'Demonstrates overwriting prototypes for different levels of inheritance and the need to reset the constructor after overwriting. The speaker explains the process of overwriting prototypes for different levels of inheritance and emphasizes the need to reset the constructor to avoid pointing to the main object, with an example of overwriting prototypes for the canine and wolf objects.', 'Illustrates accessing parent methods and demonstrating polymorphism in JavaScript. The speaker demonstrates how to access parent methods and polymorphism in JavaScript, using the example of calling the toString method in the arctic wolf object, which is inherited from the animal object.', 'Explains the process of checking if an object is an instance of another object. The speaker explains how to check if an object is an instance of another object, using the example of checking if the wolf object is an instance of the animal object, which returns true.', 'Shows how to add different variables and functions into prototypes without hampering the existing inheritance. The speaker demonstrates the addition of new variables and functions into prototypes without affecting the existing inheritance, using the example of adding a sound property to the canine and wolf objects without hampering the prototype assignment.', "Demonstrates an intermediate function to optimize inheritance and streamline the process of assigning prototypes. The speaker introduces an intermediate function 'extend' to optimize inheritance and streamline the process of assigning prototypes, showcasing the example of using the 'extend' function to quickly assign the deer object to the animal object."]}, {'end': 3158.823, 'segs': [{'end': 2568.348, 'src': 'embed', 'start': 2536.84, 'weight': 0, 'content': [{'end': 2543.048, 'text': 'Now the very first thing I want to talk about is how method notation in object property definitions is going to be changing.', 'start': 2536.84, 'duration': 6.208}, {'end': 2547.014, 'text': 'This is the way that we currently do it inside of JavaScript,', 'start': 2543.469, 'duration': 3.545}, {'end': 2553.282, 'text': "and what I'm going to show you is the EC6 way of doing things and how that is going to help.", 'start': 2547.014, 'duration': 6.268}, {'end': 2555.983, 'text': "So I'm going to define everything exactly the same way.", 'start': 2553.522, 'duration': 2.461}, {'end': 2557.544, 'text': 'Add stuff is equal to.', 'start': 2556.303, 'duration': 1.241}, {'end': 2559.244, 'text': "And this is the part that's going to change.", 'start': 2557.564, 'duration': 1.68}, {'end': 2568.348, 'text': "We're now going to be able to come in here and define methods with sum num1 and num2 in a way that is more common in other different languages.", 'start': 2559.304, 'duration': 9.044}], 'summary': 'Ec6 introduces a new method notation for defining object property methods in javascript.', 'duration': 31.508, 'max_score': 2536.84, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42536840.jpg'}, {'end': 2607.167, 'src': 'embed', 'start': 2579.734, 'weight': 4, 'content': [{'end': 2584.036, 'text': 'ScratchJS is going to allow us to see what the future of JavaScript is going to look like.', 'start': 2579.734, 'duration': 4.302}, {'end': 2586.277, 'text': 'And I just copied and pasted that inside of there.', 'start': 2584.176, 'duration': 2.101}, {'end': 2591.38, 'text': 'And if I click on Run, you can see that 1 plus 2 is equal to 3 works just like that.', 'start': 2586.297, 'duration': 5.083}, {'end': 2595.843, 'text': "So you can see there we don't need to put the functions in or the colons or anything.", 'start': 2591.4, 'duration': 4.443}, {'end': 2599.285, 'text': 'We can write in a style that is more common in other programming languages.', 'start': 2595.883, 'duration': 3.402}, {'end': 2602.026, 'text': "Now let's take a look at how classes are going to change.", 'start': 2599.685, 'duration': 2.341}, {'end': 2607.167, 'text': "Now previously or currently classes don't exist inside a JavaScript but they soon will.", 'start': 2602.166, 'duration': 5.001}], 'summary': 'Scratchjs demonstrates future javascript features like simplified syntax and upcoming classes.', 'duration': 27.433, 'max_score': 2579.734, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42579734.jpg'}, {'end': 2714.318, 'src': 'embed', 'start': 2686.168, 'weight': 1, 'content': [{'end': 2691.89, 'text': "Now let's take a couple other looks at other specific object oriented stuff with EC6.", 'start': 2686.168, 'duration': 5.722}, {'end': 2697.112, 'text': "We're going to come in here and create an animal object using a class.", 'start': 2691.97, 'duration': 5.142}, {'end': 2699.413, 'text': 'Go and create a constructor.', 'start': 2697.372, 'duration': 2.041}, {'end': 2701.994, 'text': "Of course we're going to assign the value to that.", 'start': 2699.433, 'duration': 2.561}, {'end': 2706.416, 'text': 'We can then come in and go to string and return animal object.', 'start': 2702.154, 'duration': 4.262}, {'end': 2714.318, 'text': "is named this name and we're gonna be able to create static functions as well and we'll be able to just go in and type static,", 'start': 2706.816, 'duration': 7.502}], 'summary': 'Creating an animal object using a class, with static functions in ec6.', 'duration': 28.15, 'max_score': 2686.168, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42686168.jpg'}, {'end': 2889.573, 'src': 'embed', 'start': 2858.047, 'weight': 2, 'content': [{'end': 2861.349, 'text': "Okay, so now I'm going to cover some design patterns in JavaScript.", 'start': 2858.047, 'duration': 3.302}, {'end': 2864.851, 'text': "So I'm going to cover four of the most common, starting with the singleton pattern.", 'start': 2861.549, 'duration': 3.302}, {'end': 2871.856, 'text': "And singletons are basically used whenever you know that you'll only ever want one object to be created of a specific type.", 'start': 2865.072, 'duration': 6.784}, {'end': 2875.798, 'text': "So let's say we want to create a game character that's going to have fixed statistics.", 'start': 2871.896, 'duration': 3.902}, {'end': 2883.083, 'text': "I'm going to come in and define an object called hero, and it's going to be given a name when it's created.", 'start': 2876.179, 'duration': 6.904}, {'end': 2889.573, 'text': "Now what I'm going to do here before I create a new hero object is I'm going to check if the object already exists.", 'start': 2883.363, 'duration': 6.21}], 'summary': 'Covering four common design patterns in javascript, starting with the singleton pattern for creating a single object of a specific type.', 'duration': 31.526, 'max_score': 2858.047, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42858047.jpg'}, {'end': 2985.083, 'src': 'heatmap', 'start': 2944.782, 'weight': 0.715, 'content': [{'end': 2945.623, 'text': 'And get the name.', 'start': 2944.782, 'duration': 0.841}, {'end': 2948.784, 'text': 'And then just to verify that this cannot be changed.', 'start': 2945.883, 'duration': 2.901}, {'end': 2951.726, 'text': "We're going to come in and we're going to create a new hero.", 'start': 2948.904, 'duration': 2.822}, {'end': 2953.567, 'text': "And let's call this Paul Hero.", 'start': 2952.006, 'duration': 1.561}, {'end': 2956.969, 'text': "Because remember we're making a game in which we're only going to have one hero.", 'start': 2953.587, 'duration': 3.382}, {'end': 2958.81, 'text': "So it doesn't make sense to have two.", 'start': 2957.089, 'duration': 1.721}, {'end': 2960.611, 'text': "And we're going to verify that this works.", 'start': 2959.01, 'duration': 1.601}, {'end': 2962.172, 'text': "And then we'll call Paul Hero.", 'start': 2960.971, 'duration': 1.201}, {'end': 2965.814, 'text': 'And if we execute that you can see that the name stays as Derek.', 'start': 2962.392, 'duration': 3.422}, {'end': 2968.976, 'text': 'So we can only ever create one hero type.', 'start': 2965.854, 'duration': 3.122}, {'end': 2972.087, 'text': "And that's a rough overview of how the singleton pattern works.", 'start': 2969.264, 'duration': 2.823}, {'end': 2974.15, 'text': "Now let's take a look at factory patterns.", 'start': 2972.368, 'duration': 1.782}, {'end': 2978.155, 'text': 'Now a factory pattern can be used to generate different objects on request.', 'start': 2974.23, 'duration': 3.925}, {'end': 2980.397, 'text': "So let's stick with our game analogy here.", 'start': 2978.395, 'duration': 2.002}, {'end': 2985.083, 'text': "And let's say that we want to generate weapons for our different heroes.", 'start': 2980.718, 'duration': 4.365}], 'summary': 'Demonstrating the singleton pattern and introducing factory patterns for generating different objects in a game.', 'duration': 40.301, 'max_score': 2944.782, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42944782.jpg'}], 'start': 2504.357, 'title': 'Javascript ecmascript 6 features and object-oriented programming', 'summary': 'Discusses changes in javascript in ecmascript version 6, including method notation and classes, with examples and impact. it also covers object-oriented classes, inheritance, static functions, and design patterns like singleton and factory patterns in javascript.', 'chapters': [{'end': 2686.148, 'start': 2504.357, 'title': 'Javascript ecmascript 6 features', 'summary': 'Discusses how javascript will change in ecmascript version 6, including method notation in object property definitions and the introduction of classes, with examples of how these changes will be implemented and their impact on javascript development.', 'duration': 181.791, 'highlights': ['ECMAScript version 6 introduces changes in method notation and the introduction of classes in JavaScript. The tutorial explains the changes in method notation in object property definitions and the introduction of classes in JavaScript, providing examples of the new syntax and demonstrating their impact on JavaScript development.', 'Demonstration of the new method notation and class implementation in ECMAScript version 6. The tutorial provides demonstrations of the new method notation and class implementation in ECMAScript version 6, including examples of how to define methods and create classes, showcasing the upcoming changes in JavaScript.', 'Execution of code in ScratchJS to illustrate the future of JavaScript in ECMAScript version 6. The tutorial utilizes ScratchJS to execute code and visualize the future changes in JavaScript, emphasizing the practical implementation and functionality of the upcoming ECMAScript version 6 features.']}, {'end': 3158.823, 'start': 2686.168, 'title': 'Object-oriented programming in ec6', 'summary': 'Covers creating and using object-oriented classes in ec6 to generate animal objects, demonstrate inheritance and static functions, and implement design patterns like singleton and factory patterns in javascript.', 'duration': 472.655, 'highlights': ['Creating and using object-oriented classes in EC6 Demonstrates the process of creating an animal object using a class in EC6, including defining a constructor, using static functions, and demonstrating inheritance.', 'Implementing design patterns like singleton and factory patterns in JavaScript Explains the concept of singleton patterns, demonstrating the creation of a single hero object, and also covers factory patterns for generating different objects based on requests, using the example of creating weapons for game characters.']}], 'duration': 654.466, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE42504357.jpg', 'highlights': ['Demonstration of the new method notation and class implementation in ECMAScript version 6. The tutorial provides demonstrations of the new method notation and class implementation in ECMAScript version 6, including examples of how to define methods and create classes, showcasing the upcoming changes in JavaScript.', 'Creating and using object-oriented classes in EC6 Demonstrates the process of creating an animal object using a class in EC6, including defining a constructor, using static functions, and demonstrating inheritance.', 'Implementing design patterns like singleton and factory patterns in JavaScript Explains the concept of singleton patterns, demonstrating the creation of a single hero object, and also covers factory patterns for generating different objects based on requests, using the example of creating weapons for game characters.', 'ECMAScript version 6 introduces changes in method notation and the introduction of classes in JavaScript. The tutorial explains the changes in method notation in object property definitions and the introduction of classes in JavaScript, providing examples of the new syntax and demonstrating their impact on JavaScript development.', 'Execution of code in ScratchJS to illustrate the future of JavaScript in ECMAScript version 6. The tutorial utilizes ScratchJS to execute code and visualize the future changes in JavaScript, emphasizing the practical implementation and functionality of the upcoming ECMAScript version 6 features.']}, {'end': 3634.077, 'segs': [{'end': 3211.908, 'src': 'heatmap', 'start': 3159.064, 'weight': 5, 'content': [{'end': 3161.425, 'text': "And let's go and print out some information about my weapon.", 'start': 3159.064, 'duration': 2.361}, {'end': 3166.968, 'text': 'And if I reload it, you can see sword of type psi crafted from dark iron prints out on the screen.', 'start': 3161.605, 'duration': 5.363}, {'end': 3173.31, 'text': "So there's a way of using factory patterns to dynamically create objects inside of JavaScript.", 'start': 3167.168, 'duration': 6.142}, {'end': 3175.43, 'text': "Now let's take a look at the decorator pattern.", 'start': 3173.43, 'duration': 2}, {'end': 3179.751, 'text': 'Now the decorator pattern is going to allow us to alter an object at runtime.', 'start': 3175.71, 'duration': 4.041}, {'end': 3182.032, 'text': "So let's go and create a pizza.", 'start': 3179.851, 'duration': 2.181}, {'end': 3190.974, 'text': 'And basically, the main goal here is to go and calculate changes in prices based off of different toppings that we add to our pizza.', 'start': 3182.432, 'duration': 8.542}, {'end': 3193.214, 'text': "I'm just going to add one topping here just to keep it simple.", 'start': 3191.034, 'duration': 2.18}, {'end': 3194.995, 'text': "So let's have the price.", 'start': 3193.494, 'duration': 1.501}, {'end': 3198.437, 'text': 'for a default pizza is going to be equal to 10.', 'start': 3195.655, 'duration': 2.782}, {'end': 3205.823, 'text': 'now what we can do is go and create a prototype function called get price, and there we go.', 'start': 3198.437, 'duration': 7.386}, {'end': 3211.908, 'text': "it's not going to get anything passed inside of it and all it's going to do is return the price for said pizza.", 'start': 3205.823, 'duration': 6.085}], 'summary': 'Demonstration of factory and decorator design patterns in javascript for creating objects and altering object at runtime.', 'duration': 52.844, 'max_score': 3159.064, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE43159064.jpg'}, {'end': 3335.086, 'src': 'embed', 'start': 3269.738, 'weight': 0, 'content': [{'end': 3279.127, 'text': "and you can add anything you'd want to all these different objects dynamically, just showing you a very simplistic overview of how this would work.", 'start': 3269.738, 'duration': 9.389}, {'end': 3281.65, 'text': 'but go in there by all means and play around with it.', 'start': 3279.127, 'duration': 2.523}, {'end': 3282.611, 'text': 'see what you can come up with.', 'start': 3281.65, 'duration': 0.961}, {'end': 3286.005, 'text': 'You can see the cost of the pizza goes from $10 to $11..', 'start': 3283.024, 'duration': 2.981}, {'end': 3291.686, 'text': "Okay, so that's how we would use the singleton and the decorator and the factory pattern.", 'start': 3286.005, 'duration': 5.681}, {'end': 3295.827, 'text': "And now let's take a look at the last pattern I'm going to talk about, which is the observer pattern.", 'start': 3291.846, 'duration': 3.981}, {'end': 3299.368, 'text': 'Now the observer pattern is going to use a single object.', 'start': 3296.008, 'duration': 3.36}, {'end': 3305.09, 'text': "that's going to notify many other different objects or observers whenever a state change occurs.", 'start': 3299.368, 'duration': 5.722}, {'end': 3313.16, 'text': "So what we're going to do is we're going to create what I'm going to call an observable, which means it can be observed by others.", 'start': 3305.515, 'duration': 7.645}, {'end': 3319.004, 'text': 'And this observable needs to have a list of people that have subscribed.', 'start': 3313.68, 'duration': 5.324}, {'end': 3322.441, 'text': 'to be able to be told some bit of information.', 'start': 3319.42, 'duration': 3.021}, {'end': 3327.943, 'text': "I'm gonna use like a stock market analogy here and then we're gonna have a couple functions for observable.", 'start': 3322.441, 'duration': 5.502}, {'end': 3332.185, 'text': "so I'm gonna have prototype and the different functions I'm gonna have.", 'start': 3327.943, 'duration': 4.242}, {'end': 3335.086, 'text': "I'm gonna have an option to subscribe.", 'start': 3332.185, 'duration': 2.901}], 'summary': 'Overview of design patterns including singleton, decorator, factory, and observer, with a cost increase from $10 to $11 for the pizza.', 'duration': 65.348, 'max_score': 3269.738, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE43269738.jpg'}, {'end': 3456.955, 'src': 'embed', 'start': 3427.816, 'weight': 2, 'content': [{'end': 3429.897, 'text': "So let's create a publish function.", 'start': 3427.816, 'duration': 2.081}, {'end': 3431.198, 'text': 'And there that is.', 'start': 3430.357, 'duration': 0.841}, {'end': 3436.741, 'text': "And it's going to publish some type of data that's going to need to be shot out to all the subscribers.", 'start': 3431.758, 'duration': 4.983}, {'end': 3444.246, 'text': 'And how I would shoot through all of these different subscribers and notify them that things have changed,', 'start': 3437.061, 'duration': 7.185}, {'end': 3452.712, 'text': 'as I want to use a for loop this subscribers and then cycle through all of them and then increment that, of course,', 'start': 3444.246, 'duration': 8.466}, {'end': 3456.955, 'text': "and then I'm going to call this subscribers once again.", 'start': 3452.712, 'duration': 4.243}], 'summary': 'Creating a publish function to notify subscribers of data changes using a for loop.', 'duration': 29.139, 'max_score': 3427.816, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE43427816.jpg'}, {'end': 3634.077, 'src': 'embed', 'start': 3614.223, 'weight': 7, 'content': [{'end': 3617.005, 'text': 'And receive data prints all this information out on the screen.', 'start': 3614.223, 'duration': 2.782}, {'end': 3619.627, 'text': 'You can see that Oregon Fannie unsubscribed.', 'start': 3617.185, 'duration': 2.442}, {'end': 3623.793, 'text': 'And then you can see that only Boldman Yaks was then notified thereafter.', 'start': 3619.932, 'duration': 3.861}, {'end': 3625.154, 'text': 'So there you go, guys.', 'start': 3624.133, 'duration': 1.021}, {'end': 3629.675, 'text': 'That is an insane amount of information about object-oriented JavaScript.', 'start': 3625.254, 'duration': 4.421}, {'end': 3632.416, 'text': 'And please leave your questions and comments below.', 'start': 3630.015, 'duration': 2.401}, {'end': 3634.077, 'text': 'Otherwise, until next time.', 'start': 3632.956, 'duration': 1.121}], 'summary': 'Data prints information about oregon fannie unsubscribing and boldman yaks being notified in object-oriented javascript.', 'duration': 19.854, 'max_score': 3614.223, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE43614223.jpg'}], 'start': 3159.064, 'title': 'Javascript design patterns and observer pattern', 'summary': 'Introduces factory, decorator, and singleton design patterns in javascript, showcasing dynamic object creation, behavior alteration, and price calculation. it also covers the observer pattern in javascript, enabling notification of multiple observers about state changes.', 'chapters': [{'end': 3291.686, 'start': 3159.064, 'title': 'Javascript design patterns overview', 'summary': 'Introduces factory, decorator, and singleton design patterns in javascript, showcasing how to dynamically create objects, alter object behavior at runtime, and calculate price changes based on different toppings for a pizza object, with an example of adding extra cheese increasing the pizza price from $10 to $11.', 'duration': 132.622, 'highlights': ['The chapter introduces factory, decorator, and singleton design patterns in JavaScript, showcasing how to dynamically create objects, alter object behavior at runtime, and calculate price changes based on different toppings for a pizza object, with an example of adding extra cheese increasing the pizza price from $10 to $11.', 'The factory pattern is demonstrated by dynamically creating a sword object of type psi crafted from dark iron in JavaScript.', 'The decorator pattern is illustrated by showing how to alter the price of a pizza object by adding extra cheese, increasing the price from $10 to $11.']}, {'end': 3473.209, 'start': 3291.846, 'title': 'Observer pattern in javascript', 'summary': 'Introduces the observer pattern in javascript, which uses a single object to notify multiple observers about state changes, allowing for subscription, unsubscription, and data publishing.', 'duration': 181.363, 'highlights': ['The observer pattern in JavaScript uses a single object to notify multiple observers whenever a state change occurs, allowing for efficient data distribution to all the subscribers.', 'The observable in the observer pattern maintains a list of subscribers and provides functions for subscribing, unsubscribing, and publishing data, demonstrating the practical implementation of the pattern in JavaScript.', 'The publish function in the observer pattern enables the observable to distribute data to all subscribers, enhancing the real-time data dissemination capabilities of the pattern.']}, {'end': 3634.077, 'start': 3473.609, 'title': 'Creating observable objects in javascript', 'summary': 'Illustrates the creation of brokerage houses in javascript, demonstrating the use of observable objects to subscribe, unsubscribe, and publish information to multiple subscribers, exemplifying the object-oriented javascript concept.', 'duration': 160.468, 'highlights': ['The chapter discusses the creation of brokerage houses, Oregon Fanny and Boldman Yaks, to demonstrate the use of observable objects in JavaScript, allowing easy subscription and publication of information to multiple subscribers.', 'It shows the process of subscribing and unsubscribing from the observable object, with the example of unsubscribing the Oregon Fanny group, resulting in only Boldman Yaks being notified thereafter.', "The demonstration showcases the functionality of observable objects by publishing information, such as 'IBM at a certain price of 145.30,' and notifying subscribers about pricing changes, providing a practical application of object-oriented JavaScript.", 'The chapter emphasizes the use of observable objects to call the receive data function for all subscribers, printing the information on the screen each time an update occurs, illustrating the practical implementation of object-oriented JavaScript.']}], 'duration': 475.013, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/O8wwnhdkPE4/pics/O8wwnhdkPE43159064.jpg', 'highlights': ['The observer pattern in JavaScript uses a single object to notify multiple observers whenever a state change occurs, allowing for efficient data distribution to all the subscribers.', 'The observable in the observer pattern maintains a list of subscribers and provides functions for subscribing, unsubscribing, and publishing data, demonstrating the practical implementation of the pattern in JavaScript.', 'The publish function in the observer pattern enables the observable to distribute data to all subscribers, enhancing the real-time data dissemination capabilities of the pattern.', 'The chapter introduces factory, decorator, and singleton design patterns in JavaScript, showcasing how to dynamically create objects, alter object behavior at runtime, and calculate price changes based on different toppings for a pizza object, with an example of adding extra cheese increasing the pizza price from $10 to $11.', "The demonstration showcases the functionality of observable objects by publishing information, such as 'IBM at a certain price of 145.30,' and notifying subscribers about pricing changes, providing a practical application of object-oriented JavaScript.", 'The factory pattern is demonstrated by dynamically creating a sword object of type psi crafted from dark iron in JavaScript.', 'The decorator pattern is illustrated by showing how to alter the price of a pizza object by adding extra cheese, increasing the price from $10 to $11.', 'The chapter discusses the creation of brokerage houses, Oregon Fanny and Boldman Yaks, to demonstrate the use of observable objects in JavaScript, allowing easy subscription and publication of information to multiple subscribers.', 'It shows the process of subscribing and unsubscribing from the observable object, with the example of unsubscribing the Oregon Fanny group, resulting in only Boldman Yaks being notified thereafter.', 'The chapter emphasizes the use of observable objects to call the receive data function for all subscribers, printing the information on the screen each time an update occurs, illustrating the practical implementation of object-oriented JavaScript.']}], 'highlights': ['The tutorial covers objects, properties, constructors, prototypes, private properties, getters and setters, defined property inheritance, parent methods, design patterns, and OOP in ECMA scripts 6, providing comprehensive knowledge on object-oriented JavaScript.', 'The chapter explores various ways to create getters and setters, emphasizing their role in protecting data and providing useful ways to set values in an object-oriented JavaScript context.', 'The demonstration showcases the process of creating a constructor function and defining getters and setters for latitude and longitude coordinates, emphasizing its relevance in practical coding scenarios.', 'JavaScript inheritance is based on prototype chaining, where objects can inherit properties from other objects. Explains the concept of inheritance and prototype chaining in JavaScript.', 'Demonstration of the new method notation and class implementation in ECMAScript version 6. The tutorial provides demonstrations of the new method notation and class implementation in ECMAScript version 6, including examples of how to define methods and create classes, showcasing the upcoming changes in JavaScript.', 'The observer pattern in JavaScript uses a single object to notify multiple observers whenever a state change occurs, allowing for efficient data distribution to all the subscribers.']}