\n {item.Pincode} PinCode of {item.Name}, {item.District}, {item.State}.\n \n Get pincode details of all regions of india by pincode only. By pincode you can get post office\n details, full address, district and state.\n \n \n Pincode is of 6 digits in which First digit reflects region, second the sub-region, third the sorting district, and last three represent the post office code.\n
\n {item.Pincode} PinCode of {item.Name}, {item.District}, {item.State}.\n \n Get pincode details of all regions of india by pincode only. By pincode you can get post office\n details, full address, district and state.\n \n \n Pincode is of 6 digits in which First digit reflects region, second the sub-region, third the sorting district, and last three represent the post office code.\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport GoogleAd from '../..//Components/GoogleAd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\n\nexport default class JavaOverview extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n \n Java Tutorials - Overview\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
\n \n
\n \n \n
After reading this tutorial you will understand the concepts of object oriented programming, how object and classes worked together in java and would be able to solve real world problems.
\n
If you have already studied about C++ then it will be advantageous for you to learn java.
\n
The objective of this tutorial is to introduce the Java Technology to the learners. This tutorial is designed to provide knowledge of Java and to introduce the programming syntax to the learners. After going through this tutorial the learner will be able to make object oriented programs in Java. The tutorial is bundled with a number of programs to make the learning easy and effective.
\n Why Learn Java ?\n
Most of the students think, to become a developer why we learn java. So here is your answer, we are adding some advantages –
\n
Java is Beginner friendly –
\n
Java is a high level programming language, so it is understandable to all the users. Its syntax is very easy and readable.
\n
Fast and Maintainale –
\n
Java is fatser than c and c++ because it uses jit compiler to compile the code and its code is easy to maintain and more readable.
\n
Community Support –
\n
Java is managed by oracle, the larger programming language needs more community support. So java provides best community support because there are more then 9 million java developers in world. Java releases it updates after every 6 moths.
\n
Java is everywhere –
\n
Java is used for everything and everywhere. It is used in –
\n
-Enterprise applications
\n
- Android apps
\n
- AI and Machine learning
\n
- Big Data
\n
- Web and desktop applications
\n \n Java Introduction\n
Java is a high level programming language created by James Gosling in 1991 from Sun Microsystems. The first public available version of Java (Java 1.0) was released in 1995 before that it was named as Oak. Over time several version of java were released which enhanced the language and its libraries
\n \n
\n
\n public class FirstProgram\n \n {\n \n public static void main(String[] args){\n \n System.out.print(“This is my First Program”);\n \n }\n \n }\n
\n
\n
\n What is object oriented programming?\n
OOP is problem solving technique to develop software systems. It is a technique to think real word entities in terms of objects. These objects have some states and behaviors and provide services to application.
\n
Java is high level, interpreted, object oriented, secure, robust, architecture neutral and secure programming language. These are also the features of Java:
\n \n Features of Java\n
\n 1.\tPlatform Independent
\n
The concept of write-once-run-anywhere is one of the vital features of Java language that makes java as the powerful language. The program written on one platform can run on any other platform.
\n
2.\tSimple
\n
In java, programs are easy to write and debug because java does not use the pointer explicitly. If programmer already have knowledge of C++ then it will be easier for them. There are various features that makes java as simple language.
\n
3.\tObject Oriented
\n
To be an Object Oriented language, any language must follow these characteristics-
\n
Encapsulation: It is mechanism to encapsulate or wrap up the data in a single entity it is known as encapsulation.
\n
Abstraction: Abstraction is a process to hide the implementation details from the users and showing only the functionality.
\n
Inheritance: Inheritance is a process in which one class acquires the property of another class.
\n
Polymorphism: As the name suggest one name many forms, Polymorphism is the way of providing the different functionality by the functions having the same name based on the signatures of the methods.
\n
4.\tBottom-up approach
\n
In bottom-up approach, small pieces are come together to form a large sub-system. In this, object and classes get together and form a program.
\n
5.\tRobust
\n
Java has strong memory allocation, automatic garbage collection and provides exception handling mechanism that makes java a robust language.
\n
6.\tMultithreaded
\n
Multithreading means a single program have multiple threads and execute independently at same time. Multithreading is a feature of java that have multiple single threads.
\n
Thread is a light weight process of a program and these threads executing simultaneously.
\n
7.\tSecure
\n
All the programs in java run under an area known as sand box.
\n
The public key encryption system is used by java to allow the java applications to transmit over the internet in the secure encrypted form.\n Java does not use memory pointer explicitly.
\n
8.\tInterpreted
\n
Interpreter is used to execute instructions that are written in programming language.
\n
Java is interpreted language that makes it versatile in nature because interpreter compiles and executes the code simultaneously; it takes only single line of code at a time.
\n
9.\tWORA(write-once-run-anywhere)
\n
When you write a program on one system that it will be able to run on any other system, this thing makes java as portable.
\n
10.\tJIT compiler
\n
Just in time compiler is used by Java that converts the byte code into native code. JIT is a component of Java Virtual Machine. It is responsible for performance of the Java application at run time.
\n\n
\n\n
\n
\n\n
\n
\n \n
\n
\n
\n\n {/*
\n Quick Search\n \n Check Pincode here\n \n \n
*/}\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class SetupEnvironmentalVariables extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Setup Environment Variables\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n
In this segment, we will discuss about how we can set up environment variables to establish runtime environment.
\n \n Set-up Environment Variables\n \n \n
To set the path for java programming language, follow these steps –
\n
1.\tRight click on ThisPC and open Properties.
\n \n
\n
2.\tClick on Advance System Settings.
\n \n
\n
3.\tThen Click on Environment Variables.
\n \n
\n
4.\tClick on New Button of User Variables.
\n \n
\n
5.\tSet Variable name as “path” and copy the path of your Java JDK bin folder(C:\\Program Files\\Java\\jdk1.8.0_231\\bin) in Variable value.
\n \n
\n
6.\tClick on OK button.
\n \n
\n
7. Click again on OK button and save that settings.
\n \n
\n\n \n \n \n
Now, you will be able to run and execute your Java program.
\n
If you want to check that java is successfully installed in your system, then go to Command Prompt and type “java –version” and “javac –version”.
\n \n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class ProgramExecutionInJava extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Program Execution In Java\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n
In this section you will learn about, how does java program work.
\n \n \n Program execution in Java\n \n \n
Java Programming language includes Java compiler, Java Virtual Machine and Java class Libraries. JVM is a software implementation that executes the programs.
\n
Complier converts the java code (high level language) into machine code i.e. Byte code. The JVM interprets this byte-code and runs the programs.\n
\n \n
\n
Steps to execute java program:
\n
•\tFirst, the user has to create a className.java file with any text editor.
\n
•\tThen, compiled it with this command - javac ClassName.java. The compilation produces as a result a file called ClassName.class
\n
•\tA program can be executed only after it has been compiled. Command for execution - java ClassName.
\n \n Byte Code\n
\n
Byte code is an instruction set of the Java Virtual Machine, it is created when user wants to compile their java source code than that code will be converted into byte code.
\n
We can also say this portable code or p-code because it is responsible for Java portability and it is executed by virtual machine.
\n \n Key Points\n \n
While creating java program, please keep these points in your mind or follow these points:
\n
Class Names − The first letter of any class should be in Upper Case after that we can use Camel case. And program name must be same as our className.
\n
Example: class FirstProgram
\n
Method Names − The first letter of method name should start with a small letter. And after that the first letter of each word of method name should be in upper case.
\n
Example: public void firstMethodNName()
\n
Case Sensitivity − Java is case sensitive. In java hello and Hello words have different meaning.
\n \n
In next segment, you will be able to set-up environment variables
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class FirstJavaProgram extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - First Java Program\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n
In this Segment, you will be understood how java program works and what are the things that user has to focus on.\n
\n
User needs Java Development Kit, To download jdk install jdk
\n
We can create Java program using Notepad -
\n
•\tFirst user has to open notepad
\n
•\tThen type the following code\n
\n \n
There are some important parts of the program that perform dominant role to create program.
\n
Class : A class is a blue print of the object. A class describes all the attributes and methods of object.
\n
Object : Object is an instance of class. It is basic unit of system. An object is an real world entity that has some attributes, behavior and identity. Attributes and behavior of an object are defined by the class definition.
\n
Methods : Method is a place where actual logics are written and actions are excuted. It is a block of code which runs only when it is called.
\n
Variables : Each variable has its data type. It is a piece of memory that contain some value.
\n \n \n
\n
\n public class FirstProgram\n \n {\n \n public static void main(String[] args){\n \n System.out.print(“This is my First Program”);\n \n }\n \n }\n
\n
\n
•\tSave the file as FirstProgram.java.
\n
\n Note: File name is always same as class name and it is case sensitive.\n
\n
\n
•\tNow open your cmd and set the directory path where your java program is saved and run the following commands:\n \n javac FirstProgram.java\n \n java FirstProgram\n
\n Output:\n \n This is my First Program\n
\n \n \n
\n
Program Explained
\n
main() method
\n
Java main() is composed of these terms:
\n
public
\n
It is an access specefier. It only defines that it can be accessed publicly.
\n
static
\n
It means that no object is required to access this method
\n
void
\n
Java main function is void so it does not return any value.
\n
main
\n
It tells to java program that our program starts from here. This is the name of java main method
\n
String[] args
\n
It defines that java program can accept a single argument of type string array. It is also know java command line arguments.
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JDKJREJVM extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - JDK JRE JVM\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n JDK, JRE, JVM\n \n \n
JDK
\n
It is an acronym of Java Development Kit. JDK provides development tools to develop java applications and it also provides runtime environment. It contains all the tools and libraries that help in to execute, debug and run the program.\n
\n
JDK is an implementation; there are distinct installers for Windows, Linux and Mac that’s why Java is platform dependent.
\n
JVM and JRE are parts of Java JDK.\n JDK contains JRE (and JRE contains JVM) and other libraries and development tools (such as javac and java).\n
\n \n
\n
JRE
\n
JRE is an acronym of Java Runtime Environment. JRE provides libraries, Java Virtual Machine and other components to run applets and applications. JRE is the implementation of JVM.
\n
JRE provides a runtime environment in which java program can be executed. JRE contains libraries and other files that help in execution of program
\n \n
\n
JVM
\n
JVM provides a runtime environment in which our byte code can be executed. It is responsible to convert byte code into machine language.
\n
JVM is a virtual machine that enables computers to run java programs. It is not physically exist that’s why it is known as abstract machine.
\n
JVM is also responsible to perform these tasks:\n •\tLoads code\n •\tVerifies code\n •\tExecutes code\n •\tProvides runtime environment\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaKeywords extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Keywords\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n List of Java Keywords\n \n \n
Java keywords are reserved words that have predefined meaning in java. They are total 51 keywords in java, but I have mentioned only few-
\n
Here is a list of keywords in the java programming language.\n
\n \n \n
\n
Modifiers
\n
Modifiers can be categorized in two categories, access modifiers and non-access modifiers:
Static keyword is used with variables and methods; it is mainly used to make your programs memory efficient.
\n
When we declare static variable, then classes maintain one copy of class variables regardless of how many instances exist of that class.
\n
Static can also be used to define a method as class method. Class methods are invoked by the class instead of a specific instance, and can only operate on class variable.
\n
Static method does not require object to call the method.
\n
Static field - Another name of class variable.
\n
Static method - Another name of class method.
\n \n
Abstract
\n
A keyword used in class definition to specify that a class is not be instantiated, but rather be inherited by other classes.
\n
An abstract class can have abstract and non abstract methods that are not implemented in the abstract class, but in subclass.
\n
Abstract methods are undefined methods i.e. methods without body, there is no implementation details of abstract methods.
\n
Non-abstract methods are defined methods i.e. methods with body.
\n \n
Final
\n
Final keyword is used to restrict the functionality of the variable, class and method.
\n
Final variable- If we declare any variable as final, then it will not be change i.e. constant.
\n
Final method- I we declare any method as final, then it will not be override.
\n
Final class-If any class will be declaring as final class than that class can’t be inherited.
\n \n
Synchronized
\n
A keyword in Java programming language that, when applied to a method or code block, guarantees that at most one thread at a time executes the code.
\n \n
new Keyword
\n
new keyword in java is used to dynamic allocates memory for an object returns a reference to object and binds the reference with the object. Here reference to object means address of object. So it is essential in java that all the objects must be dynamically allocated.
\n \n
this Keyword
\n
A java keyword that can be used to represent an instance of the class in which it appears(i.e. current class). this can be used to access class variables and methods.
\n \n
Super Keyword
\n
A java keyword used to access members of a class inherited by the class in which it appears.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaConstructor extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Constructors\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Constructor\n \n \n
Constructors are special functions that are used to initialize the member of any class.
\n
A pseudo-method that creates an object. In the Java programming language, constructors are instance methods with the same name as their class.
\n
Constructors are invoked using the new keyword.
\n
It is called when the instance of the class is created.
\n
Rules-\n \n •\tClass name must be same as constructor name.\n \n •\tThere is not any explicit return type.\n
\n
\n
Defining a Constructor in Java
\n
A simple Java constructor declaration example. In which a class with single constructor -
\n
\n public class TutsFinder {\n
\n public TutsFinder() {\n
\n }\n
\n }\n
\n \n \n
Types of Constructors-
\n
Default constructor - When constructor does not have any parameter then it is called as default parameter.
\n
Example to define Default Constructor -
\n
\n class Tuts {\n \n public Tuts()\n \n {\n \n System.out.println(\"Java Tutorials\");\n \n }\n \n public static void main (String[] args)\n \n {\n \n Tuts obj = new Tuts();\n \n }\n \n }\n
\n \n \n Output: \n
\n
\n Java Tutorials\n
\n \n
Parameterized constructor - A constructor with arguments is known as parameterized constructor.
\n \n
Example to define Parameterized Constructor -
\n
\n
import java.io.*;\n \n class Tuts \n {\n\n String name;\n \n int id;\n \n \n Tuts(String name, int id) \n { \n this.name = name; \n this.id = id; \n } \n \n \n public static void main (String[] args) { \n Tuts obj = new Tuts(\"Java Tutorials\", 1); \n System.out.println(\"Tutorials Name :\" + obj.name + \" and Tutorials Id :\" + obj.id); \n }\n \n }\n
\n
\n \n \n Output: \n
\n
\n Tutorials Name: Java Tutorials and Tutorials Id: 1\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaClassAndObject extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Class and Object\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Class\n
In java , Class is a type that defines the implementation of a particular kind of object.
\n
A class is a blue print of the object. A class describes all the attributes and methods of object.
\n
Class keyword is used to declare the new class.
\n
\n Data(variables) and methods defined within the class. \n Variables and methods are called members of class. \n Data are data members or instance variables of the class. \n Methods are called member functions of the class.\n
\n \n
\n \n
class ClassName{\n //code\n }
\n \n
\n \n \n Object\n
Object is an instance of class. It is basic unit of system. An object is an real world entity that has some attributes, behavior and identity. Attributes and behavior of an object are defined by the class definition.
\n
new keyword is used to create the object of the class.
\n
Objects have states and behaviours -
\n
•\tState defines the characteristic of the object e.g. Car brand is BMW, color Black etc.
\n
•\tBehaviour defines the functionality of the object e.g. gear change, sun roof open etc.
\n
Example: In this example we have created a Car class which has two method carRun() and gearChange(). We have creating a object of Car class and print it.
\n
\n
\n class Car \n {\n \n void carRun() \n { \n System.out.println(\"Car is runing\"); \n } \n void gearChange() \n { \n System.out.println(\"Car gear change\"); \n } \n public static void main(String[] args) \n { \n Car obj=new Car(); \n obj.carRun(); \n obj.gearChange(); \n } \n }\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaAbstractionEncapsulation extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Abstraction and Encapsulation\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Abstraction\n
Abstraction is a process to hide the implementation details from the users and showing only the functionality. It displays only essential things.
\n
For example: Like ATM Machine, we can see only functionality but don’t know internal details that how it works.
\n
Advantages:\n •\tIncreases reusability of code by minimizes code redundancy.\n •\tSeparates program into code and implementation.\n •\tIncreases code readability.\n
\n \n
\n \n
\n abstract class Vehicle{ //declare abstract class \n String model; \n \n public Vehicle(String model){ //abstract class with constructor \n System.out.println(\"Vehicle constructor called\"); \n this.model=model; \n } \n } \n class Car extends Vehicle{ \n public Car(String model){ \n super(model); \n System.out.println(\"Bike constructor called\"); \n } \n public String toString(){ \n return \"Car model is \"+super.model; \n } \n } \n public class Abstraction{ \n public static void main(String[] args){ \n Vehicle obj = new Car(\"BMW\"); \n System.out.println(obj); \n }\t \n } \n }
\n \n
\n \n Output: \n
\n
Vehicle constructor called \n Bike constructor called \n Car model is BMW \n
\n
\n
\n
In java abstraction is achieved in two ways-
\n
•\tBy using abstract class
\n
•\tInterface
\n \n Abstract Class\n \n
Abstract class is declared with abstract keyword– it can contain both abstract and non-abstract methods.
\n
Abstract methods are methods that can contain methods without body i.e. undefined methods.
\n
Non-abstract methods are methods that contain methods with body i.e. defined methods.
\n
Abstract class is used to achieve abstraction.
\n
Abstract class cannot be instantiated but can be sub classed.
\n
A simple program to show how abstraction class works in java.
\n
\n
\n {`\n abstract class Vehicle{\t //class with abstract keyword\n abstract void run();\t\t//abstract method\n void bike(){\t\t\t\t//non-abstract method\n System.out.println(\"Bike is running\");\n }\n }\n class Car extends Vehicle{\n void run(){\n System.out.println(\"Car is running\");\n }\n }\n class AbstractClass{\n public static void main(String[] args){\n Vehicle obj = new Car();\n obj.run();\n obj.bike();\n }\n }\n `}\n
\n
\n
\n Output:\n
\n
\n
\n Car is running\n Bike is running\n
\n
\n
\n Encapsulation\n \n
It is mechanism to encapsulate or wrap up all the data into a single entity it is known as encapsulation.
\n
Encapsulation can be achieved in two ways:
\n
1.\tBy using setter and getter methods.
\n
2.\tMaking all variables as private.
\n
For Example: Here ATM Machine is a class. It contains both data i.e. money and operations i.e. withdraw money, balance enquiry and they are integrated in a single entity called ATM. This is called Encapsulation.\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaInheritance extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Inheritance\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Inheritance\n
\n
Inheritance is one of the features of OOP where one class acquires the properties of another class.
\n
Inheritance represents IS-A relationship and used for reusability of code.
\n
•\tSuperclass is the class from which class is derived. Super class is also called parent class or base class.
\n
•\tA class is derived from the superclass is called as the child class or derived class.
\n
•\tMethods and variables must be in public or protected except private.
\n
•\textends keyword is used to inherit the class.
\n
\n Types of Inheritance:
\n
1. Single Inheritance - When a class inherited by another class is known as single inheritance.
\n
For Example - car class inherits vehicle class.
\n \n
\n \n
\n \n
2. Multi-level Inheritance - There is a chain of classes where class A inherits class B and class B is also inherited by another class C.
\n
For Example - BMW inherits the car class and car inherits the vehicle class.\n
\n \n
\n \n
\n \n
3. Mutiple Inheritance - When properties of more than one parent is inherited by another class then this is known as multiple inheritance.
\n
But java does not support multiple inheritance because it creates ambiguity problem.
\n
To overcome this problem, there is a concept in java i.e. Interface. Later we will learn about it .
\n \n
\n \n
\n
4. Hierarchical Inheritance- When more than one class acquires the property of a single class then is called as hierarchical inheritance.
\n
For Example - Car and bike class inherits the vehicle class.
\n \n
\n \n
\n \n
5. Hybrid Inheritance - It is a comination of more than one type of inheritance.
\n
When class A is inherited by class B and C, and class C is inherited by class D.
\n \n
\n \n
\n \n \n
Example to show class can be extended.
\n\n
\n
\n class Vehicle \n { \n (// member declarations) \n } \n class Car extends Vehicle \n { \n (// inherit accessible members from Vehicle) \n (// own member declarations) \n }\n
\n \n
\n\n
\n
Program to show how inheritance works in java.\n
\n
\n class Vehicle{ \n \n void run(){ \n System.out.println(\"Vehicle is running\"); \n } \n } \n class Car extends Vehicle{ \n void stop(){ \n System.out.println(\"Car is stop\"); \n } \n { \n class Main{ \n public static void main(String[] args){ \n Car obj=new Car(); \n obj.run(); \n obj.stop(); \n } \n }\n
\n \n \n
This program is also a example of Single Inheritance where Vehicle is parent class and Car is child class
\n \n \n\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaPolymorphism extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Polymorphism\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Polymorphism\n
\n
As the name suggest one name many forms, Polymorphism is the way of providing the different functionality by the functions having the same name based on the signatures of the methods.
\n
For example: method calculate_area will definitely work for circle, square and triangle object.
\n \n Method overloading\n
In Method overloading, functions have same name but different no. of arguments, return type of the parameters.
\n
•\tIt can be implemented in both parent and child class.
\n
•\tIt is also known as compile time polymorphism.
\n \n Method Overriding\n
In method overriding, redefining inherit methods in subclasses. In this, declaration should be identical, code may be different. It is like having another version of the same product.
\n
•\tIt can be used to add more functionality to a method.
\n
•\tIt is also called as run time polymorphism.
\n
•\tIn overriding, a method has same name, same no. of arguments and same data type.
\n \n
\n \n
\n abstract class Vehicle{ //declare abstract class \n String model; \n \n public Vehicle(String model){ //abstract class with constructor \n System.out.println(\"Vehicle constructor called\"); \n this.model=model; \n } \n } \n class Car extends Vehicle{ \n public Car(String model){ \n super(model); \n System.out.println(\"Bike constructor called\"); \n } \n public String toString(){ \n return \"Car model is \"+super.model; \n } \n } \n public class Abstraction{ \n public static void main(String[] args){ \n Vehicle obj = new Car(\"BMW\"); \n System.out.println(obj); \n }\t \n } \n }
\n \n
\n \n Output: \n
\n
Vehicle constructor called \n Bike constructor called \n Car model is BMW \n
\n
\n
\n Encapsulation\n \n
It is mechanism to encapsulate or wrap up all the data in a single entity it is known as encapsulation.
\n
Encapsulation can be achieved in two ways:
\n
1.\tBy using setter and getter methods.
\n
2.\tMaking all variables as private.
\n
For Example: Here ATM Machine is a class. It contains both data i.e. money and operations i.e. withdraw money, balance enquiry and they are integrated in a single entity called ATM. This is called Encapsulation.\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class Header extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Association\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n Association\n
It represents a relationship between two or more objects where all objects have their own life cycle and there is no owner that means no one is depend on another.
\n
Association can be one to one, one to many, many to one, many to many.
\n
The objects that are part of association can be created and destroyed independently.
\n
For Example: Relationship between doctor and patient. A doctor can be associated with multiple patients and at the same time, patient can visit multiple doctors for treatment. In this, each object doctor and patient has its own life cycle.
\n
There are two forms of association:
\n
1.\tAggregation
\n
2.\tComposition
\n
\n
\n \n
\t\n \n \n Aggregation\n
It represents Has-A relationship.
\n
Aggregation is a kind of association where both entities survives independently which means ending one entity will not affect the other entity.
\n
It is a weak relationship.
\n
It is a unidirectional association i.e. one way relationship.
\n
For Example: Here two entities Department and Teacher. A Teacher may belong to multiple Departments. Hence Teacher is a part of multiple departments. But if we delete a department, Teacher entity will not destroy.
\n \n \n Composition\n
It represents a one to many relationship.
\n
It is restricted form of aggregation where entities are highly dependent on each other. On entity cannot be exist without other.
\n
It is a strong relationship.
\n
For Example: College consists of several departments whenever college entity destroys automatically all the department entities will be destroyed that is without existing college entity there is no chance of existing dependent entity.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class Header extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Arrays\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n Arrays in Java\n
\n
Array is a collection of data of similar data type. Consider an example – If we say there is an array of Integer this means that we have a collection of data that contains only integer values.
\n
Array uses static memory allocation. To access element from array you must have to mention its index value corresponding to the position of the element. We can easily access data in array.
\n
The index of array always starts from 0.
\n
But there is a disadvantage in array that we can store only fixed amount of elements. We cannot change size of an array at runtime. To overcome this problem, there is concept of Java Collections. Later in this tutorial we will study that.
\n
There are two types of arrays –
\n
1.\tOne Dimensional
\n
2.\tMulti Dimensional
\n
Array Declaration and Initialization
\n
If you want use array in your program then first declare variable and initialize the value to that variable.
\n
Syntax: dataType array_name[]={};
\n
Example: int myarray [] = { 7,8,4,21 };
\n \n Array First Program\n
\n
\n
\n{`\nclass ArrayExample{\n public static void main(String args[]){\n int array[] = new int[5];\n for (int i=0 ; i<5 ; i++){\n array[i] = i+1;\n }\n for(int i=0 ; i<5 ;i++){\n System.out.println(\"array[\"+i+\"] = \"+array[i]);\n }\n }\n}\n`}\n
\n Array Program to find the length of an array.\n
\n
\n
\n {`\nclass ArrayLength\n{\n public static void main(String[] args)\n {\n int arr[]={12,2,5,8,4,6,32};\n System.out.println(\"Length of an array is: \"+arr.length);\n }\n}\n `}\n
\n
\n
\n Output: \n
\n
\n
\n \n Length of an array is: 7\n
\n
\n \n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaStrings extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Strings\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n Java Strings\n
String is a sequence of characters. It is used to store text.
\n
Once a object of string is created then it will never be changed that’s why Strings are immutable in nature.
\n
String can be created easily. For Example: String str=”Hello all of you”;
\n
You can create string in two ways:
\n
1.\tBy string literal
\n
2.\tBy new keyword
\n
In string literal, string is created by using double quotes.
\n
String str = ”Hello world”;
\n
You can use the new operator followed by a space and then class name and then in parentheses you can include values used to initialize the fields of the object.
\n
String str=new String(“Hello World”);
\n \n Methods of String:\n\n
1.\tint length() – Returns the no characters in the string.
\n
Syntax: str.length();
\n
For Example: “tutsfinder”.length();\t\t//retursn 10
\n
2.\tchartAt(int i) – Returns the character at ith index
\n
Syntax: str.charAt(i);
\n
For example: “tutsfinder”.charAt(4);\t\t//returns f
\n
3.\tsubstring(int i) – Returns the substring from the ith index to the end of the string.
\n
Syntax: str.substring(i);
\n
Example: “tutsfinder”.substring(4);\t\t// returns finder
\n
4.\tsubstring(int i,int j) – Returns the string from ith index to j-1 index.
\n
Syntax: str.substring(i,j);
\n
For example: “tutsfinder”.substring(4,7)\t\t//returns find
\n
5.\tconcat(str) – Concatenates specified string to the end of the string.
\n
For Example:
\n
String s1=”tuts”;
\n
String s2=”finder”;
\n
S1.concat(s2);\t\t\t\t\t\t//returns tutsfinder
\n
6.\tindexOf(String str) – Returns the index within the string of the first occurrence of the specified string, starting at the specified string.
\n
For example:
\n
String s=new String(“Java Tutorials”);
\n
s.indexOf(“Tutorials”);\t\t\t//returns 5
\n
7.\ttoLowerCase() – Coverts all the characters in the string to Lower case.
\n
Syntax: str.toLowerCase();
\n
8.\ttoUpperCase() – Converts all the characters in the string to Upper case.
\n
Syntax: str.toUpperCase();
\n
9.\ttrim() – It removes the whitespaces from the string and returns the copy of that string. It does not white spaces in the middle.
\n
Syntax: str.trim();
\n
10.\treplace(old char, new char) - Replaces the old character with new character and returns the new string.
\n
Syntax:
\n
String str=”Java”
\n
str.replace(‘a’,’x’); \t\t\t\t//returns Jxvx
\n\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaInterface extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Interface\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Interface\n
\n
Through Interface mechanism we can achieve abstraction.
\n
Interface contains only undefined methods i.e. abstract methods(methods without body). A class can implement interface through implements keyword.
\n
Interfaces cannot be instantiated, but can be implemented.
\n
The methods we declare in interface, it is necessary to define them in the class in which we are implementing them otherwise compiler gives an error.
\n
\n
\n
\n \n
Syntax:
\n Interface abc \n { \n (// only methods) \n } \n Class xyz implements abc \n { \n (//methods with body) \n } \n \n
\n
\n
\n
Multiple Inheritance is not achieved in java, to overcome this problem Interface mechanism is introduced.
\n \n
\n
\n interface Vehicle{ \n void car(); \n void bike(); \n } \n class InterfaceDemo implements Vehicle{ \n public void car(){ \n System.out.println(\"Car is running...\"); \n public void bike(){ \n System.out.println(\"Bike is running..\"); \n } \n public static void main(String[] args) \n { \n Vehicle obj=new InterfaceDemo(); \n obj.car(); \n obj.bike(); \n } \n }\n
\n
\n \n \n Output:\n
\n
\n
\n Car is running...\n Bike is running..\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class Header extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Inner Class\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n \n Java Inner Class\n
Inner class also known as nested classes which are define inside another class.
\n
Inner classes are non-static nested classes.
\n
Inner classes are able to access the data of outer class including private data members and methods.
\n
It helps in to grouping of classes that are related to each other.
\n
Increases readability and maintainability of code.
\n
Types of Inner class –
\n
1.\tNested Inner Class
\n
2.\tLocal Inner Class
\n
3.\tAnonymous Inner Class
\n \n
Nested Inner class can access other instance variables of the outer class, even if they are declared as private.
\n
Class created inside a method is known as local inner class. If you want to invoke the method of local inner class, you must instantiate this class inside the method.
\n
A class that have no name is known as Anonymous Inner class. It is created in two ways –
\n
1.\tClass
\n
2.\tinterface\n
\n \n
Program to show how we can acces the data of inner class.
\n
\n
\n
\n class Outer { \n int num; \n private class Inner {\t\t// inner class \n public void show() { \n System.out.println(\"This is an inner class\"); \n } \n } \n void showInner() {\t\t//access inner class method from method in outer class \n Inner in = new Inner(); \n in.show(); \n } \n } \n \n public class InnerClassDemo { \n\n public static void main(String[] args) { \n\n Outer out = new Outer(); \n\n out.showInner(); \n } \n }\n
\n
\n
\n
Here, Outer is an outer class and Inner is an inner class and show is the method inside inner class.
\n Output:\n
\n
\n
\n This is an inner class\n
\n
\n
\n \n \n\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaExceptionHandling extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Exception Handling\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Exception Handling\n
\n
What is Exception?
\n
Exception is an event that occurs during an execution of a program that disrupts the normal flow the program.
\n
To handle these exceptions, there be a concept in java that is Exception handling; it maintains the normal flow of the program.
\n \n
Main advantage of exception handling is that it’s maintain the normal flow of the program and Separate error handling code form normal code.
\n
Exception can be occurred due to wrong input data e.g. divide by zero.
\n \n
Types of Exceptions —
\n
•\tChecked exceptions — All exceptions except runtime exceptions are checked exceptions.
\n
•\tUnchecked exceptions — All runtime exceptions are unchecked exceptions.
\n
•\tErrors — Errors are not recoverable.
\n \n Try / catch block –
Error prone code is placed in try block and catch block is used to handle that error, try block should be always followed by catch or finally block.
Throw keyword that allows the user to throw an exception or any class that implements “throwable” exception.
\n Throws –
A java keyword used in method declarations that specify which exceptions are not handled within the method but rather passed through the next higher level of the program.
\n A basic Program to show how try/catch block works.\n
In this example, we have divided the no. by zero and it gives an error.
\n
\n
\n public class TryCatchExample { \n public static void main(String[] args) { \n try \n { \n int number=10/0; \n } \n \n catch(Exception e) \n { \n\n System.out.println(\"Number can't divided by zero.\"); \n } \n } \n\n }\n
\n
\n
\n Output:\n
\n
\n Number can't divided by zero.\n
\n
\n
\n Program to show how finally block executes.\n
Here in try block we placed a error prone code and handle in catch block and in finally block we placed our rest code.
\n \n
\n
\n public class FinallyBlock{ \n public static void main(String args[]){ \n try{ \n int number=10/0; \n System.out.println(number); \n } \n catch(ArithmeticException e){ \n System.out.println(e); \n } \n finally{ \n System.out.println(\"Finally Block is always executed either error is caught or not.\"); \n } \n System.out.println(\" Output is: \" + 10/10); \n } \n } \n
\n
\n
\n Output:\n
\n
\n java.lang.ArithmeticException: / by zero \n Finally Block is always executed either error is caught or not. \n Output is: 1\n
\n
\n
\n Program to show how throw keyword works.\n
\n
\n
\n class JavaThrow \n { \n public static void main(String args[]) \n { \n try \n { \n throw new NullPointerException(\"Example\"); \n } \n catch(NullPointerException e) \n { \n System.out.println(\"Exception in main caught.\"); \n } \n } \n }\n
\n
\n
\n Output:\n
\n
\n Exception in main caught.\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaInputOutput extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials -Input / Output\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Input/Output\n
\n
Java Input-Output package is introduced to perform all input and output operations.
\n
I/O stream has some classes in java.io package and some classes in java.nio.file.
\n
I/O Stream:
\n
•\tByte Streams
\n
•\tCharacter Streams
\n
•\t Buffered Streams
\n
Java provides these two popular streams that are used in to perform I/O operations.
\n \n
System.out(System output stream)
\n
It is used to provide output of data. System.out is a outputstream through which you can write characters.
\n
Functions that are used with system.out in java.
\n
System.out.print- It is used to print the text on screen and moves the cursor to end of the line. And next text prints starts from here.
\n
System.out.println- It is also used tp print the text on the screen and moves the cursor to the next line. And next text starts print from here.
\n \n
System.in(System input stream)
\n
It is used to provide input of data. It reads data from the source (keyboard).
\n
When we type any data from keyboard than it will be read by system.in.
\n \n
Charcter Stream-
\n
This stream is used to perform read- write operations on character type.
\n
Classes that are used to to read character data-
\n
•\tReader: To read character streams.
\n
•\tInputStreamReader: It is used to read byte stream and converts it to character stream.
\n
•\tFileReader: It is used to read characters from a file.
\n
•\tBufferedReader: It reduces the I/O operations in the file system because in one read() call method more date can be read from the file.
\n
Classes that are used to write character data-
\n
•\tWriter: To write the character streams.
\n
•\tOutputStreamWriter: It is used to write character streams and also convert it to byte streams.
\n
•\tFileWriter: It is used to write characters to the file.
\n
•\tBufferedWriter: It can also reduces the I/O operations in the file system because in one write() call method more date can be write in the file.
\n \n
Byte Stream-
\n
This stream is used to perform read-write operations on byte data. In byte stream, we have to work with raw data e.g. characters, image, Unicode data.
\n
Classes that are used to read the byte data:
\n
•\tInputStream: To read the byte streams.
\n
•\tFileInputStream: It is used to read bytes from a file.
\n
•\tBufferedInputStream: As we saw in the character streams, this is a more efficient method than FileInputStream.
\n
Classes that are used to write the byte data:
\n
•\tOutputStream: To write byte streams.
\n
•\tFileOutputStream: It is used to write raw bytes to the file.
\n
•\tByteOutputStream: As we saw in the character streams, this is a more efficient method than FileOutputStream.
\n
\n
\n
\n Note:- All these classes are defined under java.io package.\n
\n
\n\n
\n Program to create a new file\n
In this program, we are creating a new file, If same name of file is already exist then it will give us error otherwise it will successfully created.
\n
\n
\n
\n import java.io.File; \n import java.io.IOException; \n public class CreateFile \n { \n public static void main( String[] args ) \n { \n try { \n File file = new File(\"C:\\\\JavaPrograms\\\\tutsfinder.txt\"); \n boolean check = file.createNewFile(); \n if (check){ \n System.out.println(\"File has been created successfully\"); \n } \n else{ \n System.out.println(\"File already exist !\"); \n } \n } catch (IOException e) { \n System.out.println(\"Exception Occured\"); \n e.printStackTrace(); \n } \n } \n }\n
\n
\n
\n Output:\n
\n
\n
\n File has been created successfully\n
\n
\n
\n Program to copy a file into new file.\n
In this program, we are copy the already existing file into another file, it it does not exist it will shoe an exception otherwise it will create successfully.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaAwt extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - AWT\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Abstract Window Toolkit\n
\n
Java AWT is known as Abstract window Toolkit is an API used in to develop windows based applications.
\n
Awt components are platform dependent because they are displayed according to the view or screen of the operating system.
\n
AWT is heavyweight because its components are using resources of operating system.
\n
Java.awt package provides some classes:
\n
1.\tTextField
\n
2.\tButton
\n
3.\tLabel
\n
4.\tChekbox
\n \n \n \n
Container
\n
Container is the component of awt that contains other components like button, textfield, label.
\n
Types of Containers :
\n
Window – Window is container but it does not have borders and menu. If you want to create window, you can use frame and dialog.
\n
Frame - The Frame is the container that can contain the title bar and menu bar. It can have other components like button, text field, etc.
\n
Panel - The Panel is the container that doesn’t contain the title bar and menu bar. It can have other components like button, text field, etc.
\n
Dialog - Dialog is the container having border and title. We cannot create an instance of the Dialog class without an associated instance of the respective Frame class.\n
\n
\n Program to create a button by extends Frame class\n
\n Program to create TextField by creating instance of Frame class.\n
In this program, we are copy the already existing file into another file, it it does not exist it will shoe an exception otherwise it will create successfully.
\n
\n
\n
\n import java.awt.*; \n public class AwtExample2 { \n AwtExample2() \n { \n Frame fr = new Frame(); \n Label lb = new Label(\"User Name\"); \n fr.add(lb); \n TextField t = new TextField(); \n fr.add(t); \n fr.setSize(300, 150); \n fr.setLayout(new FlowLayout()); \n fr.setVisible(true); \n } \n public static void main(String args[]) \n { \n AwtExample2 ae = new AwtExample2(); \n } \n }\n
\n
\n
\n Output:\n
\n \n
\n\n \n \n\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaApplet extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Applet\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n Java Applet\n
\n
An Applets are used to create GUI that can be embedded in to web pages. It resides on client side and run in browser to give dynamic functionality.
\n
An applet in embedded in HTML page using applet tag <applet>. Applets are used to provide interactive features that HTML can’t be provided.
\n
Applet is a small java program, It can’t run alone but rather to be embedded in another application.
\n \n
Applet life cycle-
\n \n
The life cycle of applet starts with init() and ends with destroy() method. In its life cycle an applet is goes through many phases –
\n
1.\tInit()
\n
2.\tStart()
\n
3.\tPaint()
\n
4.\tStop()
\n
5.\tDestroy()
\n
init()- This is the first state of applet life cycle. In this method, variable declaration and initialization operations are performed.
\n
An applet is created by calling init() method. It is called only one time in applet life cycle, when applet is first loaded.
\n
Start()- The start() method executes immediately after init() method. When start() method called, then applet is comes in running state.
\n
This method is called at least once in life span of an applet.
\n
This method is called when applet is start or restart.
\n
Stop()- stop() method stops the execution of applet.
\n
It is called when we move from one page to another or minimizes the applet.
\n
It is called atleast one and can be called any no. of times.
\n
Destroy()- It is called after stop() method. It is execute when applet window is closed.
\n
In this state applet is completely remove from the memory.
\n
It occurs only once in its overall life cycle.
\n
Paint()- This method is called when applet is only in running state. It can be called any no. of times.
\n
Applet comes in display state whenever it has to perform output operations on the screen.
\n
Graphics class provides painting feature in applet.
\n\n
\n First Applet Program\n
Applet program can be run in two ways-
\n
By HTML
\n
By AppletViewer Tool
\n
\n
JavaAppletExp.java
\n
\n
\n import java.applet.Applet; \n import java.awt.Graphics; \n public class JavaAppletExp extends Applet { \n public void paint(Graphics g) { \n g.drawString(\"TutsFinder\", 50, 25); \n } \n }\n
\n NOTE: To run program through AppletViewer follow these commands: \n javac JavaAppletShow.java \n appletviewer javac JavaAppletExp.java\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaCollection extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Collection\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Collection\n
\n
In java, all dynamically allocated data structures(such as ArrayList, Vector, LinkedList, Stack, Queue,HashSet) are unites in a integrated architecture called as Java collection framework.
\n
Java collection, a name define itself is a collection of interfaces and classes that are used in to manipulate the group of objects.
\n
Java collection interface provides a interface to store, update, delete the data.
\n
To use collection framework we have to import java.util.* package.
\n
Java collection framework package contains-
\n \n
1.\tInterfaces-
\n
•\tIterable
Iterbale is the root interface of Java collection API. It is used to travers the list and modify the elements .
\n
The Collection interface extends the iterable interface and List , Queue , Set extends the Collection interface so therefore all the sub types of collection implements iterable.
\n
An object of a class that implements the Iterable interface can be used with the Java for-each loop.
Implements dynamic array that can store duplicate elements of different data types. It maintains insertion order and elements that are stored can be accessed randomly.
\n
•\tLinkedList
In linked list elements are not stored in contiguous location. It uses doubly linked list to stor data.
\n
Maintains insertion order and store duplicate items.
\n
•\tVector
It is same as ArrayList but it is synchronized. Implements dynamic array to store the elements.
\n
•\tStack
It is based on last-in-first-out. It is a subclass of vector where stack have same methods of vector as well as its own.
\n
•\tPrirorityQueue
A PriorityQueue is used when the objects are supposed to be processed based on the priority of elements. Queue follows first-in-first-out.
\n
•\tArrayDeque
In ArrayDeque, we can add and remove the data from both the ends. This class implements the Deque interface.
\n
•\tHashSet
It stores unique elements and does not maintain insertion order, it uses a hash table for storage.
\n
•\tLinkedHashSet
It provides the facilties of both hash table and linked list data structure. It contains unique elements and maintains insertion order.
\n
•\tTreeSet
TreeSet stores unique elements in ascending order and it is not thread safe. It stores data in tree format storage.
\n
\n Program in which we can store all types of data. This will give us an overview how we can implements all data structures.\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaJDBC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - JDBC\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Database Connectivity\n
\n
Java JDBC is an API that enables java applications to connect with relational databases like MySql.
\n
It can access data of relational database where you update, detete , fetch , store the data from database.
\n \n
JDBC Drivers
\n
1.\tJDBC-ODBC Bridge Driver -JDBC drivers coverts the interface calls to ODBC calls, then ODBC bridge calls ODBC driver of the respective database. But this driver have some problems to overcome this thin driver is introduce.
\n
2.\tNative API Driver - Native API Driver part is replaced by ODBC part, thi driver converts the jdbc method calls into native method calls
\n
3.\tNetwork Protocol Driver(Middleware Driver) - In this, first java method calls send to middleware. With the help of middleware then connects to the database on behalf of JDBC Driver.
\n
4.\tDatabase Protocol Driver(Pure java driver) or thin driver - Thin driver is most used driver. It directly coverts the JDBC methods calls to the database.
\n \n
Steps to set-up JDBC Connection
\n
1.\tImport JDBC packages
\n
2.\tLoad JDBC drivers
\n
3.\tOpen a connection to the database
\n
4.\tCreate statement
\n
5.\tExecute Query
\n
6.\t Get resultSet and process it
\n
7.\tClose connection\n
\n
\n Program to create a new file\n
In this program, we are creating a new file, If same name of file is already exist then it will give us error otherwise it will successfully created.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaMultithreading extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Multithreading\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Multithreading\n
\n
Multithreading means a single program have multiple threads and execute independently at same time. Multithreading is a feature of java that have multiple single threads.
\n
Thread is a light weight process of a program and these threads executing simultaneously.
\n Example:\n
•\tWe can print a document in MS-Word at the same time checking the spelling mistakes in the document.
\n
•\tWe can open multiple tabs in browser.
\n Important terms in Multithreading –\n
\n
Program: A set of instruction store in hard disk is called a program.
\n
Process: A program in RAM is called process.
\n
Thread: Thread is a process under the control of CPU.
\n \n
Thread Life Cycle –
\n
Thread goes through these stages in its life cycle.
\n
•\tNew
\n
•\tRunnable
\n
•\tRunning
\n
•\tNon- runnable
\n
•\tTerminated
\n \n
\n \n
\n
\n
•\tIn new state, thread instance has been created but start() is not yet invoked.
\n
•\tWhen start() is invoked thread is in runnable state.
\n
•\tAfter call the run() method thread is in running state.
\n
•\tWaiting thread is non-runnable state , in this state the thread is alive but not eligible to run.
\n
•\tIn dead state, thread is not alive.Once the run method is completed then it will destroy.
\n \n Multiprogramming :\n
When more than one process are queued in RAM for their execution the concept is known as multiprogramming.
\n
For Example: There are many students in queue for interview and only one student is interviewed is allow at a time, the process that is going on will be multiprogramming.
\n Multitasking: \n
When more than one process are under execution than the concept is known as multitasking.
\n
For Example: At a same I am using my worpad and as well as playing songs.
\n Multiprocessing :\n
When more than one processors are used in same system to solve single or multiple task than the concept is known as multiprocessing.
\n \n Thread can be created by using theses two ways:\n
1.\tExtended the Thread class
\n
2.\tImplementing the Runnable interface
\n Program by extending thread class\n
\n
\n
\n class ThreadExtend extends Thread{ \n public void run(){ \n System.out.println(\"Thread Created...\"); \n } \n public static void main(String[] args){ \n ThreadExtend obj=new ThreadExtend(); \n obj.start(); \n } \n }\n
\n
\n
\n Output:\n
\n
\n
\n Thread Created...\n
\n
\n
\n Program by implementing runnable interface.\n
\n
\n
\n class ThreadImplement implements Runnable{ \n public void run(){ \n System.out.println(\"Thread Created...\"); \n } \n public static void main(String[] args){ \n Thread obj = new Thread(new ThreadImplement()); \n obj.start(); \n } \n }\n
\n
\n
\n Output:\n
\n
\n
\n Thread Created...\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaPolymorphism extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Networking\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Networking\n
\n
Transmission of data from one system to another that connected via network.
\n
Java programming language have java.net package for networking programs. This package contains all classes and interfaces that are used in to share resources via network.
\n
These two protocols are used in networking –
\n
1.\tTCP
\n
2.\tUDP
\n
TCP – Transmission Control Protocol
\n
This is an Internet Protocol that provides for the reliable delivery of data from one host to another.
\n
It is based on IP.
\n
UDP – User Datagram Protocol
\n
It is a connection-less protocol, that enables packets of data to be transmitted between application.
\n
Some classes of java.net package –
\n
Inet address- This class represents an Internet Protocol address as two fields: hostname and address.
\n
URL- It is an acronym of Uniform Resource Locator .A standard for writing a text refrence to an arbitrary piece of data in www. A URL looks like 1 ”protocol://host/localinfo”.
\n
Where protocol specifies a set of rules for communication.
\n
For Example: TCP, FTP, Telnet, SMTP, POP etc.
\n
URL Connection- This class represents the communication between the application and a URL.
\n
Socket- java.net class implements socket .Socket is one endpoint between two way communications between two programs running on the internet.
\n
Server Socket- This class allows to act like a server for connection oriented connections.
\n
Datagram Packet – It is a connectionless socket that is used to implement a connection less delivery service.
\n
Datagram Socket – This class represents socket for sending and receiving datagram packets.
\n Serialization
In short , serialization is converting a file into byte stream. The objects in the file is converted to the bytes for security purposes.\n We need to import java.io.serialization.
\n
Deserialization is vice versa of serialization in which bytes stream is converted into files.
\n
ObjectOutputStream.writeObject Serialize the object and write the serialized object to a file.
\n
ObjectInputStream.readObject Read the file and deserializes the object.
\n Note :- We can skip the serialization for the variables in the file by using a Transient keyword.\n
\n Now , what is Transient variable?\n
These are not the part of serialization. During deserialization the transient variables values are set to default values. It is not used with static variables.\n
\n Program by extending thread class\n
\n
\n
\n class ThreadExtend extends Thread{ \n public void run(){ \n System.out.println(\"Thread Created...\"); \n } \n public static void main(String[] args){ \n ThreadExtend obj=new ThreadExtend(); \n obj.start(); \n } \n }\n
\n
\n
\n Output:\n
\n
\n
\n Thread Created...\n
\n
\n
\n Program by implementing runnable interface.\n
\n
\n
\n class ThreadImplement implements Runnable{ \n public void run(){ \n System.out.println(\"Thread Created...\"); \n } \n public static void main(String[] args){ \n Thread obj = new Thread(new ThreadImplement()); \n obj.start(); \n } \n }\n
\n
\n
\n Output:\n
\n
\n
\n Thread Created...\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaRegularExpression extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Regular Expression\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n Regular\tExpression\n
\n
Regular Expression is an API that is used to defining String patterns that we want to match to strings.
\n
Java provides java.util.Regex package for pattern matching .
\n
We can perform such tasks –
\n
•\tString matching with validation criteria.
\n
•\tData Extraction
\n \n
Package consists of 3 classes Pattern, Matcher and PatternSyntaxException.
\n
1.\tPattern – It defines the patterns that you want to search.
\n
2.\tMatcher – It is used for performing matching operations of pattern(the string you have entered).
\n
3.\tPatternSyntaxException – It indicates exceptions in Regular Expression Pattern. And package also consist of 1 Interface..
\n MatchResultInterface –
Hold the results of a successful match of a Pattern against a given String.
\n
\n A simple program of regex.\n
\n
\n
\n import java.util.regex.Pattern; \n public class RegexExample { \n public static void main(String args[]) { \n System.out.println(Pattern.matches(\"...s\", \"tuts\")); \n System.out.println(Pattern.matches(\".i...\", \"finder\")); \n System.out.println(Pattern.matches(\"tuts......\", \"tutsfinder\")); \n } \n }\n
\n
\n
\n Output:\n
\n
\n true\n false\n true\n
\n
\n
\n
Matching Symbols
\n
These are used to match the characters in the specefied string.
\n
\n
\n \n
\n
\n
Meta Character
\n
Meta characters have predefined meanings. They works as short code.
\n
\n
\n \n
\n
\n
Quantifiers
\n
Quantifiers define how many times an element can occur.
\n
\n
\n \n
\n
\n In this Program we have used matching symbols, meta characters and quantifiers.\n
\n
\n
\n import java.util.regex.*; \n class RegexExampleMain{ \n public static void main(String args[]){ \n System.out.println(Pattern.matches(\"[6789]{1}[0-9]{9}\", \"9897654321\"));//true \n System.out.println(Pattern.matches(\"[6789][0-9]{9}\", \"523164987\"));//false starts from 5 \n System.out.println(Pattern.matches(\"[tuts]?\", \"t\"));//true t comes only one time \n System.out.println(Pattern.matches(\"[tuts]+\", \"t\"));//true once or more times \n System.out.println(Pattern.matches(\"[tuts]\", \"s\"));//true (only from t, u, s) \n System.out.println(Pattern.matches(\"\\\\d\", \"tuts\"));//false (\\d only used for digits) \n System.out.println(Pattern.matches(\"\\\\d\", \"1\"));//true \n } \n }\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavaSwing extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Java Tutorials - Swing\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n Java Swing\n
\n
Swing is used to create windows based applications. Swing is a GUI(Graphical User Interface) toolkit for java.
\n
Swings components are not platfotm-specefic, they are written purely in java that’s why they are platform independent.
\n
Swing enables customization in look and feel of components in an application without making changes in the code. Also it supports pluggable look and feel.
\n
Swing components are loosely coupled because they makes use of MVC(Model/View/Controller) architecture.
\n
Model - It is responsible to store and manipulate data.
\n
View - It is responsible to represent data that model contains.
\n
Controller - It acts as bridge between Model and view.
\n \n
\n \n
\n \n
\n Program to show you how swing components works: \n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Introduction \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
\n \n
\n \n
\n
Introduction
\n
\n
What is HTML?
\n \n
HTML is a phrase which stands for Hyper text Markup Language which is used for creating web pages and web applications.
\n
As a word suggests hyper text means Text within Text. Whenever you click on any link and it redirects you to a new web page, means you have clicked on a hypertext.
\n
Markup Language is a computer language that is used to apply layout and formatting conventions to a text document. Markup language makes text more interactive and dynamic. It can turn text into images, tables, links etc.
\n
A web page is a document which is commonly written in HTML and translated by a web browser. A web page can be identified by entering a URL. Web pages are of two types static and dynamic, but with the help of HTML we can create only static pages.
\n
HTML elements are represented by tags and each tag contains different content.
\n
\n
\n
A Simple HTML Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title>Title of page </title> \n <head> \n <body> \n <h1> Write your First Heading </h1> \n <p> Write your First paragraph </p> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Elucidation of HTML example:
\n
<!DOCTYPE> : it defines the document type, also instruct the browser about version of HTML.
\n
<html> : this elements is a root element which works as a container for the html page, it contains each and everything which is defined in a html page except <!DOCTYPE>.
\n
<head> : this element is the first element under the <html> element which describes the meta information of page. Always it should be closed before body tag opens.
\n
<body> : text which is displayed to the end user is defined under the body tag, it contains the main content of the HTML document.
\n
<h1> : text define under this shows the first heading of the page.
\n
<p> : text define under <p> element shows the paragraph of the page.
\n
\n
\n
\n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Marquee from \"react-fast-marquee\";\nexport default class HtmlMarquees extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Marquees \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Marquees
\n
\n
An HTML Marquee tag is used to display a text or image scrolling horizontally or vertically.
\n
You can use Marquee tag if you want your text or image to be moved up, down, left or right automatically.
\n
NOTE: Marquees can use in Javascript and CSS, as it is deprecated in HTML5.
\n \n Syntax:\n \n
\n <marquee attribute name = “attribute_value”. . . more attributes>\n Lines or Images to be displayed\n </marquee>\n
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Marquee Tag </title> \n </head> \n <body> \n <marquee direction = “right”>TutsFinder - Elementary way to find</marquee> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Above example shows to move the text from left to right, similarly you can enter the values as left, up, down.
\n
\n
Table illustrating Marquee Tag Attributes
\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlTags extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Tags \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Tags
\n
\n
HTML tags are elements which defines that how web browser will format and display the content enclosed by angular brackets. With the help of tags, a web browser can distinguish between an HTML content and a simple content.
\n
Three main components of HTML tags:
\n
•\tOpening tag : <tagname>
\n
•\tContent
\n
•\tClosing tag : </tagname>
\n \n
Each HTML tags have different properties. Tags normally comes in a pairs like <h1> and </h1>.
\n
NOTE: Almost every open tag must be closed, but there is exception also, an example of a tag that does not have to be closed is an empty tag, such as the link break <br>.
\n \n
How to use HTML tag:
\n <tagname> Content </tagname>\n
\n
Some basic HTML tag examples
\n
\n
heading tag
\n
Italic tag
\n \n
underline tag
\n \n
bold tag
\n
\n \n \n
Tag Reference in Alphabetical Order
\n \n
\n
\n
TAG NAME
\n
Description\t
\n
Function
\n
\n
\n
<!--…-->
\n
Allows explanatory comments into our code.
\n
Basic
\n
\n
\n
<!DOCTYPE>
\n
Tell browser version of HTML/XHTML we're using.
\n
Basic
\n
\n
\n
<a>
\n
Define an anchor for links and hyperlinks.
\n
Links
\n
\n
\n
<abbr>
\n
Used to define an abbreviation in our HTML code.
\n
Formatting
\n
\n
\n
<acronym>
\t
Used to define an acronym in our HTML code.
\t
Formatting
\n
\n
\n
<address>
\t
Used to define an address in our HTML code.
\t
Formatting
\n
\n
\n
<applet>
\t
Defines an embedded Java applet.
\t
Programming
\n
\n
\n
<area/>
\t
Defines clickable areas on client side image.
\t
Image
\n
\n
\n
<b>
\t
Used for making text bold.
\t
Formatting
\n
\n
\n
<base/>
\t
Used to define a base URL for links on a page.
\t
Links
\n
\n
\n
<basefont/>
\t
Specify font values in HTML document.
\t
Meta
\n
\n
\n
<bdo>
\t
Defines a birectional override for some text.
\t
Formatting
\n
\n
\n
<big>
\t
Used for defining a large text style.
\t
Formatting
\n
\n
\n
<blockqoute>
\t
Used to define long quotations in our HTML code.
\t
Formatting
\n
\n
\n
<body>
\t
Specifies body element of HTML document.
\t
Structure
\n
\n
\n
<br/>
\t
Used to define a line break in our HTML code.
\t
Basic
\n
\n
\n
<button>
\t
Defines a clickable button in our HTML code.
\t
Forms
\n
\n
\n
<caption>
\t
Specifies a name for the table element in question.
\t
Tables
\n
\n
\n
<center>
\t
Used for centering text in HTML code.
\t
Formatting
\n
\n
\n
<cite>
\t
Used to define a citation in our HTML code.
\t
Formatting
\n
\n
\n
<code>
\t
Used to define text that looks like computer code.
\t
Formatting
\n
\n
\n
<col/>
\t
Used to specify criteria for a table column.
\t
Tables
\n
\n
\n
<colgroup>
\t
Used to specify criteria for a group of columns.
\t
Tables
\n
\n
\n
<dd>
\t
Define a definition description.
\t
Lists
\n
\n
\n
<del>
\t
Used to define editorial deletions in some text.
\t
Formatting
\n
\n
\n
<dfn>
\t
Used to define a definition term in our HTML code.
\t
Formatting
\n
\n
\n
<dir>
\t
Used to define a directory list.
\t
Lists
\n
\n
\n
<div>
\t
Group HTML blocks together for styling with CSS.
\t
Structure
\n
\n
\n
<dl>
\t
Used to define a definition list in our HTML code.
\t
Lists
\n
\n
\n
<dt>
\t
Define a definition term within a definition list
\t
Lists
\n
\n
\n
<em>
\t
Define text to be emphasised in our HTML code.
\t
Formatting
\n
\n
\n
<fieldset>
\t
Used for grouping form elements together.
\t
Forms
\n
\n
\n
<font>
\t
Specify font, font size and font colour.
\t
Formatting
\n
\n
\n
<form>
\t
Used to define an anchor for links and hyperlinks
\t
Forms
\n
\n
\n
<frame/>
\t
Define subwindow for another document.
\t
Frames
\n
\n
\n
<frameset>
\t
Frameset to hold multiple documents.
\t
Frames
\n
\n
\n
<h1>-<h6>
\t
Define the six HTML headings for use in our HTML
\t
Formatting
\n
\n
\n
<head>
\t
Specifies head element of HTML document.
\t
Structure
\n
\n
\n
<hr/>
\t
Used to define a horizontal rule in our HTML code.
\t
Basics
\n
\n
\n
<html>
\t
Specifies root element of HTML document.
\t
Structure
\n
\n
\n
<i>
\t
Define italic text in our HTML code.
\t
Formatting
\n
\n
\n
<iframe>
\t
Define inline window to hold another document.
\t
Inline Frame
\n
\n
\n
<img/>
\t
Create area on page to hold the referenced image.
\t
Images
\n
\n
\n
<input/>
\t
Used to define an area of a form for user input.
\t
Forms
\n
\n
\n
<ins>
\t
Used to define editorial insertions in our text.
\t
Formatting
\n
\n
\n
<isindex/>
\t
Define single line input control prompt.
\t
Forms
\n
\n
\n
<kbdv>
\t
Used to define keyboard text in our HTML code.
\t
Formatting
\n
\n
\n
<label>
\t
Label for input, select or textarea form element.
\t
Forms
\n
\n
\n
<legend>
\t
Used for defining a title for a fieldset element.
\t
Forms
\n
\n
\n
<li>
\t
Define list item in an ordered or unordered list.
\t
Lists
\n
\n
\n
<link/>
\t
Link to external resource such as image/stylesheet.
\t
Import
\n
\n
\n
<map>
\t
Define client-side image map with clickable areas.
\t
Images
\n
\n
\n
<menu>
\t
Used for defining a menu list.
\t
Lists
\n
\n
\n
<meta/>
\t
Send metadata about data within our HTML file.
\t
Meta
\n
\n
\n
<noframes>
\t
Content to render if frames unavailable.
\t
Frames
\n
\n
\n
<noscripts>
\t
Non script based rendering if JavaScript disabled.
\t
Programming
\n
\n
\n
<object>
\t
Used to define an embedded object in our HTML.
\t
Programming
\n
\n
\n
<ol>
\t
Used to define an ordered list in our HTML code.
\t
Lists
\n
\n
\n
<optgroup>
\t
Define related option groups within select element.
\t
Forms
\n
\n
\n
<option>
\t
Define a selectable option within a select element.
\t
Forms
\n
\n
\n
<p>
Create a paragraph of the enclosed content.
\t
Basic
\n
\n
\n
<param/>
\t
Define parameters for an embedded object.
\t
Programming
\n
\n
\n
<pre>
\t
Define preformatted text in our HTML code.
\t
Formatting
\n
\n
\n
<q>
\t
Define a short inline quotation in our HTML code.
\t
Formatting
\n
\n
\n
<s>
\t
Define a strike through text style.
\t
Formatting
\n
\n
\n
<samp>
\t
Define text that looks like sample computer code.
\t
Formatting
\n
\n
\n
<script>
\t
Define scripting language in HTML document.
\t
Programming
\n
\n
\n
<select>
\t
ed to define a drop-down list for selection.
\t
Forms
\n
\n
\n
<small>
\t
Define a small text style.
\t
Forms
\n
\n
\n
<span>
\t
Group inline HTML together for styling with CSS.
\t
Structure
\n
\n
\n
<strike>\t
Used for making strike through text.
\t
Forms
\n
\n
\n
<strong>\t
Define strongly emphasised text in our HTML code.
\t
Formatting
\n
\n
\n
<style>
\t
Style information into our HTML documents.
\t
Style
\n
\n
\n
<sub>
\t
Used for defining subscript text.
\t
Formatting
\n
\n
\n
<summary>
\t
It defines summary which can be used with <details> tag.
\t
Formatting
\n
\n
\n
<sup>
\t
Used for defining superscript text.
\t
Formatting
\n
\n
\n
<table>
\t
Used to define a table for displaying tabular data.
\t
Tables
\n
\n
\n
<tbody>
\t
Define group body information within a table.
\t
Tables
\n
\n
\n
<td>
\t
Used to define a table cell within a table element.
\t
Tables
\n
\n
\n
<textarena>
\t
Define a multiple line area for text input.
\t
Forms
\n
\n
\n
<tfoot>
\t
Define group footer information within a table.
\t
Tables
\n
\n
\n
<thead>
\t
Used to define a heading within a table element.
\t
Tables
\n
\n
\n
<time>
\t
It uses to define data/time.
\t
Forms
\n
\n
\n
<title>
\t
Defines the document title element of a HTML file.
\t
Meta
\n
\n
\n
<tr>
\t
Used to define a row within a table element.
\t
Tables
\n
\n
\n
<tt>
\t
Define teletype/monospaced text.
\t
Formatting
\n
\n
\n
<u>
\t
Underline text in our HTML code.
\t
Formatting
\n
\n
\n
<ul>
Defines an unordered list in our HTML code.
\t
Lists
\n
\n
\n
<var>
\t
Define text that looks like a computer variable.
\t
Formatting
\n
\n
\n
<video>
\t
It is used to embed a video content with an HTML document
\t
Images
\n
\n
\n
<wbr>
\t
It defines a position within text where break line is possible.
\t
Forms
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlForm extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Forms \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Forms
\n
\n
An HTML form is used when you want to collect the input from users.
\n
The user input then sent to a server for processing.
\n \n
Let us take an simple example to understand the use of HTML forms:
\n
During user registration you would like to collect information such as name, email address, password etc.
\n \n
When the registration is completed entering the required fields the data is posted to a back end application such as CGI, ASP script, PHP Script etc. The back end application will perform required processing on the passed data based on defined business logic inside the application.
\n \n Syntax for HTML form:\n \n
\n <form action = “Script URL” method = “GET|POST”>\n Form elements like radio button, input etc.\n </form>\n
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <body> \n <h1>HTML Forms</h1> \n <form action=\"/action_page.php\"> \n <label for=\"fname\"> First name: </label> \n <br> \n <input type=\"text\" id=\"fname\" name=\"fname\" value=\"John\"> \n <br> \n <label for=\"lname\">Last name:</label> \n <br> \n <input type=\"text\" id=\"lname\" name=\"lname\" value=\"Doe\"> \n <br><br> \n <input type=\"submit\" value=\"Submit\"> \n </form> \n <p>If you click the \"Submit\" button, the form-data will be sent to a page called \"/action_page.php\".</p> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Form Attributes
\n \n
Some attributes of form:
\n
1.\taction – backend script ready to process your passed data.
\n
2.\tMethod – method to be used to upload data, most commonly method that are used GET and POST.
\n
3.\tTarget – specify the target window or frame where the result of the script will be displayed.
\n
4.\tenctype – this attribute is used to specify how the browser encodes the data before it sends it to the browser.
\n \n
HTML Form Controls
\n
•\tText Input Controls
\n
There are three types of text input controls used in forms:
\n
1.\tSingle line text input controls- this control is used for items that require only one line of user input such as names, they are created using HTML <input> tag.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Text input control </title> \n <head> \n <body> \n <form> \n First name: <input type = “text” name = “first_name” /> \n <br><br> \n Last name: <input type = “text” name = “last_name” /> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Attributes of input tag:
\n
\n \n
\n
2.\tPassword input Controls
\n
This control is used to secure ur text, which makes the text itno characters as soon as user enter it, they are also created using <input> tag but type attribute is set to password.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Password Input control </title> \n <head> \n <body> \n <form> \n User Id : <input type = “text” name = “user_id”/> \n <br><br> \n Password <input type = “password” name = \"password\"> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Attributes of password tag:
\n
\n \n
\n
3.\tMultiple-line text input Controls
\n
This control is used when user is required to give the details in more than a single sentence. It is created using <textarea> tag.
This control is used when more than one option is required to be selected.
\n
They are created using <input> tag but type attribute is set to checkbox.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Checkbox Control </title> \n <head> \n <body> \n <form> \n <input type = \"checkbox\" name = \"English\" value = \"on\"> English \n <input type = \"checkbox\" name = \"Business Studies\" value = \"on\"> Business Studies \n </form> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n Attributes of Checkbox control:\n
\n \n
\n
5.\tRadio Button Control
\n
Radio buttons are used when user wants to select only one option out of many options.
\n
They are also created using <input> tag and type attribute is set to radio.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Radiobox Control </title> \n <head> \n <body> \n <form> \n <input type = \"radio\" name = \"subject\" value = \"English\"> English \n <input type = \"radio\" name = \"Subject\" value = \"Business Studies\"> Business Studies \n </form> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n Attributes of Radio box Control:\n
\n \n
\n
6.\tSelect Box Control
\n
Select box or drop down box provides option to list down various options in the form of drop down list, from where user can select one or more options.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Select Box Control </title> \n <head> \n <body> \n <form> \n <select name = “dropdown”> \n <option value = “Engineer” selected> Engineer </option> \n <option value = “Doctor” selected> Doctor </option> \n </select> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n Attributes of Select and option Tag:\n
\n \n
\n
7.\tButton Controls
\n
These are use to create clickable buttons, also be created using <input> tag by setting type attribute to button.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Button Control </title> \n <head> \n <body> \n <form> \n <input type = \"submit\" name = \"submit\" value = \"Submit\" /> \n <input type = \"reset\" name = \"reset\" value = \"Reset\" //> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n Attribute of Button Control:\n
\n \n
\n
8.\tFile Upload Box
\n
It is used when you want to allow a user to upload a file to your web site.
\n
This is also created using <input> tag and setting the type attribute to file.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlAnchorTags extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Anchor tag\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Anchor Tag
\n
\n
Anchor tag is a tag which defines a hyperlink that links one page to another page.
\n
Anchor tag is used to create a link between web pages, files, location, or any URL.
\n
The most important attribute of anchor (a) tag is href which is used to link destination page or URL.
\n
For using the target attribute of anchor tag it is must to have href attribute.
\n \n
Description of href attribute
\n
The href attribute is used to define the address of the file to be linked, basically it points out to the destination page.
\n \n Syntax:\n \n <a href = “. . . . . . . . . “> Text to be Linked </a>\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title></title> \n </head> \n <body> \n <p> Click on <a href= http://www.tutsfinder.com/ target=”_blank”> this-\n Link</a> to go to home page of tutfinder. </p> \n </body> \n </html>\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlAttributes extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Attributes\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Attributes
\n
\n
We have studied tags in previous chapters, likewise html elements can also have attributes which are extra bits of information. Tags comes in simpler way like <p>, <h1>, <title>.
\n
An attribute is used to define the characteristics of an HTML element and is always placed inside the opening tag containing two parts a name and a value.
\n
•\tThe name is the property you want to set.
\n
•\tThe value is what you want the value of property to be set and it should be always put within qoutations.
\n
\n
\n
HTML example for Attribute:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Align Attribute Example </title> \n </head> \n </body> \n <p align= “left”> This is left aligned </p> \n <p align= “center”> This is center aligned </p> \n <p align= “right”> This is right aligned </p> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Description for HTML example:
\n \n
In the above example the paragraph <p> element carries an attribute whose name is align, which is used to indicate the alignment of paragraph on the page.
\n
For the value in above example shows three possible values of align attribute i.e. left, center and right.
\n
Attribute names and Attribute values are case sensitive. However, we at Tutsfinder recommend lowercase attribute names.
\n
Some main Attributes of HTML
\n \n
HTML Title Attribute
\n \n
The title attribute is used as text tooltip in most of the browsers. It display its text when user move the cursor over a link or any text. You can use it with any text or link to show the description about that link or text.
\n Example:\n \n
\n <p title= “I’m a toottip”>\n This is a Paragraph.\n </p>\n
\n \n
HTML Style Attribute
\n \n
The style attribute allows you to specify Cascading Style Sheet (CSS) rule within the element.
\n Example:\n \n
\n <p style= “color:orange>\n This is a Paragraph.\n </p>\n
\n
HTML alt Attribute
\n
The alt attribute specifies and alternative text to be used, if an image cannot be displayed.
\n
The value of the alt attribute can be read by screen readers.
\n Example:\n \n <img src =“img_scenery.jpg” alt=”House with a lobby”>\n
\n
HTML class Attribute
\n
The class attribute is used to associate an element with a style sheet, and specifies the class of element, it is basically used In CSS.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlComments extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Comments \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Comments
\n
\n
Comments is a piece of code which increases the code readability and help the user to understand you code easily. Comment is not visible when the code is run on web browser.
\n
It is always a good practice to mention the comments in your code which also indicates the section of every document, specially if the code is complex then it make easier to read the code.
\n \n Syntax for Comment:\n \n <!--..-->\n \n
Any content place in between the <!--..--> indicates the comment and ignored by the browser.
•\tMultiline Comments- we can have multiple line of comments in our HTML document.
\n
•\tConditional Comments
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlElements extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Elements \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Elements
\n
\n
HTML elements are the main component of HTML file, which consists of the opening tag , closing tag and the content between the tags.
\n
When a tag is opened, content is introduced and the tag is closed, we have an element.
\n \n Example:\n
\n
\n
\n
OPENING TAG\t
\n
ELEMENT CONTENT\t
\n
CLOSING TAG
\n
\n
\n
<p>
\n
Write your paragraph here.
\n
</p>
\n
\n
\n
<h2>
\n
Write your heading here.
\n
</h2>
\n
\n
\n
\n <br>
\n
\n
\n
\n
\n
\n
HTML elements having no content and closing tag are called empty elements or self closing elements.
\n \n
Empty Element:
\n \n
All the elements in HTML do not require start tag and end tag, some elemets does not have content and closing tag which are known as empty elements or void elements.
\n
They are also known as unpaired tag.
\n
Example for empty element:
\n
<br> : represents a line break
\n
<ol> : used to make ordered list
\n \n
Nested HTML Elements
\n \n
HTML elements can be nested which means an element can contain another element.
\n
They are made up of tags, attributes, and content or other elements.
\n \n
NOTE: In nested HTML elements number of elements can be there except empty elements.
\n
\n
\n
Example for Nested elements:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body> \n <h1> My first heading </h1> \n <p> My first paragraph </p> \n </body> \n </html>\n
\n
\n
\n
\n
Elucidation of example:
\n \n
The </html> element defines the whole html file.
\n
Inside the </html> element is the </body> element.
\n
The body element defines the main content of html file which is displayed on browser.
\n
Every element is having opening and closing tag.
\n
Inside the body element there are two more elements named <h1> and <p>.
\n
\n Output:\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlIframes extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Iframes \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
IFrames
\n
\n
An HTML Iframe tag <iframe> is used to define a web page within a web page. It separate a document with a rectangular portion which indicates different document with in a document including scrollbars and borders.
The <noscript> tag is used to provide an alternate content for users that have disabled scripts in their browser or have a browser that doesn't support client-side scripts.
\n \n Example:\n \n
\n <script> \n document.getElementById(“demo”).innerHTML = “Hello JavaScript”; \n </script> \n <noscript> Sorry, your browser does not support Javascript! </noscript>\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlLinks extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Links \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Links
\n
\n
Links are the content which are found on all web pages, and is used to click from one page to another page.
\n
HTML links are also called as hyperlinks, when a user clicks on a hyperlink It redirects to another document.
\n
Identification for a hyperlink is when a user moves a mouse on hyperlink the arrow will turn into a little hand.
\n \n Syntax:\n \n
Hyperlinks are defined with the HTML <a> tag.
\n <a href = “url”> link text </a>\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title></title> \n </head> \n <body> \n <p> Click on <a href= http://www.tutsfinder.com/ target=”_blank”> this-\n Link</a> to go to home page of tutfinder. </p> \n </body> \n </html>\n
\n
\n
\n
\n
Target Attribute of HTML Link
\n
It specifies where to open the linked document.
\n
Values of target attribute:
\n
•\t_blank- open the linked document in a new window or tab.
\n
•\t_self- opens the linked document in the same window or tab.
\n
•\t_parent- opens the linked document in the parent frame.
\n
•\t_top- opens the linked document in the full body of the window.
\n \n
HTML links can have the following:
\n \n
Button as a Link
\n
To use an HTML button as a link, you have to add some JavaScript code.JavaScript allows you to specify what happens at certain events, such as a click of a button.
The title attribute specifies extra information about an element. The information is most often shown as a tooltip text when the mouse moves over the element.
\n
Example:
\n < a href = “http://www.tutsfinder.com/” title=”Go to Tutsfinder HTML tutorial”> Visit our HTML Tutorial </a>\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlLists extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Lists \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Lists
\n
\n
HTML lists allow users to group a set of related items in a lists.
2.\tUnordered lists or Bulleted list (ul) – unordered list are marked with bullets, and also known as Bulleted list. It starts with <ul> tag and each item starts with the <li> tag.
3.\tDescription List or Definition List (dl) – this type of list is supported by HTML and XML where records are listed like in a dictionary or encyclopedia.
HTML ordered lists or Numbered lists shows an element in numbered format.
\n
The HTML <olgt; tag is used to create ordered list. It can be used when user want to present the data in numerical or alphabetical order format, or any format where an order is emphasized.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlStructure extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Structure \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Structure
\n
\n
Choosing your HTML editor (HTML Structure)
\n \n
•\tAs a beginner to HTML, one should use the Notepad to create HTML page, as HTML file is a text file we can use any text editors.
\n
•\tAfter learning the basics, you can easily switch to some other professional text editors.
\n
•\tA good HTML editor will keep your code clean and organized, it will also detect when you open a new tag and automatically close it to avoid the buggy code.
\n \n
There are many free and paid HTML editors, below are the some top options you can choose:
\n
•\tHTML-Kit
\n
•\tCoffeeCup
\n
•\tKompoZer
\n
•\tNotepad++
\n
•\tCodelobster
\n \n
Steps for creating your first web page using Notepad:
\n \n
Step 1: Open Notepad on PC
\n \n
Open the start screen on the left bottom type Notepad on search bar.
\n
Step 2: Write some HTML code in notepad
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body> \n <h1> My first heading </h1> \n <p> My first paragraph </p> \n </body> \n </html>\n
\n
\n
\n
\n
Step 3: Saving your HTML page
\n \n
Save the html file which you have created in your computer choosing the path, select file Save as in the notepad menu or you can also save by clicking CTRL+S.
\n
Name the file and save it with extension .htm or .html.
\n
Step 4: Viewing the HTML page in your browser
\n
Open the saved HTML file in your browser (Internet explorer or mozilafirefox), double click on the file, or choose the browser by clicking right click and open with.
\n \n Output:\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlMetaTag extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Meta Tag \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Meta Tag
\n
\n
The Meta tag means Information about data. It provides information about HTML document. These tags are basically used to add name/value pairs to describe properties of HTML document.
\n
For example: expiry date, author name, list of keywords.
\n
This tag is an empty element which means it is only having opening tag and there is no closing tag defined in it. It carries information within its attributes.
\n
A HTML document can contain number of meta tag depending on the information.
\n
Meta tags are always go inside the <head> element.
\n \n
Adding Meta Tags to your Documents
\n
•\tName Attribute: This attribute is used to define the name of the property.
\n
•\thttp-equiv attribute: This attribute is used to get http response message header.
\n
•\tScheme attribute: This attribute is used to specify a scheme to interpret the property’s value.
\n
•\tContent attribute: This attribute is used to specify properties value.
\n \n
Specifying keywords
\n
The meta data is used to specify the important keyword related to the HTML document.
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Example for meta tag </title> \n <meta name = “keywords” content = “meta Tags, Metadata”/> \n </head> \n </body> \n <p> Hello TutsFinder! </p> \n </body> \n </html>\n
\n
\n
\n
\n
Document Description
\n
The meta data is used in HTML document to provide short description about the document.
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Example for meta tag </title> \n <meta name = “keywords” content = “Meta Tags, Metadata”/> \n <meta name = “description” \n Content = “TutsFinder is a portal where you can find every tutorial.”/> \n </head> \n </body> \n <p> Hello TutsFinder! </p> \n </body> \n </html>\n
\n
\n
\n
\n
Document Revision Date
\n \n
The meta tag is used to give the information about last updated document.
\n
This information is used by various browser when refresh web page.
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Example for meta tag </title> \n <meta name = “keywords” content = “Meta Tags, Metadata”/> \n <meta name = “description” \n Content = “Description about Meta tags”/> \n <meta name = “revised detail” \n Content= “Last updated time”/> \n </head> \n </body> \n <p> Hello TutsFinder! </p> \n </body> \n </html>\n
\n
\n
\n
\n
Document Refreshing
\n
This meta tag is used to specify a duration after which the web page will keep refreshing automatically after the given duration. Below example shows to refresh the page after 10 sec:
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Example for meta tag </title> \n <meta name = “keywords” content = “Meta Tags, Metadata”/> \n <meta name = “description” \n Content = “Description about Meta tags”/> \n <meta name = “revised about” \n Content= “TutsFinder”/> \n <meta http-equiv = “refresh” content = “10”/> \n </head> \n </body> \n <p> Hello TutsFinder! </p> \n </body> \n </html>\n
\n
\n
\n
\n
Setting Author Name
\n
The name of the author can be set in web page through HTML document using meta tag.
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> Example for meta tag </title> \n <meta name = “keywords” content = “Meta Tags, Metadata”/> \n <meta name = “description” \n Content = “Description about Meta tags”/> \n <meta name = “author” content = “Trishant Kumar” /> \n </head> \n </body> \n <p> Hello TutsFinder! </p> \n </body> \n </html>\n
\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlSTyles extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Style \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Styles
\n
\n
Stlye is an attribute pf HTML which is used to add styles to an element such as color, font, size, etc.
\n
It provides easy and effective alternatives to specify various attributes for the HTML tags.
The property is a CSS property and the value is CSS value, you will learn more about CSS in CSS tutorial.
\n
\n
\n
Below example showing background color of a page:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body> \n <p>I am normal</p> \n <p style=\"color:yellow;\">I am yellow</p> \n <p style=\"color:red;\">I am red</p> \n <p style=\"font-size:20px;\">I am small</p> \n </body> \n </html>\n
\n
\n
\n
\n
The HTML Style Attribute
\n
Text Color
\n
It defines the text color of an element by using property color.
\n
\n
\n
Below example showing background color of a page:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body> \n <h1 style=\"color:green;\">This is a heading </h1> \n <p style=\"color:yellow;\">This is a paragraph. </p> \n </body> \n </html>\n
\n
\n
\n
\n
Background Color
\n
It defines the background color of an element by using background-color property.
\n
\n
\n
Below example showing background color of a page:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body style=\"background-color:blue;\"> \n <h1> This is a heading</h1> \n <p> This is a paragraph.</p> \n </body> \n </html>\n
\n
\n
\n
\n
HTML Fonts
\n
It defines which font is to be used by using font-family property.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body> \n <h1 style=\"font-family:Calibri;\">This is a heading</h1> \n <p style=\"font-family:courier;\">This is a paragraph.</p> \n </body> \n </html>\n
\n
\n
\n
\n
Text Alignment
\n
It defines the text alignment by using the text-align property.
It defines the text size of an element by using font-size property.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <body> \n <h1 style=\"font-size:200%;\">This is a heading</h1> \n <p style=\"font-size:150%;\">This is a paragraph.</p> \n </body> \n </html>\n
\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlStructure extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Text Formattings Tags\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Text Formatting Tags
\n
\n
As a word suggest Formatting is a way to present your text in a more attractive and enhanced way.
\n
Formatting can be done in many ways like bold, italic, underlined.
\n
Bold Text
\n
<p>Anything that appears within <b>../b> element is displayed in bold.</p>
\n Example:\n
<p>The following word uses a <b> bold </b> typeface. </p>
\n
Underlined Text
\n
Anything that appears within <u>..</u> elements is displayed with underline.
\n Example:\n
<p>The following word uses an <u> underlined </u> typeface. </p>
\n
Italic Text
\n
Anything that appears within <i>..</i> elements is displayed in italicized.
\n Example:\n
<p>The following word uses an <i> italicized </i> typeface. </p>
\n
Small Text
\n
The content displayed in <small>..</small> elements shows the size of font one smaller than the rest of the text.
\n Example:\n
<p>The following word uses a <small> small </small> typeface. </p>
\n
Large Text
\n
The content displayed in <large>..</large> elements shows the size of font one larger than the rest of the text.
\n Example:\n
<p>The following word uses a <large> large </large> typeface. </p>
\n
Superscript Text
\n
The content of a <sup>..</sup> element is written in a superscript, the font size is same it just shows the text half a character’s size above the other characters.
\n Example:\n
<p>The following word uses a <sup> superscript </sup> typeface. </p>
\n
Subscript Text
\n
The content of a .. element is written in a subscript, the font size is same it just shows the text half a character’s size beneath the other characters.
\n Example:\n
<p>The following word uses a <sub> subscript </sub> typeface. </p>
\n
Monospaced Font
\n
It is used when you want to write your text having same width for each character.
\n Syntax:\n <tt>.. </tt>\n \n Example:\n
<p>The following word uses a <tt>monospaced font </tt> typeface. </p>
\n
Grouping Content
\n
The <div> and <span> elements allow you to group together several elements to create sections or subsections of a page.
\n
Below table consisting of some other formatting elements that are commonly used.
\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlSVG extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - SVG \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML SVG
\n
\n
SVG is also a category of HTML graphics which defines vector based graphics in XML format.
\n
SVG stands for Scalable Vector Graphics. SVG is used to define graphics for the web.
\n \n
The HTML <svg> Element
\n
It is a container for SVG graphics.
\n
SVG has several methods for drawing paths, boxes, circles, text, and graphic images.
As we study two types of Graphic element in HTML SVG and Canvas, let us now study about the difference between both.
\n
SVG is a language for describing 2D graphics in XML.
\n
Canvas draws 2D graphics, on the fly (with a JavaScript).
\n
SVG is XML based, which means that every element is available within the SVG DOM. You can attach JavaScript event handlers for an element.
\n
In SVG, each drawn shape is remembered as an object. If attributes of an SVG object are changed, the browser can automatically re-render the shape.
\n
Canvas is rendered pixel by pixel. In canvas, once the graphic is drawn, it is forgotten by the browser. If its position should be changed, the entire scene needs to be redrawn, including any objects that might have been covered by the graphic.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlMultimedia extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Multimedia \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Multimedia
\n
\n
HTML multimedia element is used when user wants to add music or video into a webpage.
\n
The easiest way to add video or sound to you web page is to include the special HTML tag called <embed>.
\n
<embed> tag allows the browser to include the controls for the multimedia automatically provided browser supports <embed> tag and given media type.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HtmlStructure extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HTML Tutorials - Table \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
HTML Tables
\n
\n
This feature of HTML allows the user to arrange the data in rows and columns of cells which is in image, text, links etc.
\n
The HTML tables are created using <table> tag in which the <tr> tag is used tto create rows and <td> tag is used to create data cells. The elements under <td> are regular and left align by default.
Border attribute is used to set the border of table, if you do not want to put the border you can enter the value as 0.
\n
Table Header, Body and Footer
\n \n
Three elements of table which separates the table:
\n \n
•\t<thead> - to create separate table header.
\n
•\t<tbody> - to show the main body of table.
\n
•\t<tfoot> - to create separate table footer.
\n
NOTE: In a table there will be always one header and one footer, but the body can element may be differ depending upon the content to show the different pages or group of data.
\n
\n
\n
Example:
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <title> HTML table </title> \n </head> \n <body> \n <table border=\"1\" width=\"100%\" style=\"text-align:center\"> \n <thead> \n <tr> \n <td colspan=\"4\"> This is the head of the table</td> \n </tr> \n </thead> \n <tfoot> \n <tr> \n <td colspan=\"4\"> This is the foot of the table</td> \n </tr> \n </tfoot> \n <tbody> \n <tr> \n <td>Cell 1</td> \n <td>Cell 2</td> \n <td>Cell 3</td> \n <td>Cell 4</td> \n </tr> \n </tbody> \n </table> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
Attributes of Table:
\n
1.\tTable Heading
\n
This attribute is used to define the heading of table.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppIntroduction extends React.Component {\n componentDidMount() {\n $(document).ready(function () {\n window.scrollTo(0, 0);\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Introduction\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
\n \n
\n \n
These tutorials starts with the very basics of C++. An existing knowledge of C language would be an advantage but it is not prerequisite. All that is needed is a desire to learn this language and curiosity to understand how C++ works. So let’s get stared –
\n
Introduction
\n \n
C ++ is considered as an intermediate-level programming language, which means that it allows high level programming of applications as well as low level of libraries that works to close o the hardware.
\n
C++ is general purpose mid level language developed by Bjarne Stroustroup at Bell Labs in 1979.
\n
C++ is a successor of C Language.
\n
C++ is object oriented language and it implements concepts such as inheritance, abstraction , encapsulation, polymorphism.
\n
In 1998, C++ first standard version was sanctioned by ISO committee in ISO/IEC.
\n
Applications that are using C++ -
\n
1.\tOperating Systems
\n
2.\tDevice drivers
\n
3.\tOffice applications
\n
4.\tWeb servers
\n
5.\tCloud based applications
\n
6.\tSearch engines
\n
7.\tNetwork programming language
\n \n \n
\n
\n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppAbstraction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Abstraction\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Abstraction
\n \n
Abstraction is a process to hide the implementation details from the users and showing only the functionality. It displays only essential things.
\n
Data abstraction is the most essential feature of Object Orientd programmin C++.
\n
For example: Like ATM Machine, we can see only functionality but don’t know internal details that how it works.
\n
Advantages:
\n \n
• Increases reusability of code by minimizes code redundancy.
\n
• Separates program into code and implementation.
\n
• Increases code readability.
\n
We can achieve abstraction by using these two ways in C++
\n \n
By using Classes: In class we can group data members and member functions using access specefiers.A class can allow which data members will be visible the class and which is not.
\n
By using Header files: One more type of abstraction in C++ can be header files. We can use many method which is already defined in header files of C++. For example – sqrt(), whenever we need to calculate the square root of any number, we just need to implement math.h class.
\n
\n
\n
\n #include <iostream> \n using namespace std; \n class Multiplication { \n (// constructor) \n public: \n Multiplication(int i=1) { \n Ans = i; \n } \n void mul(int num) { \n Ans *= num; \n } \n int getMult() { \n return Ans; \n }; \n private: \n (// hidden data from outside world) \n int Ans; \n }; \n int main() { \n Multiplication obj; \n obj.mul(5); \n obj.mul(2); \n obj.mul(3); \n cout << \"Ans is : \" << obj.getMult() << endl; \n return 0; \n }\n
\n
\n
\n Output:\n
\n
\n
\n Ans is : 30\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppArrays extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Arrays\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Arrays
\n \n
An array is a group of elements forming a complete building block.
\n
The following are characteristics of an array –
\n
•\tAn array is a collection of elements.
\n
•\tAll elements contained in an array are of same data type.
\n
•\tThis collection forms a complete set.
\n
In C++, arrays enable you to store data elements of a type in the memory, in a sequential order.
\n \n
Array Declaration and Initialization
\n
If you want use array in your program then first declare variable and initialize the value to that variable.
\n
Syntax: dataType array_name[]={ };
\n
Example: int myarray [] = { 7,8,4,21};
\n \n
Need for Arrays –
\n
Imagine that you are writing a program to display the 5 different types of integers. Declaration would look like this –
\n
\n int a=0;\n int b=0;\n int c=0;\n int d=0;\n int e=0;\n
\n
If your user wants this program to store and display 100 integers value, now first you have to declare 100 integers using the preceding system. This would be very time consuming. So there in concept that is array.
\n
Declaring an array of 5 integers –
\n
Int arr[5]={0};
\n Program to declaring an array of integers and accessing its elements\n
\n
\n
\n #include <iostream> \n using namespace std; \n int main() \n { \n int arr[5]={12,45,18,7,8}; \n cout << \"First element at index 0: \" << arr[0] << endl; \n cout << \"Second element at index 1: \" << arr[1] << endl; \n cout << \"Third element at index 2: \" << arr[2] << endl; \n cout << \"Fourth element at index 3: \" << arr[3] << endl; \n cout << \"Fifth element at index 4: \" << arr[4] << endl; \n }\n
\n
\n
\n Accessing elements by traversing –\n
\n
\n
\n #include <iostream> \n using namespace std; \n int main() \n { \n int arr[5]={12,45,18,7,8}; \n cout << \"Elements of an array\" << endl; \n for(int i=0;i<5;i++) \n cout << arr[i]<<\"\\n\"; \n }\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppClassAndObjects extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Class And Object\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Class and Objects
\n \n
Class
\n \n
Class is a type that defines the implementation of a particular kind of object.
\n
A class is a blue print of the object. A class describes all the attributes and methods of object.
\n
Class keyword is used to declare the new class.
\n
•\tData(variables) and methods defined within the class.
\n
•\t Variables and methods are called members of class.
\n
•\t Data are data members or instance variables of the class.
\n
•\tMethods are called member functions of the class.
\n
Example – A class that models a car looks like the following
An object is an instance of class. An object is an real world entity that has some attributes, behavior and identity. Attributes and behavior of an object are defined by the class definition.
\n
A class is like a blueprint , and declaring a class alone has no effect on the execution of a program.
\n
Objects have states and behaviours -
\n
• State defines the characteristic of the object e.g. Car brand is BMW, color Black etc.
\n
• Behaviour defines the functionality of the object e.g. gear change, sun roof open etc.
\n \n Example: In this example we have created a Car class which has one method printInfo() . We have creating a object of Car class and print it.\n
\n
\n
\n #include <iostream> \n using namespace std; \n class Car \n { \n (// Access specifier) \n public: \n (// Data Members) \n string brand; \n string model; \n string color; \n (// Member Functions()) \n void printInfo() \n { \n cout << \"Details about Car : \" << brand+\" \"+model+\" \"+color << endl; \n } \n }; \n int main() { \n (// Declare an object of class geeks) \n Car obj; \n (// accessing data member) \n obj.brand = \"BMW\"; \n obj.model = \"X5\"; \n obj.color = \"Black\"; \n (// accessing member function) \n obj.printInfo(); \n return 0; \n }\n
\n
\n \n \n Output:\n
\n
\n
\n Details about Car : BMW X5 Black\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class ConrolStatements extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Control Statements\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Control Statements
\n \n
Control Statements controls the flow of program execution.
\n
These are keywords that are used for making a decision. In this, we will discuss about conditional statements and unconditional statements. These statements are used to control the flow of statements.
\n
Conditional Statements
\n
Conditional Statements are used when the execution of statements depends on one or more conditions.
\n Decision making statements :\n
•\tIf
\n
•\tIf-else
\n
•\tif-else-if
\n
Example of if statement –
\n \n
\n
\n #include <iostream> \n using namespace std; \n int main() \n { \n int num; \n cout << \"Enter an integer: \"; \n cin >> num; \n (// checks if the number is positive) \n if ( num > 0) \n { \n cout << \"You entered a positive integer: \" << num << endl; \n } \n return 0; \n }\n
\n
\n
\n Output :\n
\n
\n
\n Enter an integer: 5 \n You entered a positive integer: 5\n
\n
\n
\n
Syntax of if-else statement -
\n
\n if(condition) \n { \n (//statement if condition is true) \n } \n else \n { \n (//statement if condition is false) \n }\n
\n \n Program to show how to use if else statement\n
\n
\n
\n #include <iostream> \n using namespace std; \n int main() \n { \n int num; \n cout << \"Enter an integer: \"; \n cin >> num; \n if ( num >= 0) \n { \n cout << \"You entered a positive integer: \" << num < endl; \n } \n else \n { \n cout << \"You entered a negative integer: \" << num << endl; \n } \n return 0; \n }\n
\n
\n
\n Output :\n
\n
\n Enter an integer: -23 \n You entered a negative integer: -23\n
\n
\n
\n Program of if else if statement –\n
\n
\n
\n #include<iostream> \n using namespace std; \n int main(){ \n int num; \n cout << \"Enter an integer number between 1 & 9999: \"; \n cin >> num; \n if(num < 10 && num < =9){ \n cout << \"It's a one digit number\"; \n } \n else if(num < 100 && num > =1) { \n cout << \"Its a two digit number\"; \n } \n else if(num < 1000 && num > =100) { \n cout << \"Its a three digit number\"; \n } \n else if(num < 10000 && num > =1000) { \n cout << \"Its a four digit number\"; \n } \n else { \n cout << \"number is not between 1 & 9999\"; \n } \n return 0; \n }\n
\n
\n
\n
\n
\n Enter an integer number between 1 & 9999: 15 \n Its a two digit number\n
\n
\n
\n
Uncoditional Statements
\n
Uncoditional Statements are not used to satisfy any conditions, they immediately move the control of program to another part
\n
goto - Goto statement is used to take control of the program to any part of the program.
In above example,when goto statement is encountered , it takes control to the place where label is defined in the program.
\n
break - This statement is used to change the normal flow of the program. It is used to terminate the loop means break th ecurrnet flow of the program.
\n
continue - Where continue statement encountered inside a loop ,control directly jumps to the begining of the loop of next iteration.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppDataTypes extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Data Types\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Data Types
\n \n
Data type defines the type of variable that which type of variable you are using in you program.
\n
C language have pre defined set of data types to handle different type of data.
\n
Eg. int a;
\n
Primitive Data type - Primitive data types are fundamentals data types. There are 8 primitive data types, they are predefined by the language.
\n
1.\tByte
\n
2.\tShort
\n
3.\tInt
\n
4.\tLong
\n
5.\tFloat
\n
6.\tDouble
\n
7.\tBoolean
\n
8.\tChar
\n \n
Derived Data type - The data types that are derived from primitive data types are known as derived data types.
\n
1.\tArray
\n
2.\tPointer
\n \n
Enumeration - Enum is a user defined data type that is used to store constant values that makes a program readable and simple.
\n \n
Structure - It is a user define data type which is used to grouping simple data types.
\n \n \n
\n
\n \n
\n
Data Type
\n
Size
\n
Range
\n
\n
\n
char
\n
1 byte
\n
-128 to 127 or 0 to 255
\n
\n
\n
unsigned char
\n
1 byte
\n
0 to 255
\n
\n
\n
signed char
\n
1 byte
\n
-128 to 127
\n
\n
\n
int
\n
2 or 4 bytes
\n
-32,768 to 32,767 or -2,147,483,648 to 2,147,483,647
\n
\n
\n
unsigned int
\n
2 or 4 bytes
\n
0 to 65,535 or 0 to 4,294,967,295
\n
\n
\n
short
\n
2 bytes
\n
-32,768 to 32,767
\n
\n
\n
unsigned short
\n
2 bytes
\n
0 to 65,535
\n
\n
\n
long
\n
8 bytes
\n
-9223372036854775808 to 9223372036854775807
\n
\n
\n
unsigned long
\n
8 bytes
\n
0 to 18446744073709551615
\n
\n
\n
float
\n
4 byte
\n
1.2E-38 to 3.4E+38
\n
\n
\n
double
\n
8 byte
\n
2.3E-308 to 1.7E+308
\n
\n
\n
long double
\n
10 byte
\n
3.4E-4932 to 1.1E+4932
\n
\n \n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppFunctions extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Functions\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Functions
\n \n
Function in C++ are same as function in C. Function is a block of code where we can implement our data to execute it. It is design to perform specific task. Functions have unique name so that other functions can call it or execute it.
\n
Example-
\n
\n void xyz(){ \n (//code) \n }\n
\n
Every program has at least one function, that is main() function. main() function tells the compiler that program execution will be start from here.
\n
To define a function these parts play an role –
\n
Return Type – Every function should have any return type either it is void or any other primitive data type.
\n
Function Name – Function name must be unique. This is the name of the function that we have to execute.
\n
Parameters – Parameters are optional, if you need to pass the parameter then you can. It declares the type and no. of arguments.
Return values – void function does not return any value, if you wants to return value then you have to used any data type (int, string etc.) and use the return keywords inside the function.
\n
For Example –
\n
\n int main(){ \n (//code) \n return 0; \n }\n
\n
There are two types of function –
\n
1.\tLibrary functions
\n
2.\tUsed define functions
\n
Library functions - These are pre-define functions or built in functions used in C++ programming.
\n
We can used directly by invoking function directly.
\n
For Example – toUpper(c), toLower(c), sqrt(x), isdigit(c), sin(x) , cos(x)
\n
Users define functions – These functions can be created by users, these are user defined functions. It allows user to provide extra functionality in a program besides built functions.
\n Program to show user define functions –\n
\n
\n
\n #include <iostream> \n using namespace std; \n int area (int x); //declaring function \n int main() \n { \n int a = 5; \n int b = area(a); //calling function \n cout << b; \n } \n int area (int x) //defining function \n { \n return (x*x); \n }\n
\n
\n
\n
There are two ways to calling a function –
\n
1. Call by Value
\n
2. Call by Reference
\n
1.\tCall by Value – In call by value the value is passed in function as an argument.
\n
Both the actual and formal parameters refer to the same location. So, if you make any changes inside the function, then they are not reflected back in actual parameters.
\n
\n
\n
\n #include <iostream> \n using namespace std; \n int add(int a,int b); \n int main() \n { \n int a = 5; \n int b = 10; \n int c; \n c=add(a,b); \n cout << \"Addition of sum is : \" << c << endl; \n return 0; \n } \n int add(int a, int b) \n { \n return a+b; \n }\n
\n
\n
\n Output:\n
\n
\n
\n Addition of Sum is : 15\n
\n
\n
\n
2. Call by reference – In call by reference we can pass the address of the variable as an argument.
\n
This method copies the reference of actual parameters into the formal parameters. And both parameters stored in different memory location.
\n
\n
\n
\n #include <iostream> \n using namespace std; \n (// Function prototype) \n void swap(int*, int*); \n int main() \n { \n int a = 7, b = 8; \n cout << \"a & b Before swapping\" << endl; \n cout << \"a = \" << a << endl; \n cout << \"b = \" << b << endl; \n swap(&a, &b); \n cout << \"\\na & b After swapping\" << endl; \n cout << \"a = \" << a << endl; \n cout << \"b = \" << b << endl; \n return 0; \n } \n void swap(int* n1, int* n2) { \n int temp; \n temp = *n1; \n *n1 = *n2; \n *n2 = temp; \n }\n
\n
\n
\n Output:\n
\n
\n
\n a & b Before swapping \n a = 7 \n b = 8 \n a & b After swapping \n a = 8 \n b = 7 \n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppFirstProgram extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - How to write first program in C++\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
First Program in C++
\n \n
Now that you have know about tools, it is time to program your first C++ program.
\n \n
Writing a program is first step towards creating an executable. The basic steps in creating applications in C++, If you are on windows, you can follow these steps –
\n \n
1.\tOpen any text editor and write your code.
\n
2.\tSave it with any name with .cpp extension.
\n
3.\tIf you are using Turbo C++ press , Ctrl+F9 to run the program.
\n
But we are using Blocks to run C++ code.
\n \n
Program to print Hello World –
\n
\n
\n
\n #include <iostream> \n using namespace std; \n int main() { \n cout << \" Hello World ! \"; \n return 0; \n }\n
\n
\n \n \n \n \n \n
Output:
\n
\n
\n
\n Hello World !\n
\n
\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppEncapsulation extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Encapsulation \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Encapsulation
\n \n
It is mechanism to encapsulate or wrap up all the data members and member functions into a single entity that is class .It is used to prevent data from directly access. It is on eof the important feature of ObjectOriented that is helps in to data hiding.
\n
Encapsulation can be achieved in two ways:
\n
1. By using setter and getter methods.
\n
2. Making all variables as private.
\n
\n
\n
\n class Car { \n public: \n double printInfo(void) { \n cout << ”Brand is BMW”; \n cout << ”Model is X5”; \n } \n private: \n int price; \n };\n
\n
\n
\n
The variable price is set to private. This means that this can be accessed only by other members of the Car class, and not by any other part of your program. This is one way to achieve encapsulation in C++.
\n
\n
\n
\n #include <iostream> \n using namespace std; \n class Exp \n { \n private: \n int x; \n public: \n Exp(int a) \n { \n x =a; \n } \n int display() \n { \n return x; \n } \n }; \n int main() \n { \n Exp a(8); \n cout << \"Number is: \" << a.display(); \n return 0; \n }\n
\n
\n
\n Output:\n
\n
\n
\n Number is: 8\n
\n
\n
\n
In the above program, we show how encapsulation works. We have a private member x which cannot be accessed from the main function. The only way to access it is by creating a object of class Exp.
\n
\n
\n
\n #include <iostream> \n using namespace std; \n class Multiplication { \n (// constructor) \n public: \n Multiplication(int i=1) { \n Ans = i; \n } \n void mul(int num) { \n Ans *= num; \n } \n int getMult() { \n return Ans; \n }; \n private: \n (// hidden data from outside world) \n int Ans; \n }; \n int main() { \n Multiplication obj; \n obj.mul(5); \n obj.mul(2); \n obj.mul(3); \n cout << \"Ans is : \" << obj.getMult() << endl; \n return 0; \n }\n
\n
\n
\n Output:\n
\n
\n
\n Ans is : 30\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppEnvironmentSetup extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - How to setup envirnmental variables in C++\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Environment Setup
\n \n
For running a C++ program, all you need to have a notepad and a compiler. There are various compiler in today’s market GCC, MinGW and you can also use IDE’s such Visual Studio, Blocks.
\n
Text Editor – Text editor is used to edit a plain text, we can write our C++ code in text editor,the file in a text editor is our source file that can be executed by the compiler to convert it into machine language. Some text editors are notepad++, sublime text.
\n
Compiler – C++ compiler is used to convert our source file into machine language code.
\n
Original C++ program is source code and the resulting code will be object file.
\n
Compiler is itself a computer program . Examples of compiler are – GCC, MingGW.
\n \n
How to install in Linux –
\n \n
To install GNC C/C++ compiler in linux you have to follow this command -
To install compiler on windows, first go to official website of MinGW and click on download button.
\n
After successful installation check the version of your compiler with the following command –
\n
gcc --version
\n
you will get this output
\n \n
\n
\n gcc (tdm64-1) 5.1.0\n Copyright (C) 2015 Free Software Foundation, Inc.\n This is free software; see the source for copying conditions. There is NO\n warranty; not even for MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppExceptionHandling extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Exception Handling\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Exception Handling
\n \n
Exception is an event that occurs during an execution of a program that disrupts the normal flow the program.
\n
To handle these exceptions, there be a concept in java that is Exception handling; it maintains the normal flow of the program.
\n
Main advantage of exception handling is that it’s maintain the normal flow of the program and Separate error handling code form normal code.
\n
Exception can be occurred due to wrong input data e.g. divide by zero.
\n
There are three keywords in C++ associated with exception handling
\n
Try – To make statements exception safe, enclose them within a try block and handle the exceptions that emerge out of try block in the catch block.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppVariables extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Variables\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Variables
\n \n
Variables are used to store data, it tell the compiler the nature of the data and compiler reserves the necessary space for it.
\n \n
Rules to define variables in C++
\n
1. A variable contains only alphanumeric characters(a-z , A-Z , 0-9) and underscore(_).
\n
2. The first character of a variable should start with alphabet(a-z , A-Z) or underscore (_).
\n
3. Variables are also case sensitive.
\n
4. Keep variables name in small alphabets
\n \n
Syntax – type variable_name;
\n
For Example – int x ,float y
\n \n
Following example will help you to understand what variables are.
\n
Assume you are writing a program to addition of two numbers. The user has to enter some input for that operands, user needs some memory area to store that two input values, therefore we named that two variables a and b and store in another variable sum so these memory names is known as variables.
\n \n
Program to show addition of two numbers where we will take 3 variables, let’s see how it works
\n
\n
\n
\n #include <iostream> \n using namespace std; \n \n int main() { \n int a,b,sum; \n cout << \" Enter first number \"; \n cin >> a; \n cout << \" Enter second number \"; \n cin >> b; \n sum=a+b; \n cout << \" Sum of a & b is \" << sum; \n return 0; \n }\n
\n
\n
\n
Output :
\n \n \n
\n
\n Enter first number10 \n Enter second number5 \n Sum of a & b is 15\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppInterface extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Interface\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Interface
\n \n
Interface contains only undefined methods i.e. abstract methods(methods without body). A class can implement interface through implements keyword.
\n
Interfaces cannot be instantiated, but can be implemented.
\n
The methods we declare in interface, it is necessary to define them in the class in which we are implementing them otherwise compiler gives an error.
\n
Abstraction can be achieved in C++ by using Abstract class and Interfaces.
\n
Abstract Class – In C++, a class is made abstract class by declaring at least one of its function as pure virtual function. In pure virtual function just placing “=0” in its declaration.
\n
\n Program to demonstrate abstract claa with on virtual function –\n
\n
\n
\n #include <iostream> \n using namespace std; \n class Vehicle \n { \n public: \n virtual void run()=0; \n }; \n class Bike : Vehicle \n { \n public: \n void run() \n { \n cout << \" Bike is running...\" << endl; \n } \n }; \n class Car : Vehicle \n { \n public: \n void run() \n { \n cout << \"Car is running...\" << endl; \n } \n }; \n int main( ) { \n Bike bike; \n Car car; \n bike.run(); \n car.run(); \n return 0; \n }\n
\n
\n
\n Output –\n
\n
\n
\n Bike is running... \n Car is running...\n
\n
\n
\n
Rules of Abstract Class
\n
1.\tAny class that has a pure virtual function is an abstract class.
\n
2.\tWe cannot create the instance of abstract class.
\n
3.\tWe can create pointer and reference of base abstract class points to the instance of child class
\n
4.\tAbstract class can have constructors.
\n
5.\tIf the derived class does not implement the pure virtual function of parent class then the derived class becomes abstract.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppLoops extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Loops\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Loops
\n \n
Looping statements provides a way to repeat a set of statements at a given place.
\n
Types of looping statements –
\n
1. for loop
\n
2. while loop
\n
3. do while loop
\n
\n
1.\tfor statement - The for statement provides a compact way to iterate over a range of values.
\n
For loop is used to repeatedly loops until a particular condition is satisfied
\n #include <iostream> \n using namespace std; \n int main(){ \n for(int i=1; i<=5; i++){ \n cout << \"Value of variable i is: \" << i << endl; \n } \n return 0; \n }\n
\n
\n
\n
\n
\n Value of variable i is: 1 \n Value of variable i is: 2 \n Value of variable i is: 3 \n Value of variable i is: 4 \n Value of variable i is: 5\n
\n
\n
\n
2.\twhile statement – The while statement continually executes a block of statements while a particular condition is true. Its syntax can be expressed as -
\n
\n while(expression){ \n statement(s) \n }\n
\n \n
The while statement evaluates expression, which must return a boolean value, If the expression evaluates to true, the while statement executes the statement(s) in the while block.
\n
\n
\n #include <iostream> \n using namespace std; \n \n int main() \n { \n float number, sum = 0; \n \n do { \n cout << \"Enter a number: \"; \n cin >> number; \n sum += number; \n } \n while(number != 0); \n \n cout << \"Total sum = \" << sum; \n \n return 0; \n }\n
\n
\n
\n Output:\n
\n
\n
\n Enter a number: 43 \n Enter a number: 2 \n Enter a number: 5 \n Enter a number: 10 \n Enter a number: 0 \n Total sum = 60\n
\n
\n
\n
3.\tdo - while statement – do - while evaluates its expressions at the bottom of the loop instead of the top. The statements within the doblock are always executed at least once.
\n
\n do{ \n statement(s) \n }while(expression);\n
\n
\n
\n #include <iostream> \n using namespace std; \n int main() { \n int x = 5; \n do { \n cout << \"X is: \" << x << endl; \n x = x + 1; \n } while (x < 10); \n return 0; \n }\n
\n
\n
\n Output:\n
\n
\n
\n X is: 5 \n X is: 6 \n X is: 7 \n X is: 8 \n X is: 9\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppModifiers extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Modifiers\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Modifiers
\n \n
C++ allows 4 modifiers that are used to alter the meaning of fundamental data types.
\n
There are four type modifiers in C++
\n
1.\tshort
\n
2.\tlong
\n
3.\tsigned
\n
4.\tunsigned
\n
\n
\n storage_class data_type var_name;\n
\n
\n
\n
There are 5 storage classes in C++
\n
1.\tauto
\n
2.\tregister
\n
3.\textern
\n
4.\tstatic
\n
5.\tmutable
\n \n \n
\n
1.\tAutomatic - auto storage class lets you explicitly declare a variable with automatic storage.
\n
It is default for variables that are described inside the block i.e. local variables.
\n
\n { \n auto a=20; \n }\n
\n
2.\tRegister – It indicates to the compiler that the object should be stored in machine register.
\n
An object having register storage class must be defined within a block or declared as a parameter to a function.
\n
\n { \n register int month; \n }\n
\n
3.\tExtern – extern storage class objects can be used by several source files.
\n
An extern declaration can define outside a function or at the beginning of a block.
\n
\n int i = 42; // declaration and definition \n extern int i; // declaration only. \n
\n
4.\tStatic – This storage class have static storage duration which means memory for these objects allocated when program begins run and is free when program terminates.
\n
Static int x=5
\n
5.\tMutable – This keyword is used to modify the value of particular data member of const object.
\n
You cannot use the mutable keyword with names declared as static or const.
\n
mutable int x;\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppPointers extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Pointers\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Pointers
\n \n
In C++, a pointer is a variable that contains the address of another variable rather than store the value directly. Just the same way as a variable of type int is used to contain an integer value, A pointer varibale is one that is used to contain a memory address.
\n
Syntax :
\n
data_type *pointer_name;
\n \n
Declaring a Pointer
\n \n
Type *pointer_variable_name = null;\t\t\t//initializing value
\n
Declaring a pointer to an integer would be:
\n
Int *a=null;
\n \n Program to determining the addresses of an int and a double\n
\n
\n
\n #include <iostream> \n using namespace std; \n \n int main() \n { \n int age=20; \n const double Pi = 3.1416; \n \n cout << \"Integer value address : \" << &age << endl; \n cout << \"Double value address : \" << Π \n }\n
\n
\n
\n Output :\n
\n
\n
\n Integer value address : 0x7ffda263f844 \n Double value address : 0x7ffda263f848\n
\n
\n
\n
Using poiters to stor addresses
\n
Assume a variabe declaration of the types you already know :
\n
\n (//declaraing a variable) \n Type variable_name = initial_value;\n
\n
To store the address of a variable in a pointer, you would declare a pointer to the same type and initialized the pointer to the variable’s address using the refrence operator (&):
\n
\n (//declaring a pointer to the same type and iniatializing to address:) \n Type* pointer = &variable;\n
\n \n Program to demnostrate the declaration and initialization of a pointer\n
\n
\n
\n #include <iostream> \n using namespace std; \n \n int main() \n { \n int age=20; \n int* a = &age; \n \n cout << \"Integer value address : \" << a << endl; \n }\n
\n
\n
\n Output :\n
'
\n
\n Integer value address : 0x7fffe3ce4414\n
\n
\n
\n Program that demostrate pointer reassignment to another variable\n
\n
\n
\n #include <iostream> \n using namespace std; \n \n int main() \n { \n int age=20; \n int* a = &age; \n \n cout << \"First Age is : \" << endl; \n cout << \"a is : \" << a << endl; \n \n int myAge =23; \n a = &myAge; \n cout << \"My age : \" << endl; \n cout << \"a is : \" << a; \n }\n
\n
\n
\n Output:\n
\n
\n
\n First Age is : \n a is : 0x7fff188e05c0 \n My age : \n a is : 0x7fff188e05c4\n
\n
\n
\n
What is the sizeOf() of a Pointer ?
\n \n
It returns the no. of bytes required to store, The sizeOf() is a pointer is hence dependent on the compiler and the operating system the program has been compiled for.
\n \n Program to demonstrate that pointers to different types have the same sizes –\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppMultithreading extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Multithreading\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Multithreading
\n \n
Multithreading means a single program have multiple threads and execute independently at same time. Multithreading is a feature of C++ that have multiple single threads.
\n
Thread is a light weight process of a program and these threads executing simultaneously.
\n Example:\n \n
•\tWe can print a document in MS-Word at the same time checking the spelling mistakes in the document.
\n
•\tWe can open multiple tabs in browser.
\n Important terms in Multithreading –\n
\n
Program: A set of instruction store in hard disk is called a program.
\n
Process: A program in RAM is called process.
\n
Thread: Thread is a process under the control of CPU.
\n \n
Thread Life Cycle –
\n
Thread goes through these stages in its life cycle.
\n
•\tNew
\n
•\tRunnable
\n
•\tRunning
\n
•\tNon- runnable
\n
•\tTerminated\n
\n \n
\n \n
\n
\n
•\tIn new state, thread instance has been created but start() is not yet invoked.
\n
•\tWhen start() is invoked thread is in runnable state.
\n
•\tAfter call the run() method thread is in running state.
\n
•\tWaiting thread is non-runnable state , in this state the thread is alive but not eligible to run.
\n
•\tIn dead state, thread is not alive.Once the run method is completed then it will destroy.
\n \n Multiprogramming :\n
When more than one process are queued in RAM for their execution the concept is known as multiprogramming.
\n
For Example: There are many students in queue for interview and only one student is interviewed is allow at a time, the process that is going on will be multiprogramming.
\n Multitasking: \n
When more than one process are under execution than the concept is known as multitasking.
\n
For Example: At a same I am using my worpad and as well as playing songs.
\n Multiprocessing :\n
When more than one processors are used in same system to solve single or multiple task than the concept is known as multiprocessing.
\n
\n Program to demonstrate abstract claa with on virtual function –\n
\n
\n
\n #include <iostream> \n using namespace std; \n class Vehicle \n { \n public: \n virtual void run()=0; \n }; \n class Bike : Vehicle \n { \n public: \n void run() \n { \n cout << \" Bike is running...\" << endl; \n } \n }; \n class Car : Vehicle \n { \n public: \n void run() \n { \n cout << \"Car is running...\" << endl; \n } \n }; \n int main( ) { \n Bike bike; \n Car car; \n bike.run(); \n car.run(); \n return 0; \n }\n
\n
\n
\n Output –\n
\n
\n
\n Bike is running... \n Car is running...\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppNamespace extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Namespace\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Namespaces
\n \n
Namespace is used to create two variables and member functions with same name, it’s main purpose is to prevent ambiguity that may occur when two variable shaving have same name.
\n
Synatx –
\n
\n namespace namespace_name \n { \n int x, y; /* code declarations where \n x and y are declared in \n namespace_name's scope*/ \n }\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppStorageClasses extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Storage Classes\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Storage Class
\n \n
Storage class defines the scope, life-span and initial value of the variable and functions, it also describes the features of variables and functions.
\n
Syntax to specify storage class:
\n
\n
\n storage_class data_type var_name;\n
\n
\n
\n
There are 5 storage classes in C++
\n
1.\tauto
\n
2.\tregister
\n
3.\textern
\n
4.\tstatic
\n
5.\tmutable
\n \n \n
\n
1.\tAutomatic - auto storage class lets you explicitly declare a variable with automatic storage.
\n
It is default for variables that are described inside the block i.e. local variables.
\n
{ \n auto a=20; \n }\n
\n
2.\tRegister – It indicates to the compiler that the object should be stored in machine register.
\n
An object having register storage class must be defined within a block or declared as a parameter to a function.
\n
\n { \n register int month; \n }\n
\n
3.\tExtern – extern storage class objects can be used by several source files.
\n
An extern declaration can define outside a function or at the beginning of a block.
\n
int i = 42; // declaration and definition \n extern int i; // declaration only.
\n
4.\tStatic – This storage class have static storage duration which means memory for these objects allocated when program begins run and is free when program terminates.
\n
Static int x=5
\n
5.\tMutable – This keyword is used to modify the value of particular data member of const object.
\n
You cannot use the mutable keyword with names declared as static or const.
\n
mutable int x;\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppStrings extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Strings\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Strings
\n \n
Strings are a special case of an array of characters. String is a sequence of characters that are used to store text.
\n
You have already seen some examples of string in the form of string literals that you have been writing into your code:
\n \n Std::cout << ”Hello World”;\n \n
This is equivalent to using the array declaration:
Last character in the array is a null character ‘\\0’. This is also called the string terminating character because it tells the compiler that the string has ended.
\n
Strings are same as array but there is a difference between them that string is terminated with null character.
\n
Using std::string to initialize, store user input, copy , concatenate and determine the length of the string.
\n Hello World \n Enter String : c++ \n Enter another String : tutorials \n String after concatenation: c++ tutorials \n Copied string : c++ tutorials \n Length of string : 13\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CppPolymorphism extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C++ Tutorials - Polymorphism\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Polymorphism
\n \n
As the name suggest one name many forms, Polymorphism is the way of providing the different functionality by the functions having the same name based on the signatures of the methods.
\n
For example: method calculate_area will definitely work for circle, square and triangle object.
\n
There are two type of polymorphism in C++
\n
1.\tCompile time polymorphism
\n
2.\tRun time polymorphism
\n
Method overloading
\n
In Method overloading, functions have same name but different no. of arguments, return type of the parameters.
\n
• It can be implemented in both parent and child class.
\n Area of square : 25 \n Area of rectangle : 52.5\n
\n
\n
\n\n
Method Overriding
\n \n
In method overriding, redefining inherit methods in subclasses. In this, declaration should be identical, code may be different. It is like having another version of the same product.
\n
• It can be used to add more functionality to a method.
\n
• It is also called as run time polymorphism.
\n
• In overriding, a method has same name, same no. of arguments and same data type.
\n Area of square : 25 \n Area of rectangle : 52.5\n
\n
\n
\n
Method Overriding
\n \n
In method overriding, redefining inherit methods in subclasses. In this, declaration should be identical, code may be different. It is like having another version of the same product.
\n
• It can be used to add more functionality to a method.
\n
• It is also called as run time polymorphism.
\n
• In overriding, a method has same name, same no. of arguments and same data type.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Introduction\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
\n \n
\n \n
C Introduction
\n \n
C is a general purpose, middle level, procedure oriented programming language that supports structured programming.
\n
C language is developed by Dennis Ritchie at Bell Labs between 1972 to 1973 for UNIX operating systems. But latterly, it has become the most widely used programming language and in 1989 C has been standardized by the ANSI and by the International Organization of Standardizations (ISO).\n
\n \n
Why C Programming ?
\n
C is mother of all the languages. So if you want become a software engineer than it is must for students and working professionals to learn C language. Few key points that makes C language popular –
\n
•\tEasy to learn
\n
•\tStructured Language
\n
•\tMiddle Level
\n
•\tMother of all languages
\n
•\tEfficient programs
\n \n
History of C
\n
C language is developed by Dennis Ritchie at AT& T(American Telephone & Telegraph) Bell Labs between 1972 to 1973.
\n
It is developed to be used in utilities of UNIX operating system.
\n
It was introduced to overcome the problems of B and BCPL languages.
\n \n
Features of C language
\n
1.\tEasy to learn – C programs are very easy to understand because it primitives that are easy and break the problem into parts i.e. functions.
\n
2.\tEfficient and Fast – Programs written in C language are efficient and fast because it has variety of data types and operators. Compilation and execution of C language is fast because it has lesser functions.
\n
3.\tPortable – A program written on one machine can be run on another machine with little or no modification.
\n
4.\tMiddle Level – C is introduced only for lower level programming but it has also a features for high level programming language.
\n
5.\tStructured Language - In structured programming we can break the program into pieces in the form of functions and then solve it. So, it makes programming easy.
\n \n \n
\n
\n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class FirstProgramInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - First Program In C\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
First Program in C
\n \n
In this, we are showing you how you can create first C program. It is very simle to run this.
\n
First you should need a text editor and a compiler, there are many compilers in market TDM-GCC, MinGW.
\n
Step 1. Open any Text Editor
\n
Step 2. Place the code in that file and save as hello.c
Step 3. Open your command prompt and set your directory path where your program is stored.
\n
Step 4. Type this command gcc -o hello hello.c and hit enter button.
\n
After that you will get a .exe file, also you can run this file on any other system.
\n
Step 5. Type you filename on command prompt and hit enter. After that your program runs smoothly.
\n
Eg. Hello
\n
In this program, we have using many new terms, so lets discuss it.
\n
#include – It is preprocessor directive, it creates the environment for the program and link it to the header file i.e stdio.h
\n
Stdio.h – Standard input output header file. This header file provides the function to the program.
\n
For Example – stdio.h is used for printf function.
\n
Now, What is header files ?
\n
Header files contain collection of built in functions. Header files contain definition of functions that we are going to use in our programs. We can use header files with preprocessor by linking it.
\n
main() – main() function tells the compiler that our program execution starts from here. It can have return type void or int etc.
\n
printf() – printf() is used to print the data, this function is provided by stdio.h header file which contains the definition of this function.
\n
Comments – We can also add comments in our program . They are ignored by the compiler.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CKeywordsAndIdentifiers extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Keywords and Identifiers\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Keywords
\n \n
Keywords are the reserved words that have special meaning in C language. We cannot use keywords as identifiers. There are 32 keywords in C language
\n
\n \n
\n
auto, signed, const, extern, register, unsigned – These key words are used to define a variable.
\n
break – It is a loop control statement which is used to terminate the loop.
\n
int, float, char, double, long – These are data types used in to declaring the type variables.
\n
if, else, switch, case, default - These are conditional statements used for decision controls.
\n
continue – It is a statement used inside the loop, when continue statement run inside the loop, control jumping to the beginning of the loop for next iteration.
\n
for, while, do – These are loops used to repeat the block of code.
\n
enum – or enumeration is a user define data type used to define the variables of enum type
\n
goto - goto statement is used to jump anywhere from one statement to another in functions.
\n
return – used to returning a value
\n
sizeOf – it is used to compute the size of its operand.
\n
struct, typedef - both are data types and used to create a structure.
\n
void – void is return type that indicates that function does not return a value.
\n
union - It allows the use to store different type of data in same memory location.
\n
volatile – It tells the browser that the value of volatile variable can be change any time.
\n \n
Identifiers
\n \n
Identifiers are user defined which can be any variable, function and structure etc.
\n
Identifier must be unique.
\n
Eg. tutsfinder, tutorials etc.
\n
Rules to create identifier :
\n
1.\tAn Identifier contains only alphanumeric characters(a-z , A-Z , 0-9) and underscore(_).
\n
2.\tThe first character of an identifier should start with alphabet(a-z , A-Z) or underscore (_).
\n
3.\tIdentifiers are also case sensitive. For example finder and Finder are two different identifiers.
\n
4.\tKeywords are not allowed to be used as Identifiers.
\n
5.\tNo special characters, such as semicolon, period, whitespaces, slash or comma are allowed to be used as Identifier.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CArrays extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Arrays\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Array in C
\n \n
Array is a collection of data of similar data type. Consider an example – If we say there is an array of Integer this means that we have a collection of data that contains only integer values.
\n
Array uses static memory allocation. To access element from array you must have to mention its index value corresponding to the position of the element. We can easily access data in array.
\n
The index of array always starts from 0.
\n
But there is a disadvantage in array that we can store only fixed amount of elements. We cannot change size of an array at runtime.
\n
Array Declaration and Initialization
\n
If you want use array in your program then first declare variable and initialize the value to that variable.
\n
Syntax: dataType array_name[]={ };
\n
Example: int myarray [] = { 7,8,4,21};
\n \n
There are two types of arrays –
\n
1. One Dimensional
\n
2. Multi Dimensional
\n \n \n Program to print to elements of an array\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class ControlStatementsInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Control Statements\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Control Statements
\n \n
These are keywords that are used for making a decision. In this, we will discuss about conditional statements, Switch statement. These statements are used to control the flow of statements.
\n
Conditional Statements
\n
Conditional Statements are used when the execution of statements depends on one or more conditions.
\n Decision making statements :\n
•\tIf
\n
•\tIf-else
\n
•\tif-else-if
\n
Example of if statement –
\n \n
\n
\n #include <stdio.h> \n void main() { \n int num; \n \n printf(\"Enter any number : \"); \n scanf(\"%d\", &num); \n \n if (number < 0) { \n printf(\"Numeber is %d \", num); \n } \n }\n
\n
\n \n
Syntax of if-else statement -
\n
\n if(condition) \n { \n (//statement if condition is true) \n } \n else \n { \n (//statement if condition is false) \n }\n
\n \n Program to show how to use if else statement\n \n
\n
\n #include <stdio.h> \n void main() { \n int num; \n printf(\"Enter any number \"); \n scanf(\"%d\", &num); \n if (number%2 == 0) { \n printf(\"%d is an even integer.\",num); \n } \n else { \n printf(\"%d is an odd integer.\",num); \n } \n }\n
\n
\n
\n Output :\n
\n
\n Enter an integer: 8 \n 8 is an even integer.\n
\n
\n
Program of if else if statement –
\n
Program to decide discount percentage for selling a tv.
\n \n
\n
\n #include<stdio.h> \n void main() \n { \n int size;int disc; \n printf(\"Enter size ho TV : \"); \n scanf(\"%d\",&size); \n if(size<21) \n { \n printf(\"You will get discount of 5%\"); \n } \n else if(size > 21 || size < 32) \n { \n printf(\"You will get discount of 10%;\"); \n } \n else \n { \n printf(\"You will get discount of 20%\"); \n } \n }\n
\n
\n
\n
Switch Statement
\n
Switch statement can have a number of possible execution paths. A switch works with byte, short ,char and int primitive data types.
\n
The following program SwitchExample shows how switch statement works in C.
\n
\n
\n
\n #include<stdio.h> \n \n void main() \n { \n int month; \n \n printf(\"Which month you have to print : \"); \n scanf(\"%d\", &month); \n \n switch(month) \n { \n case 1: \n printf(\"January\"); \n break; \n case 2: \n printf(\"February\"); \n break; \n case 3: \n printf(\"March\"); \n break; \n case 4: \n printf(\"April\"); \n break; \n case 5: \n printf(\"May\"); \n break; \n case 6: \n printf(\"June\"); \n break; \n case 7: \n printf(\"July\"); \n break; \n case 8: \n printf(\"August\"); \n break; \n case 9: \n printf(\"September\"); \n break; \n case 10: \n printf(\"October\"); \n break; \n case 11: \n printf(\"Novembee\"); \n break; \n case 12: \n printf(\"December\"); \n break; \n default: \n printf(\"Invalid input! Please enter month between 1-12\"); \n } \n }\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class DataTypesInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Data Types\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Data Types
\n \n
Data type defines the type of variable that which type of variable you are using in you program.
\n
C language have pre defined set of data types to handle different type of data.
\n
Eg. int a;
\n
Data types are categorized in two types-
\n
1.\tPrimitive Data types
\n
2.\tNon-Primitive Data Types
\n
Primitive Data type - Primitive data types are fundamentals data types. There are 8 primitive data types, they are predefined by the language.
\n
1.\tByte
\n
2.\tShort
\n
3.\tInt
\n
4.\tLong
\n
5.\tFloat
\n
6.\tDouble
\n
7.\tBoolean
\n
8.\tChar
\n
Non –Primitive Data Types – These data types are derived from Primitive data types.
\n
1.\tString
\n
2.\tArray
\n
\n
\n
\n \n
\n
Data Type
\n
Size
\n
Range
\n
\n
\n
char
\n
1 byte
\n
-128 to 127 or 0 to 255
\n
\n
\n
unsigned char
\n
1 byte
\n
0 to 255
\n
\n
\n
signed char
\n
1 byte
\n
-128 to 127
\n
\n
\n
int
\n
2 or 4 bytes
\n
-32,768 to 32,767 or -2,147,483,648 to 2,147,483,647
\n
\n
\n
unsigned int
\n
2 or 4 bytes
\n
0 to 65,535 or 0 to 4,294,967,295
\n
\n
\n
short
\n
2 bytes
\n
-32,768 to 32,767
\n
\n
\n
unsigned short
\n
2 bytes
\n
0 to 65,535
\n
\n
\n
long
\n
8 bytes
\n
-9223372036854775808 to 9223372036854775807
\n
\n
\n
unsigned long
\n
8 bytes
\n
0 to 18446744073709551615
\n
\n
\n
float
\n
4 byte
\n
1.2E-38 to 3.4E+38
\n
\n
\n
double
\n
8 byte
\n
2.3E-308 to 1.7E+308
\n
\n
\n
long double
\n
10 byte
\n
3.4E-4932 to 1.1E+4932
\n
\n \n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class VariablesAndConstantsInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Variables And Constants\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Variables
\n \n
Variables are identifier that are used to hold the data. Variable is the name of an address.
\n
Variables can be changed, we can change the name of the variable at execution time.
\n
Keywords are not used as variables because variables are user defined.
\n
Variables are name, age, rollNo .
\n
Rules for Variables :
\n
1.\tA variable contains only alphanumeric characters(a-z , A-Z , 0-9) and underscore(_).
\n
2.\tThe first character of a variable should start with alphabet(a-z , A-Z) or underscore (_).
\n
3.\tVariables are also case sensitive.
\n
4.\tKeep variables name in small alphabets
\n \n
Constants
\n
Constant variables are the variables that value can not be changed.
\n
Const keyword is used to make a variable constant.
\n
For Exmaple: const int = 5;
\n
We will also define a constant with #define directive.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class TypeCastingInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Type Casting\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Type Casting
\n \n
Convert one data type into another data type is known as type casting or data conversion.
\n
Two types of typecasting in C –
\n
1.\tImplicit typecasting
\n
2.\tExplicit typecasting
\n \n
1.\tImplicit typecasting – Implicit typecasting done automatically by the compiler without any user intervention.
\n
\n
\n
\n include<stdio.h> \n void main() \n { \n int a = 10; \n char b = 'x'; //ASCII value of x is 120 \n \n a = a + b; \n \n float sum = x + 1; \n \n printf(\"Addition : %f\",sum); \n }\n
\n
\n
\n
2.\tExplicit typecasting – It is a user defined typecasting, according to their needs user typecast there variables.
\n
\n
\n
\n #include<stdio.h> \n void main() \n { \n float a = 7.8; \n \n int b = (int)a + 1; \n \n printf(\"Value of b is %d\\n\",b); \n \n }\n
\n
\n
\n Output :\n
\n Value of b is 8\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PreProcessors extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Pre Processors\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Pre Processors
\n \n
Pre-processors provides the functionality to program to integrate header files.
\n
It is macro processor that is used automatically by the compiler.
\n
All preprocessor commands start with # symbol.
\n \n
Directives
\n \n
Directives specifies how its input should process by the compiler.
\n
Pre-processors directives are the line in our program that starts with # symbol.
\n
Eg. #include, #define.
\n \n
Important pre-processor directives
\n \n
#define – It allows the definition of macros. It is used to give a contant value to the program.
\n
Before use a macro, first you have to explicitly define the #define directive with name of the macro.
\n
Eg. #define MAX 50
\n \n
#include – This directive is used to include the header file(system and user header files).
\n \n
It can be define in 3 ways –
\n
1.\t#include <file>\t
\n
2.\t#include “file”
\n
3.\t#include anything else
\n
#ifndef – One header file include anothers. It returns true if this macro is not defined.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CPointers extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Pointers\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
C Pointers
\n \n
Every variable has its own address; to store the address of that variable pointers are used.
\n
Pointer is a special variable that store the address of the variable.
\n \n
Syntax to declare a pointer :
\n
int *p1;
\n \n
char *p2;
\n \n
Program to print the address of variable
\n
\n
\n
\n #include <stdio.h> \n \n void main () { \n \n int a; \n char b[5]; \n \n printf(\"Address of a : %x\\n\", &a ); \n printf(\"Address of b : %x\\n\", &b ); \n \n }\n
\n
\n
\n Output :\n
\n
\n
\n Address of a : 62fe4c \n Address of b : 62fe40\n
\n
\n
\n
How can we use pointers in our program ?
\n \n
Pointer program to show value of pointer variable and address of pointer variable.
\n
\n
\n
\n #include<stdio.h> \n void main(){ \n int num=8; \n int *a; \n a=# \n printf(\"Address of a variable is %x \\n\",a); \n printf(\"Value of a variable is %d \\n\",*a); \n \n }\n
\n
\n
\n Output:\n
\n
\n
\n Address of a variable is 62fe44 \n Value of a variable is 8\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class OperatorsInC extends React.Component {\n componentDidMount() {\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Operators\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Operators
\n
\n
An operator is a symbol that is used to perform some mathematical and logical operations on operands.
\n
C language provides following type of operators –
\n
1.\tAssignment Operators
\n
2.\tArithmetic Operators
\n
3.\tUnary Operators
\n
4.\tEquality and relational Operators
\n
5.\tLogical Operators
\n
6.\tBitwise Operator
\n
1.\tAssignment Operator – It is the mot common operator almost used with all the programming languages. It is represented with “=” symbol which is used to assign a valueto a variable lying to the left side of the assignament operator.
\n Syntax :\n
variable = expression;
\n
For Example : int counter=1;
\n
String=”Trish” ;
\n
boolean b=true;
\n
2.\tArithmetic Operators – These operators are used to perform some mathematical operations like addition, subtraction, multiplication, division, and modulo (or remainder).
\n \n
\n \n
\n
Symbol
\n
Operator
\n
Example
\n
\n
\n
+
\n
Addition
\n
x=a+b;;
\n
\n
\n
-
\n
Subtraction
\n
x=a-b;
\n
\n
\n
*
\n
Multiply
\n
x=a*b;
\n
\n
\n
/
\n
Division
\n
x=a*b;
\n
\n
\n
%
\n
Remainder
\n
x=a%b
\n
\n \n
\n \n
3.\tUnary Operators – Unary Operators require only one operand to perform different operations such as increasing/decreasing or manu operations.
\n
For Example - int x=1;
\n
int y=5;
\n
X=(+y);
\n \n
\n \n
\n
Symbol
\n
Operator
\n
Description
\n
\n
\n
+
\n
Unary plus Operator
\n
indicates positive value
\n
\n
\n
-
\n
Unary minus Operator
\n
negates an expression
\n
\n
\n
++
\n
Decrement Operator
\n
decrease a value by 1
\n
\n
\n
--
\n
Decremeny Operator
\n
decrease a value by 1
\n
\n
\n
!
\n
Logical Complement
\n
inverts a boolean value
\n
\n \n
\n \n
4.\tRelational Operators – These operators are used to compare the results of two expression or operands whether an operand is equal, not equal, greater than, less than to another operand.
\n \n
\n \n
\n
Symbol
\n
Operator
\n
Operation
\n
\n
\n
==
\n
equal to
\n
a == b
\n
\n
\n
!=
\n
not equal to
\n
a != b
\n
\n
\n
<
\n
gretaer than
\n
a > b
\n
\n
\n
<
\n
smaller than
\n
a < b
\n
\n
\n
>=
\n
greater than or equal to
\n
a>=b
\n
\n
\n
<=
\n
smaller than or equal to
\n
a<=b
\n
\n \n
\n \n
5.\tConditional Operator – Return a true or false value based on the state of the variables.
\n
6.\tBitwise and shift operator - Operators are used to manipulate the contents of variables at a bit level according to binary format.
\n
There are different type of bitwise operators –
\n \n
\n \n
\n
Symbol
\n
Oerator
\n
Example
\n
\n
\n
~
\n
Unary bitwise complement
\n
~a
\n
\n
\n
&
\n
Bitwise AND
\n
a & b
\n
\n
\n
|
\n
Bitwise inclusive OR
\n
a | b
\n
\n
\n
^
\n
Bitwise exclusive OR
\n
a ^ b
\n
\n
\n
<<
\n
Signed left shift
\n
a << b
\n
\n
\n
>>
\n
Signed right shift
\n
a >> b
\n
\n
\n
>>>
\n
Unsigne right shift
\n
a >>> b
\n
\n \n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class ErrorHandlingInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Error Handling\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Error Handling
\n \n
C language does not support error handling directly. There is a header file error.h in C that defines various error code.
\n
Most of the C function calls return -1 or NULL in case of any error and set an error code errno.
\n \n
Errno
\n \n
It is a global function that is used to determine which type of error was encountered while function execution.
\n \n
List of errno
\n \n
1.\tOperation not permitted
\n
2.\tNo such file or directory
\n
3.\tNo such process
\n
4.\tInterrupted system call
\n
5.\tI/O error
\n
6.\tNo such device or address
\n
7.\tArgument list too long
\n
8.\tExec format error
\n
9.\tBad file number
\n
10.\tNo child processes
\n
11.\tTry again
\n
12.\tOut of memory
\n
13.\tPermission denied
\n \n \n
Functions in errno
\n \n
There are two functions that are used to display the error message associated with errno –
\n
1.\tPerror() – This function returns the string with textual representation with the current errno value.
\n
2.\tStrerror() - It is defined in string.h header file. This function returns a pointer to textual representation of the current errno value.
\n \n Program to show how error handling works –\n
\n
\n
\n #include <stdio.h> \n #include <errno.h> \n \n void main() \n { \n \n FILE * fp; \n \n (/* opening a file which does \n not exist.*/) \n fp = fopen(\"xyz.txt\", \"r\"); \n \n printf(\" Value of errno is : %d\\n \", errno); \n \n }\n
\n
\n
\n Output:\n
\n
\n Value of errno is 2.\n
\n
\n \n
In above program, it returns 2 because 2 means – no such file or directory.
\n
\n Program#2\n
\n
\n
\n #include <stdio.h> \n #include <stdlib.h> \n \n void main() { \n \n int a = 20; \n int b = 0; \n int quotient; \n \n if( b == 0){ \n fprintf(stderr, \"Division by zero! Is not allowed\\n\"); \n exit(-1); \n } \n quotient = a/b; \n fprintf(stderr, \"Value of quotient is : %d\\n\", quotient ); \n }\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class FileInputOutputInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Tutorials - File Input Output\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
File Input Output
\n \n
A file can be used to store data. In C we can use file pointer to perform input and output operations. Different operations that can be perform on files are –
\n
1.\tOpen a file
\n
2.\tCreate a file
\n
3.\tRead a file
\n
4.\tWrite a file
\n
5.\tClose a file
\n \n
File opening modes in C
\n
\n
\n
\n
\n
File Mode
\n
Description
\n
\n
\n
r
\n
to open a file for reading
\n
\n
\n
w
\n
open a file for writting
\n
\n
\n
a
\n
open a file in append mode
\n
\n
\n
r+
\n
open a file for reading and writing and also you can modify the file.
\n
\n
\n
w+
\n
open a file for reading and writing and you can overwrite the data in it.
\n
\n
\n
a+
\n
open a file in append mode for reading and you can’t modify the datat in it.
\n
\n
\n
\n
\n
Types of Files –
\n \n
There are two types of file –
\n
1.\tText Files – These files are simple text files like .txt files. Text files have plain text in easy and understandable format.
\n
2.\tBinary Files – These files store data in binary format in 0 & 1. Mostly .bin files are used to store binary data.
\n
\n
Create a File –
\n
When you want to use a file, first you have to create it. A file is used to store some data and needs some space in a memory.
\n
Synatx :
\n
File *fp;
\n
Fp = fopen (FileName, mode);
\n
If the file is not present in the system, then it is created that otherwise it will open the file.
Concatenates or join string s2 onto the end of string s1 and relut will be defined in string s1.
\n
3.\tstrlen(s1);
\n
Returns the length of string s1.
\n
4.\tstrcmp(s1, s2);
\n
Compare the string s1 with strings s2.
\n
Returns 0 if s1 and s2 are the same;
\n
5.\tstrchr(s1, ch);
\n
Returns a pointer to the first occurrence of character ch in string s1.
\n
6.\tstrstr(s1, s2);
\n
Returns a pointer to the first occurrence of string s2 in string s1.
\n \n
Program to show C Strings function
\n
\n
\n
\n #include <stdio.h> \n #include <string.h> \n \n void main () { \n \n char s1[10] = \"Hello\"; \n char s2[10] = \"World\"; \n char s3[10]; \n int len ; \n \n (/* copy strings */) \n strcpy(str3, str1); \n printf(\"String will be : %s\\n\", str3 ); \n \n (/* concatenates strings */) \n strcat( str1, str2); \n printf(\"After concatenation : %s\\n\", str1 ); \n \n (/* returns lenghth of string */) \n len = strlen(str1); \n printf(\"Length of string is : %d\\n\", len ); \n \n }\n
\n
\n
\n Output:\n
\n
\n
\n String will be: Hello \n After concatenation : HelloWorld \n Length of string is: 10\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class MemoryManagementInC extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Memory Management\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Memory Management
\n \n
Make the efficient use of available memory. Memory is nothing but a storage area where your program get execute ad can be store.
\n
First, when you run a program, it loads into your computer's memory and begins to execute by sending and receiving instructions from the computer's processor.
\n \n
Memory divided into 4 segments –
\n
1.\tCode Segment – It contains only binary which has to be executed.
\n
2.\tData Segment – Data segment can be divided into two types –
\n
•\tInitialized data segment – The data which is already declared.
\n
•\tUninitialized data segment – The data which is not initialized.
\n
3.\tHeap – Heap is used to allocate memory to the program at run time.
\n
4.\tStack – Stack is used to store variables that can be used to pass the arguments to the function.
\n
C supports dynamic memory allocation which has ability to free the memory after execution is done.
\n
Following are the key functions in standard C library –
\n \n
•\tMalloc - It is used to reserve a block of memory of a given size.
\n
It allocates the specified number of bytes, it takes only one arguments i.e amount of memory.
\n
•\tCalloc – It is also used to allocate memory and initialize with zero.
\n
It needs two arguments, no of variables and size in bytes.
\n
•\tRealloc – It is used to resize the block of memory where you can increase or decrease the size of the memory.
\n
•\tFree – When you not need the memory anymore then you can release it with this function.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CFunctions extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n C Programming - Functions \n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Functions
\n \n
Function is a block of code where we can implement our data to execute it. It is design to perform specific task. Functions have unique name so that other functions can call it or execute it.
\n
Every program has at least one function, that is main() function. main() function tells the compiler that program execution will be start from here.
\n
To define a function these parts play an role –
\n
Return Type – Every function should have any return type either it is void or any other primitive data type.
\n
Function Name – Function name must be unique. This is the name of the function that we have to execute.
\n
Parameters – Parameters are optional, if you need to pass the parameter then you can. It declares the type and no. of arguments.
1.\tPredefined – These are already defined by the C language. Eg. printf(), scanf()
\n
2.\tUser Defined – These functions are defined by the user at the time of writing code.
\n
Calling a Function – When we call a function, control of the program gets transferred to functions.
\n
There are two ways to calling a function –
\n
1.\tCall by Value
\n
2.\tCall by Reference
\n
1.\tCall by Value – In call by value the value is passed in function as an argument.
\n \n
\n
\n #include<stdio.h> \n int add(int,int); \n void main() \n { \n int a,b,c; \n printf(\"main function ..\\n\"); \n printf(\"Enter values of a and b \"); \n scanf(\"%d%d\",&a,&b); \n c=add(a,b); \n printf(\"Sum is %d \",&c); \n } \n int add(int a, int b) \n { \n return a+b; \n }\n
\n
\n \n \n
2.\tCall by reference – In call by reference we can pass the address of the variable as an argument.
\n \n \n \n In above example we have used many CSS properties in internal CSS, we will go through with it in next chapter.\n \n \n
\n
\n
\n
\n \n
\n
\n
\n \n )\n }\n}\n","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HowToUseCss extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - How to use CSS\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
How to use CSS
\n
\n
Mostly beginners have question in his/her mind that how we can implement CCS and how to use it. So In this, we will learn how CCS can be used in HTML pages to make page attractive.
\n
In CCS, there is set of rules to that can be followed to use CCS where it consists of a selector, a property and a value, A CSS syntaxt contains a selector and a declaration block .
\n
A CSS rule set comprise of a selector and a declaration –
\n \n \n\n
To style any element you have to follow this rule –
\n
Selector – Selector is any HTML tag that you want to style.
\n
Property – Property is a kind of attribute, It defines tha additioanl settings of the selector.
\n
Value – Value is associated with property, each property have values. E.g. color has value blue.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Introduction\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Comments
\n
\n
CSS comments are same as HTML comments. Comments are used to add explanatory notes about the code that makes code easy to understand for others.
\n
It is a good habbit for coders if they use comments.
\n
Comments can be used as single lines and as mutiple lines
\n
Comments can be placed in between /* and */.
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <style> /* Style start from here. This is a single line comment.*/ \n h1{ \n color:blue; \n text-align:center; \n } \n p { \n color: red; \n text-align: center; \n font-size:40px; \n } \n </style> \n </head> \n <body> \n (/*Multiple line comments \n Body tag start from here \n */) \n <h1>Hello World!</h1> \n <p>Welcome to TutsFinder</p> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssUnits extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Units\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Units
\n
\n
CSS Units are used to specify length and measurements units in your style such as “padding:10px”. There are two type of Units in CSS – 1
\n
•\tAbsolute length
\n
•\tRelative length
\n \n
Absolute length
\n
Absolute length are fixed, It appears according to size of the device. It is not good for use on screen because screen size vary acoording to device display.
\n \n
Relative length
\n
Relative length is good for different redering screens because it can make size of the text relative to everything else in the page.
\n \n
\n
\n \n
\n
Unit
\n
Name
\n
Equivalent to
\n
\n\n
\n
cm
\n
Centimeters
\n
1cm = 96px/2.54
\n
\n
\n
mm
\n
Millimeters
\n
1mm = 1/10th of 1cm
\n
\n
\n
Q
\n
Quarter-millimeters
\n
1Q = 1/40th of 1cm
\n
\n
\n
in
\n
Inches
\n
1in = 2.54cm = 96px
\n
\n
\n
pc
\n
Picas
\n
1pc = 1/6th of 1in
\n
\n
\n
pt
\n
Points
\n
1pt = 1/72th of 1in
\n
\n
\n
px
\n
Pixels
\n
1px = 1/96th of 1in
\n
\n \n
\n
\n\n
\n\n
\n \n
\n
Unit
\n
Relative to
\n
\n
\n
em
\n
Font size of the parent, in the case of typographical properties like font-size, and font size of the element itself, in the case of other properties like width.
\n
\n
\n
ex
\n
x-height of the element's font.
\n
\n
\n
ch
\n
The advance measure (width) of the glyph \"0\" of the element's font.
\n
\n
\n
rem
\n
Font size of the root element.
\n
\n
\n
lh
\n
Line height of the element.
\n
\n
\n
vw
\n
1% of the viewport's width.
\n
\n
\n
vh
\n
1% of the viewport's height.
\n
\n
\n
vmin
\n
1% of the viewport's smaller dimension.
\n
\n
\n
vmax
\n
1% of the viewport's larger dimension.
\n
\n \n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Fonts\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Fonts
\n
\n\n
CSS font property is used to style the text or control the looks of the text such by ussing this property you can change font color, size.
\n\n
Some font properties are –
\n\n
1.\tfont-size
\n
2.\tfont-color
\n
3.\tfont-family
\n
4.\tfont-style
\n \n
1.\tfont-color property – This property is used to color the text.
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <style> \n h1 { color: red; } // used with color name \n h2 { color: #008000; } //write only color code \n p { color:rgb(0, 255, 255); } //We can use color rgb fromat \n } \n </style> \n </head> \n <body> \n <h1> TutsFinder </h1> \n <h2> TutsFinder </h2> \n <p> TutsFinder </p> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n
\n
2.\tfont-size property – This property is used to specify the size of the text.
In above example, we have color property to change the color of the link likewise you can use any property with links such as background-color, text-decoration.
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssLists extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Lists\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Lists
\n
\n\n
Lists
\n
There are two types of lists in HTML
\n
Ordered list
\n
Unordered list
\n \n
We can style these lists with the help of CCS list properties.
\n
Following are the properties that we can use to style our lists –
\n
1.\tList-style-type – It defines the the type of the list where we can use list-marker like disc, square, circle, lower roman, upper-alpha, none.
Margin is used to provide space around the elements outside of any defined border. Margin is a shorthand property where we can use all four properties in a single declaration.
\n
For example – margin: 20px 20px 20px20px;
\n
We can define margin in length(cm, px, pt) and in %.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssShadowProperty extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Shadow Property\n With this property we can able to add show around text and images.\" />\n \n \n \n\n \n With this property we can able to add show around text and images.\" />\n \n \n \n
\n \n
\n
CSS Shadow Property
\n
\n\n
With this property we can able to add show around text and images.
\n
Text-shadow
\n
Box-shadow
\n
\n\n
Text-shadow property is used to add shadow on text.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Display\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Display
\n
\n\n
Display propery is used to control layout. It specefies how components or box should place on the web page. The default value for most of the property is block.
\n
\n \n
\n
Value
\n
Description
\n
\n \n \n
\n
inline
\n
used to displays an element as an inline element.
\n
\n
\n
block
\n
used to displays an element as a block element
\n
\n
\n
contents
\n
used to disappear the container.
\n
\n
\n
flex
\n
used to display an element as a block-level flex container.
\n
\n
\n
grid
\n
used to display an element as a block-level grid container.
\n
\n
\n
inline-block
\n
used to display an element as a inline-level block container.
\n
\n
\n
inline-flex
\n
used to display an element as a inline-level flex container.
\n
\n
\n
inline-grid
\n
used to display an element as a inline-level grid container.
\n
\n
\n
inline-table
\n
used to display an inline-level table
\n
\n
\n
list-item
\n
used to display all the element in <li> element.
\n
\n
\n
run-in
\n
used to display an element inline or block level, depending on context.
\n
\n
\n
table
\n
used to set the behavior as <table> for all element.
\n
\n
\n
table-caption
\n
used to set the behavior as <caption> for all element.
\n
\n
\n
table-column-group
\n
used to set the behavior as <column> for all element.
\n
\n
\n
table-header-group
\n
element behave like a <thead> element
\n
\n
\n
table-footer-group
\n
used to set the behavior as <header> for all element.
\n
\n
\n
table-row-group
\n
used to set the behavior as <row> for all element.
\n
\n
\n
table-cell
\n
used to set the behavior as <td> for all element.
\n
\n
\n
table-column
\n
used to set the behavior as <col> for all element.
\n
\n
\n
table-row
\n
used to set the behavior as <tr> for all element.
\n
\n
\n
none
\n
used to remove the element.
\n
\n
\n
initial
\n
used to set the default value.
\n
\n
\n
inherit
\n
used to inherit the property from it’s parents elements.
\n
\n \n
\n\n
\n
\n
Example of Inherit property
\n
\n
\n <!DOCTYPE html> \n <html> \n <head> \n <style> \n body { \n display: inline; \n } \n \n p { \n display: inherit; \n } \n </style> \n </head> \n <body> \n \n <p>We are using inherit property to show how it works,</p> \n \n <p> And see there is no spcae between these two paragraphs.</p> \n \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Gradient\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Gradient
\n
\n\n
When we use two colors together for background, gradient provides a smooth transition between colors.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Padding\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
CSS Padding
\n
\n\n
Padding is used to provide space around the elements inside of any defined border. Padding is a shorthand property where we can use all four properties in a single declaration.
\n
For example – padding: 20px 20px 20px20px;
\n
We can define padding in length(cm, px, pt) and in %.
\n
\n body \n { \n Padding: size; \n }\n
\n \n
1.\tpadding property with 4 values
\n
\n padding: 20px 50px 60px 40px; \n top = 20px \n right = 50px \n bottom = 60px \n left = 40px\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class CssIcons extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n CSS Tutorials - Icons\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
Icons
\n
\n\n
Icons can be defined as symbols or picture representation of an element.
\n
To use CCS icons in you html page you just simply import libraries such as font awesome, google icons, bootstrap icons etc.
\n
Between <i> </i> placed the icon name.
\n \n For example\n <i className=\"fa fa-address-book\" aria-hidden=\"true\"></i>\n
\n
How to use CSS icons in an HTML page –
\n First you have to import script of that particular icon libray, for example If you are using font awesome icons then you have to imort <script src=\"https://use.fontawesome.com/86c9103e36.js\"></script> in <head> section.\n\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Introduction\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
\n \n
\n \n
Introduction
\n
\n
Javascript is a object oriented client side scripting language to make web pages interactive and dynamic.
\n
Javascript supports all features of C++ or java. But javascript is not same as java, both arre different languages.
\n
JavaScript was originally developed as LiveScript by the Netscape in 1990s. Later It renamed to JavaScript in 1995, and then became an ECMA standard in 1997.
\n
\n
Javascript frameworks –
\n
AngularJS
\n
React
\n
VueJS
\n
Ember.js
\n
Meteor
\n
Mithril
\n
Node.js
\n
Polymer Aurelia
\n
Backbone.js
\n
\n
Advantages of Javascript –
\n
Easy to learn – Javascript is easy to learn, It’s syntax is easy to understand and Javascript have predefined methods that helps in implementation of Javascript.
\n
Client side language – Javascript code runs on client server instead of web server, so it saves bandwidth and reduces the load on web server.
\n
Intercative web pages – It provides various functionalities that make web pages interactive.
\n
For example – Event call when mouse hover on any element or keyboard key pressed.
\n
Javascript is fast – Because javacript is client side language, so request not sent to the servers that takes time to reach to web server and get back to user with result.
\n
Platform independent – It is platform independent, when you write code on another machine then it will be able to run on another machine.
\n
\n
Javascript Applications
\n
•\tClient-side validation
\n
•\tDynamic drop-down menus
\n
•\tDisplaying data and time
\n
•\tDisplaying pop-up windows and dialog boxes (like alert box, confirm box and prompt box).
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptControlFlow extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Control Flow\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
JavaScript Control Flow
\n
\n
Control Statements controls the flow of program execution.
\n
These are keywords that are used for making a decision. In this, we will discuss about conditional statements and unconditional statements. These statements are used to control the flow of statements.
\n
Conditional Statements
\n
Conditional Statements are used when the execution of statements depends on one or more conditions.
\n
Decision making statements :
\n\n\n\n
• if statement
\n Syntax:\n
\n if (condition)\n {\n //if condition is true then only code to be executed;\n }\n
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html lang=\"en\"> \n <head> \n <meta charset=\"UTF-8\"> \n <title> JavaScript if statement </title> \n </head> \n <body> \n <script> \n var x = 100; \n if(x < 10){ \n document.write(\"Value of x is greater than 10\"); \n } \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n
Value of x is greater than 10
\n
\n\n
• if-else statement
\n Syntax:\n
\n if (condition)\n {\n //code to be executed if condition is true;\n }\n else {\n //code to be executed if condition is false;\n }\n
\n if (condition)\n {\n //code to be executed if condition is true;\n }\n elseif (condition) {\n //code to be executed if condition is true;\n } else {\n //code to be executed if all conditions are false;\n }\n
\n\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html lang=\"en> \n <head> \n <meta charset=\"UTF-8\"> \n <title> JavaScript if-else-if statement </title> \n </head> \n <body> \n <script> \n var a=7; \n if(a==8){ \n document.write(\"Number is equal to 8\"); \n } \n else if(a==15){ \n document.write(\"Number is equal to 15\"); \n } \n else if(a==7){ \n document.write(\"Number is equal to 7\"); \n } \n else{ \n document.write(\"Number is not equal to 8, 15 or 7\"); \n } \n </script> \n </body> \n </html> \n
\n
\n
\n
\n Output:\n
\n
Number is equal to 7
\n
\n\n
switch statement
\n Syntax:\n
\n Switch case\n switch(expression)\n {\n case value1:\n (//code to be executed)\n break;\n case value2:\n (//code to be executed)\n break;\n ......\n default:\n code to be executed if all cases are not matched;\n }\n
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html lang=\"en> \n <head> \n <meta charset=\"UTF-8\"> \n <title> JavaScript Switch Statement </title> \n </head> \n <body> \n <script> \n var favcolor='red'; \n var result; \n switch (favcolor) { \n case \"red\": \n result=\"Your favorite color is red!\"; \n break; \n case \"blue\": \n result=\"Your favorite color is blue!\"; \n break; \n case \"green\": \n result=\"Your favorite color is green!\"; \n break; \n default: \n result=\"Your favorite color is neither red, blue, nor green!\"; \n } \n document.write(result); \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n
Your favorite color is red!
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class BrowserObjectModel extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Browser Object Model\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Browser Object Model
\n
\n
Browser Object Model specifies how objects interact with browser.
\n \n
Objects of browser(Browser Object Models)
\n
Window
\n
Window is the global object of Javascript in the browser.
\n
The variables and methods are declared globally are the members of window object.
\n
Properties :
\n
•\twindow.open()
\n
•\twindow.close()
\n
•\twindow.moveTo()
\n
•\twindow.resizeTo()
\n
•\twindow.innerHeight
\n
•\twindow.innerWidth
\n \n\n
Screen
\n
Screen object is used to get the information of current screen.
\n
window.screen object is used to access the current screen.
\n\n
Properties:
\n
•\tscreen.width
\n
•\tscreen.height
\n
•\tscreen.availWidth
\n
•\tscreen.availHeight
\n
•\tscreen.colorDepth
\n
•\tscreen.pixelDepth
\n\n
Location
\n
Location objects represents the location(URL) of a document and it is used to access the location of the document.
\n
window.location is used to get the location of the page.
\n
Properties:
\n
•\twindow.location.href
\n
•\twindow.location.hostname
\n
•\twindow.location.pathname
\n
•\twindow.location.protocol
\n
•\twindow.location.assign()
\n\n
Navigator
\n
Navigator object is used to get the information about the browser and its capabilities.
\n
window.navigator.userAgent – This property is used to identifies the browser.
\n
Properties:
\n
activeVrDisplays
\n
appCodeName
\n
appName
\n
appVersion
\n
battery
\n
buildId
\n
connection
\n
cookieEnabled
\n
credentials
\n
deviceMemory
\n
doNotTrack
\n
geolocation
\n
getVRDisplays()
\n
getUserMedia()
\n
hardwareConcurrency()
\n
javaEnabled()
\n
language()
\n
languages()
\n
locks()
\n
mediaCapabilities()
\n
mediaDevices()
\n
maxTouchPoints()
\n
mimeTypes()
\n
onLine()
\n
oscpu()
\n
permissions()
\n
platform()
\n
plugins()
\n
product()
\n
productSub()
\n
registerProtocolHandler()
\n
requestMediaKeySystemAccess()
\n
sendBeacon()
\n
serviceWorker()
\n
share()
\n
storage()
\n
userAgent()
\n
vendor()
\n
vendorSub()
\n
vibrate()
\n
webdriver()
\n
Note: use window.Navigator suffix before all the properties.
\n \n
History
\n
Javascript history object is used to access the browser session history.
\n
Javascript History object have 3 methods that are used in to navigating between pages.
\n
•\t back()
\n
•\t forward()
\n
•\t go()
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptArrays extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Arrays\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n
JavaScript Arrays
\n
\n
An array is a group of elements forming a complete building block.
\n
The following are characteristics of an array –
\n
• An array is a collection of elements.
\n
• All elements contained in an array are of same data type.
\n
• This collection forms a complete set.
\n
\n
Array Declaration and Initialization
\n
If you want use array in your program then first declare variable and initialize the value to that variable.
\n
Syntax: dataType array_name[]={ };
\n
Example: int myarray [] = { 7,8,4,21 };
\n
There are 3 ways to construct array in JavaScript:
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptFunctions extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n area(){\n alert(\"Area is: \"+4*5);\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Functions\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
JavaScript Functions
\n
\n
Function is a block of code where we can implement our data to execute it. It is design to perform specific task. Functions have unique name so that other functions can call it or execute it.
\n
Syntax for declaring a function
\n
\n function functionName() {\n // Code to be executed\n }\n
\n
Function to print hello message
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <head> \n <title> Function define and call </title> \n </head> \n <body> \n <script> \n function myFunction() { \n document.write(\"Hello, welcome to this TutsFinder!\"); \n } \n myFunction(); \n </script> \n </body> \n </html>\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptEvents extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n mouseoverevent(){\n alert(\"This is TutsFinder\");\n }\n clicked() {\n alert('You have clicked a button!');\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Events\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
JavaScript Events
\n
\n
An event is something that happens. There are various events in HTML that are performed by the user in browser such as onClick, onMouseOver, keydown, keyup.
\n if (condition)\n {\n (//code to be executed if condition is true;)\n }\n elseif (condition) {\n (//code to be executed if condition is true;)\n } else {\n (//code to be executed if all conditions are false;)\n }\n
\n\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html lang=\"en\"> \n <head> \n <meta charset=\"UTF-8\"> \n <title> JavaScript if-else-if statement </title> \n </head> \n <body> \n <script> \n var a=7; \n if(a==8){ \n document.write(\"Number is equal to 8\"); \n } \n else if(a==15){ \n document.write(\"Number is equal to 15\"); \n } \n else if(a==7){ \n document.write(\"Number is equal to 7\"); \n } \n else{ \n document.write(\"Number is not equal to 8, 15 or 7\"); \n } \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n
Number is equal to 7
\n
\n\n
switch statement
\n Syntax:\n
\n Switch case\n switch(expression)\n {\n case value1:\n (//code to be executed)\n break;\n case value2:\n (//code to be executed)\n break;\n ......\n default:\n (//code to be executed if all cases are not matched;)\n }\n
\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <html lang=\"en> \n <head> \n <meta charset=\"UTF-8\"> \n <title> JavaScript Switch Statement </title> \n </head> \n <body> \n <script> \n var favcolor='red'; \n var result; \n switch (favcolor) { \n case \"red\": \n result=\"Your favorite color is red!\"; \n break; \n case \"blue\": \n result=\"Your favorite color is blue!\"; \n break; \n case \"green\": \n result=\"Your favorite color is green!\"; \n break; \n default: \n result=\"Your favorite color is neither red, blue, nor green!\"; \n } \n document.write(result); \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n
Your favorite color is red!
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptErrorHandling extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n myFunction() {\n var str = \"TutsFinder - Elementary way to find\";\n try {\n alert(str);\n }\n catch (e) {\n alert(\"Error: \" + e.description );\n }\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Error Handling\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Error Handling
\n
\n
Exception is an event that occurs during an execution of a program that disrupts the normal flow the program.
\n Try / catch block –
Error prone code is placed in try block and catch block is used to handle that error, try block should be always followed by catch or finally block.
Throw keyword that allows the user to throw an exception or any class that implements “throwable” exception.
\n Throws –
A keyword used in method declarations that specify which exceptions are not handled within the method but rather passed through the next higher level of the program.
\n
Syntax:
\n
\n {`\n <script> type = \"text/javascript\">\n try {\n // Code to run\n [break;]\n }\n\n catch ( e ) {\n // Code to run if an exception occurs\n [break;]\n }\n\n [ finally {\n // Code that is always executed regardless of\n // an exception occurring\n }]\n </script>\n `}\n
\n\n\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <head> \n <script type = \"text/javascript\"> \n function myFunction() { \n var str = \"TutsFinder - Elementary way to find\"; \n try { \n alert(str); \n } \n catch ( e ) { \n alert(\"Error: \" + e.description ); \n } \n } \n </script> \n </head> \n <body> \n <form> \n <input type = \"button\" value = \"Click Me\" onClick = \"myFunction()\" /> \n </form> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n \n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptIntroduction extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n totalElements(){\n var allcity = document.getElementsByName(\"city\");\n alert(\"Total Cities:\"+allcity.length);\n }\n count(){\n var total = document.getElementsByTagName(\"h4\");\n alert(\"Total heading tags : \"+total.length);\n }\n\n render() {\n return (\n <>\n \n Javascript Tutorials - Data Object Model\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
Data Object Model
\n
\n
DOM or Data Object Model is used to access the documents.
\n
A document object is created when html page get loaded in the browser which can be used to add dynamic content to html web pages.
\n
The object model defines all the html elements as objects, that defines properties and methods of objects for all the html elements.
Javascript program can be inserted in this program with the help of <script> tag inside html program.
\n
The type attribute in <script> tag
\n <script type=”text/javascript”>\n
This attribute is used to define the language of the script. But there is no need to use this attribute in javascript because the default language of script is javascript.
\n
External scripts
\n
If user have lots of script code to implement in html code then user can write it in external file.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptObjects extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Objects\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
JavaScript Objects
\n
\n
Javascript is a object oriented programming language.
\n
OOP is problem solving technique to develop software systems. It is a technique to think real word entities in terms of objects. These objects have some states and behaviors and provide services to application.
\n
Features of object oriented programming
\n
Abstraction
\n
Abstraction is a process to hide the implementation details from the users and showing only the functionality. It displays only essential things.
\n
Encapsulation
\n\n
It is mechanism to encapsulate or wrap up all the data into a single entity it is known as encapsulation.
\n
Polymorphism
\n\n\n
As the name suggest one name many forms, Polymorphism is the way of providing the different functionality by the functions having the same name based on the signatures of the methods.
\n
Inheritance
\n\n
Inheritance is one of the features of OOP where one class acquires the properties of another class.
\n
Inheritance represents IS-A relationship and used for reusability of code.
\n\n
There are different ways to create new objects:
\n
•\tUsing an object literal.
\n
•\tWith new keyword .
\n \n
By using literals
\n\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <head> \n <title> JavaScript Objects </title> \n </head> \n <body> \n <p> Creating a JavaScript Object by using literals.</p> \n <p id=\"demo\"> </p> \n <script> \n var website = {name:\"TutsFinder\", logo:\"Elementary way to find\"}; \n document.getElementById(\"demo\").innerHTML = website.name + \" \" + website.logo ; \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n
TutsFinder Elementary way to find
\n
\n\n
By using new keyword
\n\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <head> \n <title> Using New Keyword </title> \n </head> \n <body> \n <p id=\"demo\"> </p> \n <script> \n var website = new Object(); \n website.name = \"TutsFinder\"; \n website.logo= \"Elementary way to find\"; \n document.getElementById(\"demo\").innerHTML = website.name + \" \" + website.logo ; \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n TutsFinder Elementary way to find\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class JavascriptVariables extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Javascript Tutorials - Variables\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
JavaScript Variables
\n
\n
Variables are used to store data. It tells the system to reserve the necessary space for it.
\n
The data stored in the variable can be retrieve, update and delete.
\n
In Javascript, variable can be created by using var keyword , whereas = operator is used to assign the value to that variable.
\n
Example –
\n
Var varName = Value;
\n
Rules to define variables in C++
\n
1. A variable contains only alphanumeric characters(a-z , A-Z , 0-9) and underscore(_).
\n
2. The first character of a variable should start with alphabet(a-z , A-Z) or underscore (_).
\n
3. Variables are also case sensitive.
\n
4. Keep variables name in small alphabets.
\n\n
\n
\n
JavaScript var keyword
\n
\n
\n <!DOCTYPE html> \n <html lang=\"en\"> \n <head> \n <meta charset=\"UTF-8\"> \n <title> Embedding JavaScript </title> \n </head> \n <body> \n <script> \n var x = 7; \n var y = 8; \n var z = x + y; \n document.write(z); \n </script> \n </body> \n </html>\n
Syntax: var string_name = new String(\"string literal\");
\n\n
\n
\n
Example
\n
\n
\n <!DOCTYPE html> \n <head> \n <title> JavaScript String New Keyword </title> \n </head> \n <body> \n <script> \n var stringname = new String(\"TutsFinder – Elementary way to find\"); \n document.write(stringname); \n </script> \n </body> \n </html>\n
\n
\n
\n
\n Output:\n
\n TutsFinder – Elementary way to find\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpOverview extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Overview\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n
\n \n
\n \n \n Introduction\n
\n
PHP is Hypertext Preprocessor, initially it was known as Personal Home Page.
\n
PHP is a most popular server side scripting language that is used to create dynamic web pages.
\n
PHP is a open source and widely used scripting language was originally created by Rasmus Lerdorf in 1994.
\n
PHP code is executed on server side and displays the result in the browser in html form. PHP can be integrated with any popular databases such as mysql, Oracle, Microsoft SQL Server and so on.
\n
Prerequisites
\n
You must know at least the basics of these three languages –
\n
1.\tHTML
\n
2.\tCSS
\n
3.\tJavascript
\n\n
What should PHP file contain?
\n
Contain some text, html, css, javascript and php code.
\n
With .php extension.
\n\n
What we can do with PHP?
\n
PHP can be used to create interactive and dynamic web pages.
\n
PHP can be used to perform CRUD operations.
\n
PHP can add, delete, and update data in databases.
\n
PHP can be used to send receive cookies.
\n
Advantages of PHP
\n
Simple – PHP is the easiest scripting language. PHP is easy to learn and use, for beginners who just started out with web development php is best choice for them.
\n
Open-source – PHP is very popular and widely used open source language and maintained by a large community who makes it fast, secure and up to date.
\n
Flexibility – PHP is very flexible, the best thing in PHP is after completion of project PHP has ability to make changes and this saves lots of time.
\n
Efficiency – Depending on the web developers choice, PHP is best for small as well as for large projects.
\n \n
In next chapter we will discuss about how we can start web development with php and later on dig out some new concepts in php.
\n
\n
\n
\n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class GettingStartedWithPhp extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Getting Started\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n Getting Started\n
\n
In order to run php program on your system, you must need WampServer installed on your system to create web applications with Apache, PHP and MySql database.
So, from this way we can embedded our html code into PHP file with .php extension.
\n \n \n \n PHP Comments\n
A PHP comment is always ignored by the PHP engine. Comments are used only for reference purposes.
\n
Main purpose of comment is to make the code more understandable and readable to the users. It helps other developers to understand what you have did in your code.
\n
PHP supports single line comments as well as multiple line comments.
\n \n
For single line comments, we can use double slash // or we can either use hash #.
\n
\n
Example for single line comment
\n
\n
\n <?php \n (// Single line comment) \n # Single line comment \n echo \"Hello, world!\"; \n ?>\n
\n
\n
\n\n
For multiple line comments we can use slash and asterisk.
\n
Multi line comment start with slash followed by an asterisk and ends with asterisk followed by an slash.
\n\n
\n
Example for multi line comment
\n
\n
\n <?php \n (/* This is a multiple line comment \n That covers multiple line */) \n echo \"Hello, world!\";\n ?>\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpVariablesAndConstants extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Variables and Constants\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n \n PHP Variables\n
\n
Variables are used to store data, it tells the compiler about the nature of the data.
\n
In this chapter, we will learn about how we can store information in a variable in PHP.
\n
•\tIn PHP, a variable starts with $ sign, followed by the name of the variable.
\n
•\tIn PHP, there is no need to declare the type of variable, PHP automatically converts it into to a correct data types based on its value.
\n
•\tUse assignment operator = to assign the value to the variable.
\n
Syntax – $var_name = value;
\n \n
Rules to define variables-
\n \n
1. A variable contains only alphanumeric characters(a-z , A-Z , 0-9) and underscore(_).
\n
2. The first character of a variable should start with alphabet(a-z , A-Z) or underscore (_).
To define constant variables same rules must be follow as variables which means a valid constant first word should start with a underscore (_) or alphabet.
\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpEchoPrint extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Echo Print\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n
In this tutorial we will learn about php and echo statements to display the output.
\n \n PHP echo/print\n
\n
Echo and print both statements are used to output the string, they both are same.
\n
The only difference between them is – print has return value of 1 while echo does not have any return value. Echo can take multiple parameters while print can take only 1 parameter.
\n\n
PHP echo statement
\n
PHP echo statement can output one or more strings. It can be used with echo() or without parenthesis echo.
\n \n
\n
Example - Display String
\n
\n
\n <?php \n echo \"Hello World!\"; \n echo \"TutsFinder\"; \n echo \"Elementary way to find\"; \n ?>\n
\n
\n
\n \n
\n
Example- Display HTML code
\n
\n
\n <?php \n echo \"<h1>Hello World!</h1>\"; \n echo \"<h2>TutsFinder</h2>\"; \n echo \"<p>Elementary way to find</p>\"; \n ?>\n
Object is an instance of class. It is basic unit of system. An object is an real world entity that has some attributes, behavior and identity. Attributes and behavior of an object are defined by the class definition.
\n
For declaring an object you must declare a class first.
\n
An object is a data type that is used to store data and information.
\n
New keyword is used to create the object of the class.
\n \n
\n
Example
\n
\n
\n <?php \n (// Class definition) \n class greeting{ \n (// properties) \n public $str = \"Hello World!\"; \n (// methods) \n function show_greeting(){ \n return $this->str; \n } \n } \n (// Create object from class) \n $message = new greeting; \n var_dump($message); \n ?>\n
\n
\n
\n \n\n
Null
\n
Null is a special value that is used to represent empty variables.
\n
A null variable is empty variable that does not have any data.
It is used to storing the reference to functions and resource to an external source.
\n
Resource data type is used to handle special cases like database connections and file handling.
\n \n
\n
Example
\n
\n
\n <?php \n (// Open a file for reading) \n $handle = fopen(\"note.txt\", \"r\"); \n var_dump($handle); echo \" \"; \n (// Connect to MySQL database server with default setting) \n $link = mysql_connect(\"localhost\", \"root\", \"\"); \n var_dump($link); \n ?>\n
\n
\n
\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpControlStatements extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Control Statements\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n PHP Control Statements\n
\n
Control Statements controls the flow of program execution.
\n
These are keywords that are used for making a decision. In this, we will discuss about conditional statements and unconditional statements. These statements are used to control the flow of statements.
\n
Conditional Statements
\n
Conditional Statements are used when the execution of statements depends on one or more conditions.
\n
Decision making statements:
\n
•\tIf
\n
•\tIf-else
\n
•\tif-else-if
\n
•\tswitch case
\n \n
If statement is execute only when given condition satisfied at least one condition.
\n
This is the easiest PHP condition that looks like:
If-else-if condition is used to for multiple conditions.
\n
\n
\n if(condition1){ \n (// Code to be executed if condition1 is true) \n } elseif(condition2){ \n (// Code to be executed if the condition1 is false and condition2 is true) \n } else{ \n (// Code to be executed if both condition1 and condition2 are false) \n }\n
Switch statement – Switch statement is used to select one of many blocks of code to be executed.
\n
\n
\n switch (n) { \n case label1: \n code to be executed if n=label1; \n break; \n case label2: \n code to be executed if n=label2; \n break; \n case label3: \n code to be executed if n=label3; \n break; \n ... \n default: \n code to be executed if n is different from all labels; \n }\n
\n
\n
\n
\n
Example
\n
\n
\n <?php \n $favcolor = \"red\"; \n \n switch ($favcolor) { \n case \"red\": \n echo \"Your favorite color is red!\"; \n break; \n case \"blue\": \n echo \"Your favorite color is blue!\"; \n break; \n case \"green\": \n echo \"Your favorite color is green!\"; \n break; \n default: \n echo \"Your favorite color is neither red, blue, nor green!\"; \n }\n ?>\n
\n
\n
\n \n \n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpArrays extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Arrays\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n PHP Arrays\n
\n
Arrays enable you to store elements of same data type in the memory, in a sequential order.
\n
• An array is a collection of elements.
\n
• All elements contained in an array are of same data type.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpInclude extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Include\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n \n PHP include\n
\n
include () or require() is used to use the content of one file into another php file. We can also use require() for this. include() or require() works same as copying the script from any file and pasted into the location where it is need.
\n
Syntax
\n
include(\"path/to/filename\"); -Or- include \"path/to/filename\";
First parameter is used for filename and second parameter is tells about mode in which files need to be open.
\n \n
Modes in which file can be opened –
\n
•\t“w” – Opens a file for write only. If file not exist then new file is created and if file already exists then contents of file is erased.
\n
•\t“r” – File is opened for read only.
\n
•\t“a” – File is opened for write only. File pointer points to end of file. Existing data in file is preserved.
\n
•\t“w+” – Opens file for read and write. If file not exist then new file is created and if file already exists then contents of file is erased.
\n
•\t“r+” – File is opened for read/write.
\n
•\t“a+” – File is opened for write/read. File pointer points to end of file. Existing data in file is preserved. If file is not there then new file is created.
\n
•\t“x” – New file is created for write only.
\n \n\n
2.\tPHP read file
\n
PHP fread() function is used to read the content of the open file. It accepts only two arguments: file name and file size.
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpDateAndTime extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Date and Time\n \n \n \n \n\n \n \n \n \n \n
\n \n
\n \n PHP Date and Time\n
\n
PHP Date() function
\n
PHP date() function is used to format a date in php.
\n
This function is used to make date and time more readable that means it formats a timestamp in more readable form.
\n
For example – mm-dd-yyyy, mm/dd/yy etc
\n
Syntax
\n
date(format,timestamp)
\n
Format – In which format you want to show you date and time.
\n
Timestamp – Specify a timestamp.
\n \n
For Date
\n
In order to get a date we have to used some special characters that are
\n
•\tm – It is used to represents month (01 to 12)
\n
•\td – It represents the day of the month (01 to 31)
\n
•\ty – Represents the year.
\n\n \n
\n
Example to show date in different formats:
\n
\n
\n <?php \n echo \"Today is \" . date(\"Y/m/d\") . \"<br>\"; \n echo \"Today is \" . date(\"Y.m.d\") . \"<br>\"; \n echo \"Today is \" . date(\"Y-m-d\") . \"<br>\"; \n echo \"Today is \" . date(\"l\"); \n ?>\n
\n
\n
\n \n\n
For Time
\n
Some characters that are used in to get a time
\n
•\tH - 24-hour format of an hour (00 to 23)
\n
•\th - 12-hour format of an hour with leading zeros (01 to 12)
\n
•\ti - Minutes with leading zeros (00 to 59)
\n
•\ts - Seconds with leading zeros (00 to 59)
\n
•\ta - Lowercase Ante meridiem and Post meridiem (am or pm)
\n\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpFunctions extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Function\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n \n PHP Functions\n
\n
Function is a block of code where we can implement our data to execute it. It is design to perform specific task. Functions have unique name so that other functions can call it or execute it.
\n\n
How to create and invoke a function
\n
\n
\n
\n function functionName(){ \n // Code to be executed \n }\n
\n
\n
\n
\n
\n
Example
\n
\n
\n <?php\n\n (//define a function that displays hello function)\n\n function hello(){\n echo “Hello World”;\n }\n hello();\n\n ?>\n
\n
\n
\n \n\n
\n
Function with parameters
\n
\n
\n <?php \n (// Defining function) \n function getSum($num1, $num2){ \n $sum = $num1 + $num2; \n echo \"Sum of the two numbers $num1 and $num2 is : $sum\"; \n } \n (// Calling function) \n getSum(10, 20); \n ?>\n
\n
\n
\n \n\n
Advantages of using functions
\n
Reduction in code – Same function can be used anywhere in the program. Users just need to copy paste the block of code when there is need.
\n
Code can be maintain easily – Functions makes code maintainable, if user change in function than it will be automatically changed without affecting any other files.
\n
Reusability – Functions makes code reusable because same code can be used many times.
\n
Reduction in the no. of errors – When code is divided into chunks in the form of functions then it is easy to exactly know here error is occur.
\n\n
PHP has its own built-in functions and also user can define own functions i.e. user defined functions.
\n \n
PHP built in functions
\n
PHP comes with many standard built in functions, user just directly call the functions in order to use.
\n
Example – sqrt(), ettype(), print_r(), var_dump.
\n \n
PHP user defined functions
\n
These are special functions that are declare by the users, these are users own defined functions.
\n \n
Rules to create user defined functions
\n
•\tFunction names must start with a letter or an underscore but not a number.
\n
•\tFunction name must be unique.
\n
•\tFunction name must not contain spaces.
\n
\n
Example
\n
\n
\n <?php \n \n (//define a function that displays hello function) \n \n function sum(){ \n echo 1 + 2; \n } \n sum(); \n \n ?>\n
\n
\n
\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport {Link} from \"react-router-dom\";\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class PhpForm extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n PHP Tutorials - Form\n \n \n \n \n\n \n \n \n \n \n
\n \n\n
\n \n PHP Forms\n
\n
What is form?
\n
Form is used to collect some information from the user in the form of document.
\n
Form is a kind of document that containing some fields that can be filled by the user.
\n <?php \n $name=$_POST[\"name\"];//receiving name field value in $name variable \n $password=$_POST[\"password\"];//receiving password field value in $password variable \n \n echo \"Welcome: $name, your password is: $password\"; \n ?>\n
\n
\n
\n\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HrQuesAns1 extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HR Interview Questions - Set 1\n \n \n\n \n \n \n \n \n
\n \n
\n
HR Interview Questions
\n
There are some most common HR Interview Questions which will be asked everywhere so that's why we brought this content for you so that you can prepare for you interview.
\n \n \n
1. Tell me about yourself ?
\n
Ans. For experienced people:\n I am working as a technical project manager, having more than five years of experience at XYZ Company. I am a type of person that survives in a swift environment. It would be a great pleasure for me to discuss how i can be such an asset to your company.
\n
For Fresher’s:
\n
Good Morning Sir/Mam,
\n
My name is XYZ. Basically i am from Noida, and currently residing in Pune. I have completed my Graduation (tell them about your specialization e.g. BCA/B.tech) from XYZ college. My short term goal is to work in a reputed company. My long term goal is to be the most responsible and efficient employee of an organization.
\n {/* */}\n
2. Why do you want to work for this company?
\n
Ans. I would be proud to work for a reputed company like yours.I have accomplish web research and believe that the company's XYZ products and its future projections are very impressive and promising. The role i am going to get in your company fits my skills or background\t perfectly and can be utilized, respectively.
\n
3. What are your strengths?
\n
Ans. One of the qualities that describe me is my positive attitude. It actually helps me to keep myself motivated even in the most challenging situations. I also get along quite well with people and pick up new ideas quickly leading to hassle free teamwork.\n
Basically your answer should implies all the good qualities you are having in a short statement. Qualities like positivity, self-motivation, quick learner, team player etc.
\n \n
4. What are your weaknesses?
\n
Ans. This questions is basically to cross verify you but don’t ever tell about your weakness part which will impact the role you are going to hire for. The best route you can take is to propound a weakness not related to the job or role as well as give information as what you done to overcome it.
\n
5. What are your salary expectations?
\n
Ans. Salary is not an issue for me, learning and gaining experience is my top most priority. Also a reputed company like yours will provide the best best offer in the industry.
\n
6. What are your achievements in life?
\n
Ans.For fresher’s:
\n
Mention about the achievements which you had acquired in your graduation (recent one).
\n
Example: My greatest achievement so far in my career is getting awarded for topper of college having 9.2 SGPA.
\n
7. What is the reason for leaving your last job?
\n
Ans. I left my last job because I feel I want to do more, to get hold a greater opportunity and gain more knowledge in my area, also enhancing my skills.
\n
8. What is your ideology towards work?
\n
Ans. I believe when it comes to work, every piece of work regardless of size has to be done in a given time and in the right manner.
\n
9. What is your way to do leadership or describe your management style?
\n
Ans. Managing people is a skill one cans implement by listening, explaining expectations and working with your colleagues in a flexible manner. Promptness is also a key point for management.
\n
10. How would you be an asset to this company?
\n
Ans. My skills are best fitted for this position. As an employee, I handle pressure with ease and can work with minimal supervision.
\n \n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HrQuesAns2 extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n HR Interview Questions - Set 2\n \n \n\n \n \n \n \n \n
\n \n
\n
HR Interview Questions
\n
There are some most common HR Interview Questions which will be asked everywhere so that's why we brought this content for you so that you can prepare for you interview.
\n \n \n
11. What was the most difficult decision you had ever made?
\n
Ans. This is the chance to show you’re up to the task in making good decisions in challenging situations.
\n
Example- In my past company I had to choose between joining a group of employees protesting some issues in the company and staying away from the issue, I choose to be a mediator between employees and my supervisor and I was glad I made that situation because the situation ended well.
\n
12. Are you applying to other companies as well?
\n
\n Ans. Yes, I have submitted my resume in other companies as well, but I hope my priority and faith will led to land a job in your company.\n
\n
13. Why should we hire you?
\n
Ans. For the position I had applied, I believe I have the perfect combination of skills and experience that is required. Also, my 3 year experience in my past company has given me the platform to enhance my skills more that I needed to deliver for this position.
\n
14. Describe your work policy ethics.
\n
Ans. Always gives your best in every work, if not, don’t do it at all.
\n
15. Do you have any questions for me?
\n
Ans. I would like to know what the next step for me are. I would also be interested to know more details of this position I am applying for.
\n
16. Are you willing to relocate or travel?
\n
Ans. Yes, I am ready to relocate as it’s a great opportunity to work with different people and the environment. Also it will help me to boost my knowledge.
\n
17. Explain how you would be an asset to this organization?
\n
Ans. Basically for answering this question mention about your qualities.
\n
Example: I would be an asset to this company because I am go getter, achiever, team player, quick learner, versatile.
\n
18. Where do you see yourself five years from now?
\n
Ans. I want to devote the next few years learning new skills, taking up more challenging jobs and putting all my hard work which helps me to grow. A person in me after some years should be more responsible and having a more respected position.
\n
19. Describe the workplace which you thinks is the best suited for the one and increases the productivity as well.
\n
Ans. I like workplaces that emphasize both freedom and teamwork. I like collaborating with others and exchanging ideas, but I also want to have flexibility to work. Also I value the absence of restrictions, such as a casual dress code unless I’m meeting with a client or partners.
\n
20. How do you propose to compensate for your lack of experience?
\n
Ans. I am a quick learner, even time is there is something new given to me, I tried my best to complete it by doing study more and taking trainings as well.
\n
21. What suggestion have you made in your previous job that was implemented?
\n
Ans. I have once suggested that management and staff should have more regular meetings which helps to be more interactive amongst the people and knowing each other better. I was glad that it was implemented too.
\n
22. How do you cope with stress?
\n
Ans. I like to take a break for a duration which helps me to change again. I can manage stress well enough and does not decrease my productivity level.
\n
23. How did you know about this Position?
\n
Ans. I have go through the roles and responsibilities for this job, so I am fully aware and best suited for this position.
\n
24. What will you do if you don’t get this position?
\n
Ans. If I don’t get this job, I will use this experience to reflect my weakness and try my best to improve on them for the future opportunities along the way.
\n
25. What is the success for you?
\n
Ans. Ans. Success refers to completion of aim or purpose.
\n \n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class QuantSet1 extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Quantitative Abilty - Set 1\n \n\n \n \n \n \n
\n \n
\n
Quantitative Ability Questions
\n \n \n
1)\tA man bought 13 articles at Rs.70 each, 15 at Rs. 60 each and 12 at Rs. 65 each. The average price per article is?
\n
\n a) 60.25 b) 64.75 c) 65.75 d) 62.25\n
\n \n \n
2)\tA man purchased 7 bags of rice at the rate of Rs. 800 each, 8 bags of rice at Rs. 1000 each and 5 bags of rice at the rate of Rs. 1200 each. What is the average cost of 1 bag? \n
\n
\n a) 1010 b) 980 c) 1120 d) 1050\n
\n \n \n
3)\tWhat sum of money given at simple interest for 6 months at 4% p.a. to earn Rs. 150 interest?
\n
\n a) 5050 b) 9000 c)7500 c) 15000\n
\n \n \n
4)\tThe SI on a certain sum at 5% p.a. for 3 years and 4 years differs by Rs. 42. Find the principal.
\n
\n a)\t810 b) 820 c) 850 d) 840\n
\n \n \n
5)\tA certain sum of money yields Rs. 1261 as compound interest for 3 years at 5% p.a. Find the sum.
\n
\n a)\t9000 b) 8400 c) 7500 d) 8000\n
\n \n \n
6)\tA certain sum invested at 4% p.a. compounded half yearly ,amounts to Rs.7803 at the end of 1 year .The sum is.\n a)\t7200 b) 7000 c) 7700 d) 7500\n
\n
\n a)\t7200 b) 7000 c) 7700 d) 7500\n
\n \n \n
7)\tFind the value of (0.346̅7̅ + 0.133̅3̅) :\n
\n
\n a)\t0.48 b) 0.480̅1̅ c) 0.4̅8̅ d) 0.48̅ \n
\n \n \n
8) 1+ 1/2 + 1/4 + 1/7 +1/14+ 1/28 is equal to\n
\n
\n a) 2 b) 2.5 c) 3 d) 3.5\n
\n \n \n
9) ((√72-√18) ÷√12)) is equal to:\n
\n
\n a) √6 b) √3/2 c) √2/3 d) √6/2\n
\n \n \n
10) Find the value of (0.008*0.01*0.072) ÷ (0.12*0.004)\n \n
\n
\n a) 1.2 b) 0.12 c) 0.012 d) 1.02\n
\n \n \n
11) The HCF of two numbers is 15 and their LCM is 300. If one of the no. is 60. Find the other no.\n \n
\n
\n a)75 b) 50 c) 65 d) 100\n
\n \n \n
12) The least no. which when divided by 4, 6,8,12 and 16 leaves a remainder of 2 in each case:\n \n
\n
\n a) 47 b)48 c) 49 d) 50 \n
\n \n \n
13) If basis points are defined so that 1 percent equal to 100 basis points, then by how many basis points is 82.5 percent greater than 62.5 percent.\n \n
\n
\n a) 20 b) 200 c) 2000 d) 20000\n
\n \n \n
14) The time duration of 1 hour 45 minute is what percent of a day?\n \n
\n
\n a) 7.218 b) 7.291 c) 8.31 d) 8.24\n
\n \n \n
15) The cost price of a cloth a Rs. 50/ meter. After 2 successive discounts of 15% and 20% .what is the net selling price. \n \n
\n
\n a) 32 b) 33 c) 34 d) 40\n
\n \n \n
16) If the loss percent on a article is 15%, then the ratio of cost price and selling price is \n \n
\n
\n a) 17 : 20 b) 20 : 17 c) 20 :25 d) 15 : 23\n
\n \n \n
17) A can do a work in 15 days and B can do the same work in 20 days . if they work together for 4 days then the fraction of work which is left. \n \n
\n
\n a)5/15 b) 6/15 c) 7/15 d) 8/15 \n
\n \n \n
18) A and B can do a piece of work in 12 days , B and C in 15 days , C and A in 20 days. In how many days will they complete the work together?\n \n
\n
\n a)5 b) 8 c) 9 d) 10\n
\n \n \n
19) A train passes two bridges of length 500m and 250 m in 100 seconds and 60 sec. respectively .find the length of the train.
\n
\n a) 125 b) 250 c) 150 d) 160\n
\n \n \n
20) A boat goes 40 km upstream in 8 hours and 36 km downstream in 6 hours. Find the speed of boat in still water.\n
\n
\n a) 5.5km/hr b) 6km/hr c) 6.5km/hr d) 5km/hr\n
\n \n \n \n
\n \n )\n }\n}","import React from 'react';\nimport $ from 'jquery';\nimport MetaTags from 'react-meta-tags';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nexport default class HrQuesAns1 extends React.Component {\n componentDidMount() {\n window.scrollTo(0, 0);\n $(document).ready(function () {\n $('#sidebarCollapse').on('click', function () {\n $('#sidebar').toggleClass('active');\n });\n });\n }\n render() {\n return (\n <>\n \n Quantitative Abilty - Set 2\n \n\n \n \n \n \n
\n \n )\n }\n}","import ReactGA from 'react-ga';\n\nimport './assets/CSS/animate.css';\nimport './assets/CSS/bootstrap.min.css';\nimport './assets/CSS/flaticon.css';\nimport './assets/CSS/font-awesome.min.css';\nimport './assets/CSS/gijgo.css';\nimport './assets/CSS/magnific-popup.css';\nimport './assets/CSS/main.css';\nimport './assets/CSS/nice-select.css';\nimport './assets/CSS/normalize.min.css';\nimport './assets/CSS/owl.carousel.min.css';\nimport './assets/CSS/slicknav.css';\nimport './assets/CSS/style.css';\nimport './assets/CSS/theme-default.css';\nimport './assets/CSS/themify-icons.css';\n\nimport React, { Component } from 'react';\nimport { BrowserRouter as Router, Route, Redirect, Switch } from 'react-router-dom';\nimport MainLayout from './Layouts/MainLayout'\nimport CoursesLayout from './Layouts/CoursesLayout'\nimport Homepage from './Pages/Homepage'\nimport Courses from './Pages/Courses'\nimport ContactUs from './Pages/ContactUs'\nimport Feedback from './Pages/Feedback'\nimport Programming from './Pages/Programming'\nimport WebDevelopment from './Pages/WebDevelopment'\nimport PinCode from './Pages/PinCode'\n\n// Java Tutorials - Start\nimport JavaOverview from './Pages/Java/JavaOverview'\nimport SetupEnvironmentalVariables from './Pages/Java/SetupEnvironmentalVariables'\nimport ProgramExecutionInJava from './Pages/Java/ProgramExecutionInJava'\nimport FirstJavaProgram from './Pages/Java/FirstJavaProgram'\nimport JDKJREJVM from './Pages/Java/JDKJREJVM'\nimport JavaKeywords from './Pages/Java/JavaKeywords'\nimport JavaConstructor from './Pages/Java/JavaConstructor'\nimport JavaClassAndObject from './Pages/Java/JavaClassAndObject'\nimport JavaAbstractionEncapsulation from './Pages/Java/JavaAbstractionEncapsulation'\nimport JavaInheritance from './Pages/Java/JavaInheritance'\nimport JavaPolymorphism from './Pages/Java/JavaPolymorphism'\nimport JavaAssociation from './Pages/Java/JavaAssociation'\nimport JavaArray from './Pages/Java/JavaArray'\nimport JavaStrings from './Pages/Java/JavaStrings'\nimport JavaInterface from './Pages/Java/JavaInterface'\nimport JavaInnerClass from './Pages/Java/JavaInnerClass'\nimport JavaExceptionHandling from './Pages/Java/JavaExceptionHandling'\nimport JavaInputOutput from './Pages/Java/JavaInputOutput'\nimport JavaAwt from './Pages/Java/JavaAwt'\nimport JavaApplet from './Pages/Java/JavaApplet'\nimport JavaCollection from './Pages/Java/JavaCollection'\nimport JavaJDBC from './Pages/Java/JavaJDBC'\nimport JavaMultithreading from './Pages/Java/JavaMultithreading'\nimport JavaNetworking from './Pages/Java/JavaNetworking'\nimport JavaRegularExpression from './Pages/Java/JavaRegularExpression'\nimport JavaSwing from './Pages/Java/JavaSwing'\n// Java Tutorials - End\n\n// HTML Tutorials - Start\nimport HtmlIntroduction from './Pages/Html/HtmlIntroduction'\nimport HtmlMarquees from './Pages/Html/HtmlMarquees'\nimport HtmlTags from './Pages/Html/HtmlTags'\nimport HtmlForm from './Pages/Html/HtmlForm'\nimport HtmlAnchorTags from './Pages/Html/HtmlAnchorTags'\nimport HtmlAttributes from './Pages/Html/HtmlAttributes'\nimport HtmlCanvas from './Pages/Html/HtmlCanvas'\nimport HtmlComments from './Pages/Html/HtmlComments'\nimport HtmlElements from './Pages/Html/HtmlElements'\nimport HtmlIframes from './Pages/Html/HtmlIframes'\nimport HtmlJavascript from './Pages/Html/HtmlJavascript'\nimport HtmlLinks from './Pages/Html/HtmlLinks'\nimport HtmlLists from './Pages/Html/HtmlLists'\nimport HtmlStructure from './Pages/Html/HtmlStructure'\nimport HtmlMetaTag from './Pages/Html/HtmlMetaTag'\nimport HtmlStyles from './Pages/Html/HtmlStyles'\nimport HtmlTextFormattingTags from './Pages/Html/HtmlTextFormattingTags'\nimport HtmlSVG from './Pages/Html/HtmlSVG'\nimport HtmlMultimedia from './Pages/Html/HtmlMultimedia'\nimport HtmlTable from './Pages/Html/HtmlTable'\n// HTML Tutorials - End\n\n//C++ Tutorials Start\nimport CppIntroduction from './Pages/C++/CppIntroduction'\nimport Abstraction from './Pages/C++/CppAbstraction'\nimport Arrays from './Pages/C++/CppArrays'\nimport ClassAndObject from './Pages/C++/CppClassAndObject'\nimport ControlStatements from './Pages/C++/CppControlStatements'\nimport CppDataTypes from './Pages/C++/CppDataTypes'\nimport Functions from './Pages/C++/CppFunctions'\nimport CppFirstProgram from './Pages/C++/CppFirstProgram'\nimport Encapsulation from './Pages/C++/CppEncapsulation'\nimport CppEnvironmentSetup from './Pages/C++/CppEnvironmentSetup'\nimport ExceptionHandling from './Pages/C++/CppExceptionHandling'\nimport FileAndStream from './Pages/C++/CppFileAndStream'\nimport CppVariables from './Pages/C++/CppVariables'\nimport Interface from './Pages/C++/CppInterface'\nimport Loops from './Pages/C++/CppLoops'\nimport Modifiers from './Pages/C++/CppModifiers'\nimport Pointers from './Pages/C++/CppPointers'\nimport Multithreading from './Pages/C++/CppMultithreading'\nimport Namespace from './Pages/C++/CppNamespace'\nimport StorageClasses from './Pages/C++/CppStorageClasses'\nimport Strings from './Pages/C++/CppStrings'\nimport Polymorphism from './Pages/C++/CppPolymorphism'\nimport Inheritance from './Pages/C++/CppInheritance'\n//C++ Tutorials End\n\n//C Tutorials Start\nimport CIntroduction from './Pages/C/CIntroduction'\nimport FirstProgramInC from './Pages/C/FirstProgramInC'\nimport CKeywordsAndIdentifiers from './Pages/C/CKeywordsAndIdentifiers'\nimport CArrays from './Pages/C/CArrays'\nimport CommandLineArgumentsInC from './Pages/C/CommandLineArgumentsInC'\nimport CEnumeration from './Pages/C/CEnumeration'\nimport ControlStatementsInC from './Pages/C/ControlStatementsInC'\nimport DataTypesInC from './Pages/C/DataTypesInC'\nimport VariablesAndConstantsInC from './Pages/C/VariablesAndConstantsInC';\nimport TypeCastingInC from './Pages/C/TypsCastingInC';\nimport PreProcessors from './Pages/C/PreProcessors'\nimport CPointers from './Pages/C/CPointers';\nimport OperatorsInC from './Pages/C/OperatorsInC';\nimport ErrorHandlingInC from './Pages/C/ErrorHandlingInC';\nimport FileInputOutputInC from './Pages/C/FileInputOutputInC'\nimport StringsInC from './Pages/C/StringsInC'\nimport MemoryManagementInC from './Pages/C/MemoryManagementInC'\nimport LoopsInC from './Pages/C/LoopsInC'\nimport CFunctions from './Pages/C/CFunctions'\n//C Tutorials End\n\n//CSS Tutorials Start\nimport CssIntroduction from './Pages/Css/CssIntroduction'\nimport HowToUseCss from './Pages/Css/HowToUseCss'\nimport HowToAddCss from './Pages/Css/HowToAddCss'\nimport CssBackground from './Pages/Css/CssBackground'\nimport CssComments from './Pages/Css/CssComments'\nimport CssUnits from './Pages/Css/CssUnits'\nimport CssFonts from './Pages/Css/CssFonts'\nimport Table from './Pages/Css/Table'\nimport CssText from './Pages/Css/CssText'\nimport CssLinks from './Pages/Css/CssLinks'\nimport CssLists from './Pages/Css/CssLists'\nimport CssBorder from './Pages/Css/CssBorder'\nimport Opacity from './Pages/Css/Opacity'\nimport CssMargin from './Pages/Css/CssMargin'\nimport CssTransition from './Pages/Css/CssTransition'\nimport CssShadowProperty from './Pages/Css/CssShadowProperty'\nimport ZIndex from './Pages/Css/ZIndex'\nimport PseudoClasses from './Pages/Css/PseudoClasses'\nimport PseudoElements from './Pages/Css/PseudoElements'\nimport CssPosition from './Pages/Css/CssPosition'\nimport CssFlexbox from './Pages/Css/CssFlexbox'\nimport CssDisplay from './Pages/Css/CssDisplay'\nimport CssGradient from './Pages/Css/CssGradient'\nimport ThreeDTransform from './Pages/Css/ThreeDTransform'\nimport TwoDTransform from './Pages/Css/TwoDTransform'\nimport CssPadding from './Pages/Css/CssPadding'\nimport Icons from './Pages/Css/Icons'\nimport CssAnimation from './Pages/Css/CssAnimation'\n//CSS Tutorials End\n\n//JavaScript Tutorials Start\nimport JavascriptIntroduction from './Pages/JavaScript/JavascriptIntroduction';\nimport JavascriptDataTypes from './Pages/JavaScript/JavascriptDataTypes';\nimport JavascriptControlFlow from './Pages/JavaScript/JavascriptControlFlow';\nimport BrowserObjectModel from './Pages/JavaScript/BrowserObjectModel';\nimport JavascriptArrays from './Pages/JavaScript/JavascriptArrays';\nimport AJAX from './Pages/JavaScript/AJAX';\nimport JavascriptFunctions from './Pages/JavaScript/JavascriptFunctions';\nimport JavascriptForms from './Pages/JavaScript/JavascriptForms';\nimport JavascriptEvents from './Pages/JavaScript/JavascriptEvents';\nimport JavascriptErrorHandling from './Pages/JavaScript/JavascriptErrorHandling';\nimport DataObjectModel from './Pages/JavaScript/DataObjectModel';\nimport JavascriptFundamentals from './Pages/JavaScript/JavascriptFundamentals';\nimport JSON from './Pages/JavaScript/JSON';\nimport jQuery from './Pages/JavaScript/jQuery';\nimport GettingStarted from './Pages/JavaScript/GettingStarted';\nimport JavascriptRegularExpression from './Pages/JavaScript/JavascriptRegularExpression';\nimport JavascriptObjects from './Pages/JavaScript/JavascriptObjects';\nimport JavascriptVariables from './Pages/JavaScript/JavascriptVariables';\nimport JavascriptStrings from './Pages/JavaScript/JavascriptStrings';\n//JavaScript Tutorials End\n\n//PHP Tutorials Start\nimport PhpOverview from './Pages/Php/PhpOverview';\nimport GettingStartedWithPhp from './Pages/Php/GettingStartedWithPhp';\nimport PhpSyntaxAndComments from './Pages/Php/PhpSyntaxAndComments';\nimport PhpVariablesAndConstants from './Pages/Php/PhpVariablesAndConstants';\nimport PhpEchoPrint from './Pages/Php/PhpEchoPrint';\nimport PhpDataTypes from './Pages/Php/PhpDataTypes';\nimport PhpControlStatements from './Pages/Php/PhpControlStatements';\nimport PhpArrays from './Pages/Php/PhpArrays';\nimport PhpStrings from './Pages/Php/PhpStrings';\nimport PhpInclude from './Pages/Php/PhpInclude';\nimport PhpFileHandling from './Pages/Php/PhpFileHandling';\nimport PhpDateAndTime from './Pages/Php/PhpDateAndTime';\nimport PhpFunctions from './Pages/Php/PhpFunctions';\nimport PhpForm from './Pages/Php/PhpForm';\n\n//PHP Tutorials End\n\nimport HrQuesAns1 from './Pages/hr-interview-questions/HrQuesAns1';\nimport HrQuesAns2 from './Pages/hr-interview-questions/HrQuesAns2';\n\nimport QuantSet1 from './Pages/Quantitative/QuantSet1';\nimport QuantSet2 from './Pages/Quantitative/QuantSet2';\nimport QuantSet3 from './Pages/Quantitative/QuantSet3';\n\nimport SiAndCi from './Pages/Quantitative/SiAndCi';\nimport Simplification1 from './Pages/Quantitative/Simplification1';\nimport Average from './Pages/Quantitative/Average';\nimport PnC from './Pages/Quantitative/PnC';\nimport ProfitAndLoss from './Pages/Quantitative/ProfitAndLoss';\nimport SpeedTimeDistance from './Pages/Quantitative/SpeedTimeDistance';\n\nimport { library } from '@fortawesome/fontawesome-svg-core'\nimport { fab } from '@fortawesome/free-brands-svg-icons'\nimport { faHome, faEnvelope, faAlignLeft } from '@fortawesome/free-solid-svg-icons'\n\nlibrary.add(fab, faHome, faEnvelope, faAlignLeft)\n\nReactGA.initialize('G-B60N1FF5TB');\nReactGA.pageview(window.location.pathname + window.location.search);\n\nclass App extends Component {\n render() {\n return (\n <>\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n );\n }\n}\n\nexport default App;\n","const reportWebVitals = onPerfEntry => {\n if (onPerfEntry && onPerfEntry instanceof Function) {\n import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n getCLS(onPerfEntry);\n getFID(onPerfEntry);\n getFCP(onPerfEntry);\n getLCP(onPerfEntry);\n getTTFB(onPerfEntry);\n });\n }\n};\n\nexport default reportWebVitals;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport reportWebVitals from './reportWebVitals';\n\nReactDOM.render(\n \n \n ,\n document.getElementById('root')\n);\n\n// If you want to start measuring performance in your app, pass a function\n// to log results (for example: reportWebVitals(console.log))\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\nreportWebVitals();\n"],"sourceRoot":""}
![\"Tutsfinder](\"../img/logo-text.png\")
\n \n ![\"html\"/](\"img/html.png\")
\n ![\"c++\"/](\"img/c++.jpg\")
\n ![\"php\"/](\"img/php-logo.jpg\"){kind=logo}
\n ![\"pincode\"/](\"img/pincode-image.jpg\")
\n ![\"C\"](\"img/c.jpg\")
\n ![\"\"/](\"img/css.png\")
\n ![\"Javascript\"/](\"img/Javascript.png\")
\n ![\"\"/](\"img/quant.jpg\")
\n ![\"\"/](\"img/logical.png\")
\n ![\"HR\"/](\"img/HR.png\")
\n ![\"core-java\"/](\"../img/java/core-java-image.jpg\")
\n ![\"\"/](\"../img/java/setup-environment-1.png\")
\n ![\"\"/](\"../img/java/setup-environment-2.png\")
\n ![\"\"/](\"../img/java/setup-environment-3.png\")
\n ![\"\"](\"../img/java/setup-environment-4.png\")
\n ![\"\"/](\"../img/java/setup-environment-5.png\")
\n ![\"\"/](\"../img/java/setup-environment-6.png\")
\n ![\"\"/](\"../img/java/setup-environment-7.png\")
\n ![\"\"](\"../img/java/setup-environment-9.png\")
\n ![\"program](\"../img/java/program-execution.png\")
\n ![\"first-program-in-java\"](\"../img/java/first-program.png\")
\n ![\"jdk\"](\"../img/java/jdk.png\")
\n ![\"jre\"](\"../img/java/jre.png\")
\n ![\"Java](\"../img/java/java-keywords.png\")
\n ![\"Access](\"../img/java/access-specefiers.png\")
\n ![\"single](\"../img/java/single-inheritance.png\")
\n ![\"multilevel](\"../img/java/multilevel-inheritance.png\")
\n ![\"multiple](\"../img/java/multiple-inheritance.png\")
\n ![\"Hierarchical](\"../img/java/hierarchical-inheritance.png\")
\n ![\"Hybrid](\"../img/java/hybrid-inheritance.png\")
\n ![\"Association\"](\"../img/java/association.png\")
\n ![\"awt\"](\"../img/java/awt.png\")
\n ![\"awt\"](\"../img/java/awt-output.png\")
\n ![\"awt\"](\"../img/java/awt-example2.png\")
\n ![\"Threda](\"../img/java/thread-life-cycle.png\")
\n ![\"Regular](\"../img/java/regular-expression.png\")
\n ![\"Regular](\"../img/java/meta-character.png\")
\n ![\"Regular](\"../img/java/quantifier.png\")
\n ![\"MVC](\"../img/java/MVC.png\")
\n ![\"\"](\"../img/java/swing-output.png\")
\n ![\"\"/](\"../img/html/html.png\")
\n ![\"first\"](\"../img/html/first.png\")
\n ![\"Marquees\"](\"../img/html/marquees.png\")
\n ![\"Form\"](\"../img/html/form.png\")
\n ![\"Form\"](\"../img/html/form1.png\")
\n ![\"Form\"](\"../img/html/input.png\")
\n ![\"Form\"](\"../img/html/form2.png\")
\n ![\"Form\"](\"../img/html/password.png\")
\n ![\"Form\"](\"../img/html/form3.png\")
\n ![\"Form\"](\"../img/html/textarea.png\")
\n ![\"Form\"](\"../img/html/form4.png\")
\n ![\"Form\"](\"../img/html/checkbox.png\")
\n ![\"Form\"](\"../img/html/form5.png\")
\n ![\"Form\"](\"../img/html/radio-box.png\")
\n ![\"Form\"](\"../img/html/form6.png\")
\n ![\"Form\"](\"../img/html/select-option.png\")
\n ![\"Form\"](\"../img/html/form7.png\")
\n ![\"Form\"](\"../img/html/button.png\")
\n ![\"Form\"](\"../img/html/form8.png\")
\n ![\"Form\"](\"../img/html/upload-box.png\")
\n ![\"Attributes\"](\"../img/html/attributes.png\")
\n ![\"canvas\"](\"../img/html/canvas.png\")
\n ![\"canvas\"](\"../img/html/gradient.png\")
\n ![\"canvas\"](\"../img/html/stroke.png\")
\n ![\"program\"](\"../img/html/program.png\")
\n ![\"Form\"](\"../img/html/iframes.png\")
\n ![\"table\"](\"../img/html/list.png\")
\n ![\"table\"](\"../img/html/list1.png\")
\n ![\"table\"](\"../img/html/list2.png\")
\n ![\"table\"](\"../img/html/list3.png\")
\n ![\"table\"](\"../img/html/list4.png\")
\n ![\"table\"](\"../img/html/ol.png\")
\n ![\"table\"](\"../img/html/list5.png\")
\n ![\"table\"](\"../img/html/list6.png\")
\n ![\"table\"](\"../img/html/ul.png\")
\n ![\"table\"](\"../img/html/list7.png\")
\n ![\"table\"](\"../img/html/list8.png\")
\n ![\"Text](\"../img/html/text-formatting.png\")
\n ![\"multimedia\"](\"../img/html/multimedia.png\")
\n ![\"table\"](\"../img/html/table.png\")
\n ![\"table\"](\"../img/html/table1.png\")
\n ![\"table\"](\"../img/html/table2.png\")
\n ![\"table\"](\"../img/html/table3.png\")
\n ![\"C++\"](\"../img/c++/c++.jpg\")
\n ![\"Output\"](\"../img/c++/first-1.png\")
\n ![\"Output\"](\"../img/c++/first-2.png\")
\n ![\"Storage](\"../img/c++/storage-class.png\")
\n ![\"C](\"../img/c/c.jpg\")
\n ![\"C](\"../img/c/keywords.png\")
\n ![\"CSS\"](\"../img/css/css.png\")
\n ![\"CSS](\"../img/css/first.png\")
\n ![\"CSS\"/](\"../img/css/syntax.png\")
\n ![\"CSS\"/](\"../img/css/use.png\")
\n ![\"internal.png\"](\"../img/css/internal.png\")
\n ![\"Background](\"../img/css/background-color.JPG\")
\n ![\"Background\"](\"../img/css/background-image.JPG\")
\n ![\"Background\"](\"../img/css/background-repeat.JPG\")
\n ![\"CSS](\"../img/css/comments.JPG\")
\n ![\"Background\"](\"../img/css/font-color.jpg\")
\n ![\"Background\"](\"../img/css/font-size.jpg\")
\n ![\"Background\"](\"../img/css/font-family.jpg\")
\n ![\"Background\"](\"../img/css/font-style.jpg\")
\n ![\"css](\"../img/css/border-collapse.jpg\")
\n ![\"css](\"../img/css/border-spacing.jpg\")
\n ![\"Background\"](\"../img/css/text-color.jpg\")
\n ![\"Background\"](\"../img/css/text-alignment.jpg\")
\n ![\"Background\"](\"../img/css/text-letter-spacing.jpg\")
\n ![\"Background\"](\"../img/css/text-direction.jpg\")
\n ![\"Background\"](\"../img/css/text-transform.jpg\")
\n ![\"Background\"](\"../img/css/text-shadow.jpg\")
\n ![\"Background\"](\"../img/css/text-decoration.jpg\")
\n ![\"css](\"../img/css/border.png\")
\n ![\"display\"](\"../img/css/opa-0.1.png\")
\n ![\"display\"](\"../img/css/opa-0.5.png\")
\n ![\"display\"](\"../img/css/opa-1.png\")
\n\n ![\"Css](\"../img/css/margin.png\")
\n ![\"css](\"../img/css/margin1.png\")
\n ![\"css](\"../img/css/margin2.png\")
\n ![\"css](\"../img/css/margin3.png\")
\n ![\"css](\"../img/css/margin4.png\")
\n ![\"display\"](\"../img/css/text-shadow.png\")
\n ![\"display\"](\"../img/css/box-shadow.png\")
\n ![\"display\"](\"../img/css/z-index.png\")
\n ![\"pseudo](\"../img/css/pseudo-element.png\")
\n ![](\"../img/css/relative.png\"alt=\"Css)
\n ![\"Absolute\"](\"../img/css/absolute.png\")
\n ![\"display\"](\"../img/css/display.png\")
\n ![\"Gradient\"](\"../img/css/gradient1.jpg\")
\n ![\"Gradient\"](\"../img/css/gradient2.jpg\")
\n ![\"Gradient\"](\"../img/css/gradient3.jpg\")
\n ![\"Gradient\"](\"../img/css/gradient4.jpg\")
\n ![\"3DRotate\"](\"../img/css/3D-RotateX.png\")
\n ![\"3DRotate\"](\"../img/css/3D-RotateY.png\")
\n ![\"3DRotate\"](\"../img/css/3D-RotateZ.png\")
\n ![\"2DTranslate\"](\"../img/css/2D-Translate.png\")
\n ![\"2DTranslate\"](\"../img/css/2D-Rotate.png\")
\n ![\"2DTranslate\"](\"../img/css/2D-Scale.png\")
\n ![\"2D](\"../img/css/2D-Skew.png\")
\n ![\"2D](\"../img/css/2D-Matrix.png\")
\n ![\"Css](\"../img/css/padding1.png\")
\n ![\"CSS](\"../img/css/padding2.png\")
\n ![\"CSS](\"../img/css/padding3.png\")
\n ![\"CSS](\"../img/css/padding4.png\")
\n ![\"display\"](\"../img/css/icons.png\"){kind=icon}
\n ![\"javascript\"](\"../img/javascript/Javascript.png\")
\n ![\"javascript](\"../img/javascript/insert.png\")
\n ![\"php\"](\"../img/php/php.png\")
\n ![\"Quant\"](\"../img/quant/set-1/1.png\")
\n ![\"Quant\"](\"../img/quant/set-1/2.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/3.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/4.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/5.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/6.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/7.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/8.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/9.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/10.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/11.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/12.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/13.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/14.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/15.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/16.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/17.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/18.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/19.PNG\")
\n ![\"Quant\"](\"../img/quant/set-1/20.PNG\")
\n ![\"quant\"](\"../img/quant/set-2/1.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/2.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/3.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/4.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/5.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/6.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/7.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/8.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/9.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/10.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/11.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/12.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/13.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/14.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/15.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/16.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/17.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/18.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/19.JPG\")
\n ![\"quant\"](\"../img/quant/set-2/20.JPG\")
\n \n ![\"quant\"](\"../img/quant/set-3/1.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/2.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/3.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/4.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/5.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/6.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/7.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/8.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/9.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/10.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/11.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/12.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/13.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/14.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/15.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/16.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/17.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/18.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/19.JPG\")
\n ![\"quant\"](\"../img/quant/set-3/20.JPG\")
\n \n ![\"si](\"../img/quant/si&ci/1.JPG\")
\n ![\"si](\"../img/quant/si&ci/2.JPG\")
\n ![\"si](\"../img/quant/si&ci/3.JPG\")
\n ![\"si](\"../img/quant/si&ci/4.JPG\")
\n ![\"si](\"../img/quant/si&ci/5.JPG\")
\n ![\"si](\"../img/quant/si&ci/6.JPG\")
\n ![\"si](\"../img/quant/si&ci/7.JPG\")
\n ![\"si](\"../img/quant/si&ci/8.JPG\")
\n ![\"si](\"../img/quant/si&ci/9.JPG\")
\n ![\"si](\"../img/quant/si&ci/10.JPG\")
\n ![\"si](\"../img/quant/si&ci/11.JPG\")
\n ![\"si](\"../img/quant/si&ci/12.JPG\")
\n ![\"si](\"../img/quant/si&ci/13.JPG\")
\n ![\"si](\"../img/quant/si&ci/14.JPG\")
\n ![\"si](\"../img/quant/si&ci/15.JPG\")
\n ![\"si](\"../img/quant/si&ci/16.JPG\")
\n ![\"si](\"../img/quant/si&ci/17.JPG\")
\n ![\"si](\"../img/quant/si&ci/18.JPG\")
\n ![\"si](\"../img/quant/si&ci/19.JPG\")
\n ![\"si](\"../img/quant/si&ci/20.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/1.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/2.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/3.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/4.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/5.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/6.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/7.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/8.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/9.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/10.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/11.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/12.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/13.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/14.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/15.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/16.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/17.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/18.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/19.JPG\")
\n ![\"simplification\"](\"../img/quant/simplification/20.JPG\")
\n ![\"average\"](\"../img/quant/average/1.JPG\")
\n ![\"average\"](\"../img/quant/average/2.JPG\")
\n ![\"average\"](\"../img/quant/average/3.JPG\")
\n ![\"average\"](\"../img/quant/average/4.JPG\")
\n ![\"average\"](\"../img/quant/average/5.JPG\")
\n ![\"average\"](\"../img/quant/average/6.JPG\")
\n ![\"average\"](\"../img/quant/average/7.JPG\")
\n ![\"average\"](\"../img/quant/average/8.JPG\")
\n ![\"average\"](\"../img/quant/average/9.JPG\")
\n ![\"average\"](\"../img/quant/average/10.JPG\")
\n ![\"average\"](\"../img/quant/average/11.JPG\")
\n ![\"average\"](\"../img/quant/average/12.JPG\")
\n ![\"average\"](\"../img/quant/average/13.JPG\")
\n ![\"average\"](\"../img/quant/average/14.JPG\")
\n ![\"average\"](\"../img/quant/average/15.JPG\")
\n ![\"average\"](\"../img/quant/average/16.JPG\")
\n ![\"average\"](\"../img/quant/average/17.JPG\")
\n ![\"average\"](\"../img/quant/average/18.JPG\")
\n ![\"average\"](\"../img/quant/average/19.JPG\")
\n ![\"average\"](\"../img/quant/average/20.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/1.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/2.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/3.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/4.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/5.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/6.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/7.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/8.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/9.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/10.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/11.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/12.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/13.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/14.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/15.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/16.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/17.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/18.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/19.JPG\")
\n ![\"PnC\"](\"../img/quant/pnc/20.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/1.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/2.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/3.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/4.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/5.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/6.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/7.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/8.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/9.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/10.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/11.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/12.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/13.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/14.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/15.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/16.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/17.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/18.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/19.JPG\")
\n ![\"profit](\"../img/quant/profit-loss/20.JPG\")
\n ![\"Speed,](\"../img/quant/std/1.JPG\")
\n ![\"Speed,](\"../img/quant/std/2.JPG\")
\n ![\"Speed,](\"../img/quant/std/3.JPG\")
\n ![\"Speed,](\"../img/quant/std/4.JPG\")
\n ![\"Speed,](\"../img/quant/std/5.JPG\")
\n ![\"Speed,](\"../img/quant/std/6.JPG\")
\n ![\"Speed,](\"../img/quant/std/7.JPG\")
\n ![\"Speed,](\"../img/quant/std/8.JPG\")
\n ![\"Speed,](\"../img/quant/std/9.JPG\")
\n ![\"Speed,](\"../img/quant/std/10.JPG\")
\n ![\"Speed,](\"../img/quant/std/11.JPG\")
\n ![\"Speed,](\"../img/quant/std/12.JPG\")
\n ![\"Speed,](\"../img/quant/std/13.JPG\")
\n ![\"Speed,](\"../img/quant/std/14.JPG\")
\n ![\"Speed,](\"../img/quant/std/15.JPG\")
\n ![\"Speed,](\"../img/quant/std/16.JPG\")
\n ![\"Speed,](\"../img/quant/std/17.JPG\")
\n ![\"Speed,](\"../img/quant/std/18.JPG\")
\n ![\"Speed,](\"../img/quant/std/19.JPG\")
\n ![\"Speed,](\"../img/quant/std/20.JPG\")
\n