Tag: objects

CSS manipulation in JavaScript

by rajeshkumarJavaScriptLeave a Comment on CSS manipulation in JavaScript

CSSStyleDeclaration Object

The CSSStyleDeclaration object represents a collection of CSS property-value pairs.

It is used in API :

HTMLElement.style
window.getComputedStyle( )

Properties

  • cssText
  • length
  • parentRule

Methods

getPropertyValue(property)
getPropertyPriority(property)
removeProperty(property)
setProperty(property, value, priority)
item(index)

Style Property

The style property is used to get or set the inline style of an element. While getting, it returns a CSSStyleDeclaration object that contains a list of all styles properties for that element with values assigned for the attributes that are defined in the element’s inline style attribute.

Style Property represents only the CSS declarations set in the element’s inline style attribute, not those that come from style rules elsewhere, such as style rules in the <head> section, or external style sheets or browser default.

Syntax:-

Return
element.style.property

Set
element.style.property = “value”

A style declaration is reset by setting it to null or an empty string, e.g. element.style.property = null

Inline Style Manipulation

The most direct way to modify CSS value with JavaScript is through the style property that corresponding to the inline style sheet specification for a particular HTML element. To perform a manipulation of the CSS with a JavaScript DOM interface, you would access the style object of the element.

Style Property

Example: –

Dynamic Style Manipulation

As we know The most direct way to modify CSS value with JavaScript is through the style property that corresponding to the inline style sheet specification for a particular HTML element, This has performance considerations since you need to change a single property at a time. We might manipulate style rules using CSS class Selector. The element’s class attribute is represented as className property in DOM.

DOMTokenList

The DOMTokenList interface represents a set of space-separated tokens. Such a set is returned by Element.classList, HTMLLinkElement.relList, HTMLAnchorElement.relList, HTMLAreaElement.relList, HTMLIframeElement.sandbox, or HTMLOutputElement.htmlFor.  etc. It is indexed beginning with 0 as with JavaScript Array objects. DOMTokenList is always case-sensitive.

Properties
length
value

Methods
item()
add()
remove()
replace()
contains()
toggle()
value()

classList Property

The Element.classList is a read-only property that returns a live DOMTokenList collection of the class attributes of the element.

Syntax: –

var elementClasses = elementNodeReference.classList;

Computed Style

The computed style is the style actually used in displaying the element, after “stylings” from multiple sources have been applied.
Style sources can include: internal style sheets, external style sheets, inherited styles, and browser default styles.
Style Property represents only the CSS declarations set in the element’s inline style attribute, not those that come from style rules elsewhere, such as style rules in the section, or external style sheets or browser default. To get the values of all CSS properties for an element you should use window.getComputedStyle( ) instead.
The returned style is a live CSSStyleDeclaration object ( The CSSStyleDeclaration object represents a collection of CSS property-value pairs.), which updates itself automatically when the element’s style is changed.

Syntax:-
window.getComputedStyle(element, pseudoElement)
Element – Element for which to get the computed style.
pseudoElement – A string specifying the pseudo-element to match. Must be omitted (or null) for regular elements.

Ex: –
var elm = document.getElementById(“myid”);
var allCSSProp = window.getComputedStyle(elm)

Tagged : / / / / /

How to check properties on objects in JavaScript?

by rajeshkumarJavaScriptLeave a Comment on How to check properties on objects in JavaScript?

Check Properties exist

  • Check Properties exist

Syntax:- if (typeof object_name.key !== „undefined‟)

Ex:-

Check Properties exist

  • in operator

Syntax: – if („key‟ in object_name)

Ex:-

Check Properties exist

  • hasOwnProperty ()

Syntax: – if (object_name.hasOwnProperty(“key”))

Ex:-

Tagged : / / / /

Immediately Invoked Function Expression (IIFE)

by rajeshkumarJavaScriptLeave a Comment on Immediately Invoked Function Expression (IIFE)

IIFE (Immediately Invoked Function Expression) is a JavaScript function that runs as soon as it is defined.
It is a design pattern which is also known as Self-Executing Anonymous Function and contains two major parts. The first is the anonymous function with lexical scope enclosed within the Grouping Operator (). This prevents accessing variables within the IIFE idiom as well as polluting the global scope.
The second part is creating the immediately executing function expression (), through which the JavaScript engine will directly interpret the function.

Immediately Invoked Function Expression (IIFE)

  • Avoid Creating Global variable and Functions
  • As it doesn‟t define variable and function globally so there will be no name conflicts
  • Scope is limited to that particular function

Pass by Value

  • JavaScript arguments are passed by value: The function only gets to know the values, not the argument’s locations.
  • If a function changes an argument’s value, it does not change the parameter’s original value.
  • Changes to arguments are not visible (reflected) outside the function.

Pass by reference

  • In JavaScript, object references are values.
  • Because of this, objects will behave like they are passed by reference:
  • If a function changes an object property, it changes the original value.
  • Changes to object properties are visible (reflected) outside the function.

Tagged : / / /

Advance PHP

by rajeshkumarphpLeave a Comment on Advance PHP

What was easy in any language was made core and what became difficult was made an advance. What happens in Core is of basic level and what happens in Advance is of upper-level.

Object Oriented Progrmming

Object-Oriented Programming is a Technic that solves the problem. In this, the code breaks the object. And you see your problem on the side of the object. In which you find your problem similar to the real-world problem and it is easy to maintain, and it has to be solved.

Class

The PHP class has a group of values. To manipulate whatever value you write inside the class, you also write operations in it. The class gives you this facility, that if the user does not need to know the information. So you can also hide the information. To use the application, you can keep it hidden for security purposes. Or if it will be accessed from the outside users or from an outside viewer then your application may be damaged. That’s why you can keep your application hidden, it gives class facility. You can define type using class.

Rule

  • The class name can be any valid label.
  • It can’t be PHP reserved world.
  • The class name must start with a letter or an underscore. Following by any number of letters, numbers, or underscore all this will work. Lwkin should not start with number.
class Classname
{
	var $variable_name;  (It is also called Data Member/Properties or Attribute.)
	var $variable_name;
	
	function Method_name()
	{
		Body of method;
	}
	function Method_name(parameter_list)     (And these methods are called methods or member functions.)
	{
		Body of Method;
	}

}

See your problem in the real world.

class Mobile
{
	public $model;
	function show Model (Sumber)
	{
		$this->model = $number;
		echo "Model Number: $this->model";
	}
	
}

Object

The object is a variable of class data type. Whenever you create an object, for that object, whatever is proper inside the class, a copy of it is prepared and it is prepared for that object. If there are 2 objects then 2 copies of that variable or that property will be created and one copy for the first object and a second copy for the second object. Whatever object you make, its copy will be ready and one copy will be distributed. But this is not the case with the member function. The member function is the same, all the objects share with it.

The new Operator is used to create an object.

Syntax:

class Mobile
{
	public $model;
	function show Model (Sumber)
	{
		$this->model = $number;
		echo "Model Number: $this->model";
	}
	
}
$samsung = new Mobile;
$samsung->showModel('A5');

$lg = new Mobile;
$lg->showModel('M30');

You will not need to write the class, again and again, you just have to create an object of it. And call this method with the help of that object. It will show its own model number.

Important thing

A class is of no importance unless it has an object.

Accessing class member using object

How would you make accessing a member of a class into a user object?

-> This operator is used to access the member of the class.

object_name->variable_name;
$samsung->model;

access to method
Object_name->method_name();
$samsung->showModel();

in parameter
Object_name->method_name(parameter_list)
$samsung->showModel(‘A8’);

Tagged : / / / /

Introduction to Object Oriented Programming in PHP

by Joydeep MProgramming Scripting LanguagesLeave a Comment on Introduction to Object Oriented Programming in PHP

OOPs stands for Object Oriented Programming which is all about creating class and objects. Class serves as a template and multiple objects can be created using the class.

Oops concept reduces code repetition. Classes are templates for creating objects.

For an example, if we see a game take it as a Racing game where we will be having multiple cars which will be running there. So in this case either we have to write codes for each car individually or else we can create a class for car and then we can use it multiple times for the other class with that class name.

A class is a self-contained, independent collection of variables and functions which work together to perform one or more specific tasks, while objects are individual instances of a class.

We can see an example given below:

References:

Tagged : / / / /