ある人が初めて javascript_javascript スキルを学んだときに書いた学習メモ

/*
* A JavaScript object is a collection of properties (methods)
* In this language, if the variable name or method name does not comply with the declaration specification,
* must be used Square brackets "[]" refer to it
*
*/
/**
* <1.>This statement declares a class1 class, class1 is equivalent to a construction method, also called a constructor
* It can also be said to declare a class1 method
*/
function class1(){
this.name="xjl"; //give Add attributes to the object
this.say= function(){alert("Hello everyone!");}; //Add methods to the object
};
/**
* <2.> Use the new keyword to create an instance. The new operator is not only valid for internal classes, but also for user-defined classes.
* Each object can be regarded as multiple attributes ( A collection of methods), that is, object names. Attribute (method) names or object names ["attribute (method) names"]
* Square brackets '[]' are suitable for occasions when you are not sure which attribute (method) to refer to
*/
var a = new class1();
//alert(typeof(a)); //typeof(a) returns the type of a
//alert(a.name); //Each object can be viewed Operation is a collection of multiple attributes (methods),
//alert(a['name']); //Use square brackets ([]) to reference the attributes and methods of the object
//Drop-down box object name [Drop-down box object.value] You can get the value selected by the user. You can also use eval("Drop-down box object name." Drop-down box object. value);
//a.say(); //Call the object's method
//var arr=new Array();
//arr['push']('abc'); //Add an element to the array, where push is a built-in attribute
// arr['push']('1234'); //Add an element to the array
//alert(arr);
/**
* <2.> Dynamically add, modify, and delete object properties and methods
*
*/
var obj = new Object() ;
//Add attributes...the attribute names can be arbitrary
obj.name="Xu Jianlong";
obj.sex = 'Male';
obj['my name'] = "xujianlong"; //Use square brackets "[]" to use non-identifier strings as attribute names
//Add methods... The method name can also be chosen arbitrarily, and parameters can also be passed
obj.alert = function(a){
alert(a "Hello!");
}
//Modify the attribute, which is to change the value of the attribute to something else
obj.name = "Zhang San ";
obj['name'] = 'anme';
//Deleting an attribute means changing the attribute value to undefined or null
obj.name = 'undefined';
/* *
* <三> Create untyped objects using brace ({}) syntax
*/
//Enclose attributes and methods in curly brackets, separate attributes with commas, and separate attributes with values ​​by colons
var ob = {
name: "123 ",
say:function(){alert("123")} //The last attribute or method does not need a comma
}
//You can also use the following method to define the attributes and methods of the object
var ob1 = {"name":'123','say':function(){alert("abcd");}};
/**
*prototype prototype object
* The class corresponding to all functions is (Function)
* prototype actually represents a collection of members of a class.
* *When obtaining an object of a class through new, the members of the prototype object will become members of the instantiated object.
*/
function class2(){ //Create an object
}
var ob2 = new class2();
class2.prototype.me = function(){alert("123 ");} //In front of prototype is the class name you created
class2.prototype.name = "123"; //
/**
* The relationship between function objects and other internal objects
*/
//typeof (new Function()),typeof(Function),typeof(Array),typeof(Object) returns the string "function". These parameters are called constructors
//typeof(new Date()), typeof(new Array()), typeof(new Object()) returns the string "object"
/**
* Implicit parameters passed to the function: arguments, which have the characteristics of an array, but it is not an array and can be accessed by subscripts
*/
//arguments contains a parameter callee, which represents a reference to the function object itself , as follows:
var sum=function(n){
if(1==n)
return 1;
else
return n arguments.callee(n-1);
}
//This statement means declaring a namespace of namespace1, as follows:
var namespace1 = new Object();
namespace1.class1 = function(){alert("123");};
var obj1=new namespace1.class1(); //Executed when the page is loaded
/**
* Use prototype objects to define class members
*/
//Use the prototype attribute of the function to define the class after the statement that creates the instance New members will only be effective for objects created later
//The constructor() method in prototype is equivalent to the constructor method
function class1(){
//alert('adf');
}
//class1.prototype.constructor(); //Executed when the page is loaded
//Simplification defined with prototype
class1.prototype={
//Put in some attributes Or method
//Multiple attributes or methods are separated by commas (,)
}
//The following code is static methods and attributes
class1.name="abc";
class1.say = function(){/*codes*/}
//Using the reflection mechanism, the style specified in element can be changed, while other styles will not change, and the desired result is obtained, for example:
function setStyle(_style){
//Get the interface object to change the style
var element=getElement();
for(var p in _style){
element.style[p]=_style [p];
}
}
//Inheritance can be achieved by copying the prototype of one class to another class, but it has flaws. For example:
// function class4(){}
//
// function class2(){
//
//
// class2.prototype=class4.prototype ; //Inheritance of implementation
// class2.prototype.f = function(){alert("a");}
//
//When the prototype of class2 is changed, class4's The prototype also changes accordingly
// instanceof operator to determine whether an object is an instance of a certain class, for example:
var a = new class2();
a instanceof class2; // returns a bool , it is also true if the inherited class in class2 of a
//A better inheritance
for(var p in class1.prototype){
class2.prototype[p]=class1.prototype [p];
}
class2.prototype.ma=function(){
alert(123);
}
//When the prototype of class2 is changed, the prototype of class4 Will not change
/**
* Class inheritance implementation mechanism in prototype-1.3.1 framework
*/
//---------------------------------- -------------------------------------------------- ----------
//This statement adds an extend method to each object. The code is as follows;
Object.extend = function(destination, source) {
for (property in source) {
destination[property] = source[property]; //Assign all properties or methods in source to destination
}
return destination;
}
// Add the method extend for each object through the Object class
Object.prototype.extend = function(object) {
return Object.extend.apply(this, [this, object]);
}
Object.extend.apply(this,[this,object]);
//class1 inherits from class2. The advantage is that using new class2() is equivalent to assigning a copy of the prototype of class2 to class1
//in class1 Changes to the prototype in will not affect the prototype in class2
class1.prototype=(new class2()).extend({/*Attributes or methods to be added to class1*/});
/**
* A method that only declares but does not implement it. A class with virtual functions is called an abstract class. Abstract classes cannot be instantiated
*/
//The virtual method is used directly without declaration. These methods will be implemented in derived classes, for example:
function c1(){}
c2.prototype={
fun:function(){ this.fn();}//The fn method therein Undefined
}
function c2(){}
c1.prototype=(new c2()).extend({
fn:function(){var x = 1;}
});
//this.initialize.apply(this, arguments); This statement is to pass the parameters when creating the object to the initialize method
/***
* In javascript, you can also use the try-catch-finally statement to capture exceptions or error messages
* Among them, the e in the parentheses of catch (e) is required. e is an object named error. Object
* e=new Error(message) to create this object, the description of the exception is used as an attribute message of the error object,
*/
//This code Demonstrates the throwing of exceptions
function s(a,b){
try{
if(b==0)
throw new Error("The divisor cannot be zero! ..... ...");
else
alert(a/b)
}catch(e){
document.write(e.message);///Get the actual value in Error through message Reference
}
}
onlaod=s(1,0);