Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitd24d8d8

Browse files
Added constructor, protypes classes and inheritance
1 parentd3e42a0 commitd24d8d8

File tree

10 files changed

+450
-0
lines changed

10 files changed

+450
-0
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<htmllang="en">
3+
<head>
4+
<metacharset="UTF-8">
5+
<metahttp-equiv="X-UA-Compatible"content="IE=edge">
6+
<metaname="viewport"content="width=device-width, initial-scale=1.0">
7+
<title>This keyword</title>
8+
</head>
9+
<body>
10+
11+
<scriptsrc="script.js"></script>
12+
</body>
13+
</html>
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
// This keyword -> refers to the JS context object in which the current
2+
// code is running
3+
4+
// console.log(this); // window object
5+
6+
7+
// function f(){
8+
// console.log(this); // window object
9+
// }
10+
11+
// f();
12+
13+
// var f = function(){
14+
// console.log(this); // window object
15+
// }
16+
17+
// f();
18+
19+
// var f = ()=>{
20+
// console.log(this); // window object
21+
// }
22+
23+
// f();
24+
25+
// var obj = {
26+
// name:this,
27+
// print:function(){
28+
// console.log(this); // obj = {name: Window, print: ƒ}
29+
// }
30+
// }
31+
32+
// obj.print();
33+
34+
// var obj = {
35+
// name:"rajan",
36+
// print: ()=>{
37+
// console.log(this); // window object
38+
// }
39+
// }
40+
41+
// obj.print();
42+
43+
// var obj = {
44+
// name:"rajan",
45+
// student:{
46+
// print: ()=>{
47+
// console.log(this); // window object
48+
// },
49+
// print2: function(){
50+
// console.log(this);// student object
51+
// }
52+
// }
53+
54+
// }
55+
56+
// obj.student.print();
57+
// obj.student.print2();
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<htmllang="en">
3+
<head>
4+
<metacharset="UTF-8">
5+
<metahttp-equiv="X-UA-Compatible"content="IE=edge">
6+
<metaname="viewport"content="width=device-width, initial-scale=1.0">
7+
<title>Strict Mode</title>
8+
</head>
9+
<body>
10+
11+
<scriptsrc="script.js"></script>
12+
</body>
13+
</html>
Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
'use strict'
2+
3+
// console.log(this); // window object
4+
5+
6+
// function f(){
7+
// console.log(this); // undefined
8+
// }
9+
10+
// f();
11+
12+
// var f = function(){
13+
// console.log(this); // undefined
14+
// }
15+
16+
// f();
17+
18+
// var f = ()=>{
19+
// console.log(this); // window object
20+
// }
21+
22+
// f();
23+
24+
// var obj = {
25+
// name:this,
26+
// print:function(){
27+
// console.log(this); // obj = {name: Window, print: ƒ}
28+
// }
29+
// }
30+
31+
// obj.print();
32+
33+
// var obj = {
34+
// name:"rajan",
35+
// print: ()=>{
36+
// console.log(this); // window object
37+
// }
38+
// }
39+
40+
// obj.print();
41+
42+
// var obj = {
43+
// name:"rajan",
44+
// student:{
45+
// print: ()=>{
46+
// console.log(this); // window object
47+
// },
48+
// print2: function(){
49+
// console.log(this);// student object
50+
// }
51+
// }
52+
53+
// }
54+
55+
// obj.student.print();
56+
// obj.student.print2();
57+
58+
59+
// var obj={
60+
// name:"rajan",
61+
// class:"10th"
62+
// }
63+
64+
65+
// function f(){
66+
// console.log(this);
67+
// }
68+
69+
// f(); // undefined
70+
// f.call(window); // bound with window object
71+
// f.call(obj) // bound with obj = {name: "rajan", class: "10th"}
72+
// f.apply(obj); //bound with obj = {name: "rajan", class: "10th"}
73+
74+
75+
// Diference b/w call and apply method in type of argument
76+
77+
// var obj={
78+
// name:"rajan",
79+
// class:"10th"
80+
// }
81+
82+
83+
// function f(a,b){
84+
// console.log(this);
85+
// console.log(a,b);
86+
// console.log(arguments);
87+
// }
88+
89+
// f.call(obj,12,34); // call take normal values
90+
// f.apply(obj,[10,23]); // apply takes array
91+
92+
93+
// var obj={
94+
// name:"rajan",
95+
// class:"10th"
96+
// }
97+
98+
99+
// var f = (a,b)=>{
100+
// console.log(this); // pointing to window object
101+
// console.log(a,b);
102+
//console.log(arguments); // not defined in arrow functions
103+
// }
104+
105+
// f.call(obj,12,34); // call take normal values
106+
// f.apply(obj,[10,23]); // apply takes array
107+
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<htmllang="en">
3+
<head>
4+
<metacharset="UTF-8">
5+
<metahttp-equiv="X-UA-Compatible"content="IE=edge">
6+
<metaname="viewport"content="width=device-width, initial-scale=1.0">
7+
<title>Objects,Functions and Costructors</title>
8+
</head>
9+
<body>
10+
11+
<scriptsrc="script.js"></script>
12+
</body>
13+
</html>
Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
// EveryThing in JS is an object even functions
2+
3+
// Old way :- Creating functions using object
4+
// function createStudent(name,rollNo){
5+
// var student = {}; // or new Object();
6+
// student.name = name;
7+
// student.rollNo = rollNo;
8+
// return student;
9+
// }
10+
11+
// var s1 = createStudent("rajan",12);
12+
// var s2 = createStudent("AMan",23);
13+
// console.log(s1); // {name: "rajan", rollNo: 12}
14+
// console.log(s2); // {name: "AMan", rollNo: 23}
15+
16+
// constructor function in JS
17+
// function createStudent(name,rollNo){
18+
19+
// this.name = name;
20+
// this.rollNo = rollNo;
21+
// console.log(this);
22+
// }
23+
// var s1 = new createStudent("rajan",12); // create object using constructor
24+
// console.log(s1);
25+
26+
// var s2 = createStudent("aman",23); // calling the function
27+
// console.log(s2);
28+
29+
30+
// Adding behaiviours to objects
31+
// here in JS each object has its own functions rather in other programming languages
32+
// A single function is bind to all objects
33+
// To understand this concept we need to understand prototypes in JS.
34+
35+
// function createStudent(name,rollNo){
36+
37+
// this.name = name;
38+
// this.rollNo = rollNo;
39+
// this.getName = function () { return this.name }
40+
// this.getRollNo =function (){
41+
// return this.rollNo;
42+
// }
43+
// }
44+
// var s1 = new createStudent("rajan",12); // create object using constructor
45+
// console.log(s1); // createStudent {name: "rajan", rollNo: 12, getName: ƒ, getRollNo: ƒ}
46+
// console.log(s1.getName()); // rajan
47+
48+
// var s2 = new createStudent("Aman",12); // create object using constructor
49+
// console.log(s2); // createStudent {name: "Aman", rollNo: 12, getName: ƒ, getRollNo: ƒ}
50+
51+
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<htmllang="en">
3+
<head>
4+
<metacharset="UTF-8">
5+
<metahttp-equiv="X-UA-Compatible"content="IE=edge">
6+
<metaname="viewport"content="width=device-width, initial-scale=1.0">
7+
<title>Prototypes</title>
8+
</head>
9+
<body>
10+
prototypes is a property of each object which contains shared/common data and behaiviours of objects.
11+
12+
<scriptsrc="script.js"></script>
13+
</body>
14+
</html>
Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
// Each object has its prototype from where common properties are inherited
2+
// without prototypes creating methods in JS share individual memory space
3+
4+
// function Student(name,rollNo){
5+
// this.name = name;
6+
// this.rollNo = rollNo;
7+
// this.getName = function () { return this.name }
8+
// this.getRollNo =function (){
9+
// return this.rollNo;
10+
// }
11+
// }
12+
13+
// var s1 = new Student("RAjan",12);
14+
// console.log(s1); // Student {name: "RAjan", rollNo: 12, getName: ƒ, getRollNo: ƒ}
15+
16+
// var s2 = new Student("Aman",22);
17+
// console.log(s2); // Student {name: "Aman", rollNo: 22, getName: ƒ, getRollNo: ƒ}
18+
19+
// With Prototypes a data/method is shared with each object.
20+
// With this first interpreter look in the object whether mehtod/data is their
21+
//then look in the prototype
22+
23+
// function Student(name,rollNo){
24+
// this.name = name;
25+
// this.rollNo = rollNo;
26+
// }
27+
// Student.prototype.className = "MCA"; // Common to each object
28+
// Student.prototype.getName = function () { return this.name } // Common to each object
29+
// Student.prototype.getRollNo =function (){ return this.rollNo } // Common to each object
30+
31+
// var s1 = new Student("RAjan",12);
32+
// console.log(s1); // Student {name: "RAjan", rollNo: 12 }
33+
// console.log(s1.getName()); // RAjan
34+
// console.log(s1.className); // MCA
35+
// var s2 = new Student("Aman",22);
36+
// console.log(s2); // Student {name: "Aman", rollNo: 22 }
37+
// console.log(s2.getName()); // BCA
38+
39+
functionStudent(name,rollNo){
40+
this.name=name;
41+
this.rollNo=rollNo;
42+
}
43+
Student.prototype.className="MCA";// Common to each object
44+
Student.prototype.getName=function(){returnthis.name}// Common to each object
45+
Student.prototype.getRollNo=function(){returnthis.rollNo}// Common to each object
46+
47+
vars1=newStudent("RAjan",12);
48+
console.log(s1.className);// MCA
49+
s1.className="BCA";// this adds new property to s1 only
50+
console.log(s1);// Student {name: "RAjan", rollNo: 12, className: "BCA"}
51+
console.log(s1.className);// BCA
52+
53+
vars2=newStudent("Aman",22);
54+
console.log(s2);// Student {name: "Aman", rollNo: 22}
55+
56+
console.log(Student);
57+
58+
59+
// hasOwnProperty
60+
// ispropertyof
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<htmllang="en">
3+
<head>
4+
<metacharset="UTF-8">
5+
<metahttp-equiv="X-UA-Compatible"content="IE=edge">
6+
<metaname="viewport"content="width=device-width, initial-scale=1.0">
7+
<title>Prototypes</title>
8+
</head>
9+
<body>
10+
Object also has a prototype and everthing in JS directly or indirectly inherit Object prototype.
11+
12+
<scriptsrc="script.js"></script>
13+
</body>
14+
</html>

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp