JavaScript Basics (i)

The history of JS
1994, the speed of foreign 7kb/10kb around
Netscape---livescript (Navigator's browser)
90 The birth of the Java language
jdk1.0--"Java"--Netscape and Sun company-javascript
Javascript
Microsoft company-jsscript (will browser free ...), Monopoly market

JavaScript and JScript
ECMA: Federation of European Manufacturers organizations unify the grammar of the two languages
The same as the underlying syntax
BOM Programming: Browser Object model: Programming with browser-based objects
DOM Programming: Document Object Model: programming based on documents

XML parsing
Dom parsing
Sax parsing

Basic syntax for javascript:

1. Use of JavaScript
   is divided into two ways:
   1) Internal mode
   Write the script tag in the head tag of the HTML

2) External mode: Import the external JS file

2. JavaScript variable problems and data types
   
3. Type conversion function

5. The JavaScript operator

6. JavaScript Process Control Statements
   Roughly the same syntax as the Java language!
   4. Function concept
   Built-in objects in 5.Js
   String
   Number
   Boolean
   Math
   Date
   6. Two functions commonly used in JavaScript
   Alert ("Popup a Hint box");
   document.write ("Output content to browser")
   7.witch statement: Format Witch (document) {...}
   Use the Document object as a witch statement parameter, then directly using write () in it;
   8.or-in: Traversal for an array or an object
   for (VAR traversal variable name in array name/object name)//{
   Output variable Name
   }
   If the object (the object in JS is a focus), then the variable name is the property of the current object.
   9. Functions
   Definition of the function:
   Function name (formal parameter list)//{
   Statement

       }

   Call to function
   Function name (actual argument list);

   Functions in the note:
   1) function of the formal parameters can not be defined by the VAR keyword, otherwise error
   2) in JS function is can have return statement, direct return, but no return value
   3) in JS, the function is a non-existent overload concept, The function defined later overrides the previously defined function
   4) when the number of actual arguments is less than the number of formal parameters, a value is definitely nan, and if the actual argument is greater than the formal parameter, the previous value is eventually computed and then discarded!
   5) in each JS function, there is a default array: arguments, which is the function of the actual parameters from left to right assigned to the formal parameters (left to right)
   10.String object
   JS String Object Common method
   Chatat (): Returns the character at the specified index position
   indexOf (): The index that represents the first occurrence of a substring in the current string
   LastindexOf ();
   FontColor (): Sets a color tag for the current string
   Substrint (start,end): Intercept function
   11.Math object
   Rounding up//in integer position +1
   var num = 4.30;
   document.write (Math.ceil (num) + "<br/>");
   Rounding Down: if there are fractional parts, remove the decimal part, preserving the integer digits
   document.write (Math.floor (num) + "<br/>");
   Rounding
   document.write (Math.Round (num) + <br/>);
   Random number (): contains 0, but does not contain 1
   document.write (math.random () *100+ "<br/>");
   Max/min
   document.write (Math.max (num,100));

   12. Timers
   1) setinterval ("task", millisecond value); Repeat this task (function) for every millisecond of the number of milliseconds
   2) Timeout ("task", millisecond value); After a few milliseconds, perform this task once
   13.Data objects
   How to create a Date object
   var date = new Date ();
   alert (date); Sun June 2018 16:05:35 gmt+0800 (China Standard Time)

   获取系统时间:  2018年6月17日 XXX时:xx分:xx秒        --->Java中存在一个类:SimpleDateFormatgetFullYear :获取年份document.write(date.getFullYear()+"年") ;获取月份:getMonth 方法返回一个处于 0 到 11 之间的整数，document.write((date.getMonth()+1)+"月") ;获取月份中的日期document.write(date.getDate()+"日"+"  ") ;获取一天当中的小时document.write(date.getHours()+":") ;获取分document.write(date.getSeconds()+":") ;获取分钟的秒document.write(date.getMinutes()) ;

How 14Array objects are created
1) Mode 1: equivalent to dynamic initialization
var arr = new Array (3);
2) var arr = new Array (); Represents 0 Lengths
3) Specify the specific elements in the array directly
var arr = new Array ("Hello", 100,true, ' a ');
Precautions:
1) in JS, the array can store any type of element!
2) in JS, there is no array angle index out of bounds one said that the number of elements in the array can be continuously increased. There will be no exceptions!

**      (二)自定义对象**(1)js中的自定义对象        定义对象            1)相当于有参构造 的形式            2)无参构造的形式            function 自定义对象(Person) (参数名){                定义属性                定义方法            }            创建对象            var p = new Preson(实际参数) ;            //输出对象p中的属性值            //调用对象p中的方法    方式1:自定义对象方式1 :有参构造的形式定义一个对象function Person(name,age){ //this:代表当前对象    定义属性    this.name = name ;    this.age = age ;    定义方法    this.speak = function (){        alert("这是说话的功能...")    }}

Creating objects
var p = new Person ("Zhang San", 28);

方式2:无参构造的形式定义一个对象function Person(){}创建对象var p = new Person() ;追加属性p.name = "李四" ;p.age = 38 ;//追加方法p.speak = function(){    alert("这是李四说话的功能...")}//自定义对象方式3: 利用Object对象 ,Object对象在js中代表任意对象的一个模板定义对象function Person(){}创建对象var p = new Object() ;追加属性p.name = "厄齐尔" ;p.age = 29 ;追加方法p.play = function (){    alert("全场隐形...") ;}自定义对象方式4    json解析  (全国的省市区三级联动)        "标题1":"内容","名称2":"内容2""属性名1":值1, "属性名2":值2, "方法名":function(){    }var p = {    //就是json格式的写法    //追加属性    "name":"王五",    "age":28,    "play":function(){        alert("王五会踢球...")    }};要么使用for-in语句将对象的属性遍历出来,或者直接输出document.write(p.name+"<br/>") ;document.write(p.age+"<br/>") ;调用方法p.play();

(iii) prototypes
(1) Design an array tool object, such as the Arrayutil object, which provides the following two methods:
Search (Array,target): Passes in the specified array and the specified string, returning the location of the specified string
Max (array): Pass in the specified array, returning the maximum value in the array

<meta charset= "UTF-8" >
<title> Custom Object Exercises </title>
<script src= "Js/arrayutil.js" ></script>
<script type= "Text/javascript" >

//创建一个数组,静态初始化var arr = [43,65,13,87,3,19] ;//创建ArrayUtil对象var arrayUtil = new ArrayUtil();//查询3这个元素对应的索引var index = arrayUtil.search(arr,300) ;document.write("你要查找的元素的位置是:"+index) ;document.write("

</script>
<body>
</body>


(2 problem: Just used to customize an object Arrayutil object, complete just query and the most value operation;
How to append Search () and Max () to an array (JS built-in object) object without providing any tool classes
There are methods for array objects
function Array () {

 this.join = function() { } this.reverse = function(){ } 追加 this.search() = function(){ } 这样写就不行了,因为Array对象是内置对象,不能直接这做,获取不到源码! }原型(prototype) 作用:就是给js中的内置对象追加方法使用的 1)每一个js内置对象都有一个原型属性(prototype) 2)如果往原型对象中追加一个方法,那么这个方法会自动追加到内置对象中 3)原型属性是可以直接被内置对象调用然后追加方法

(iv) Other objects
(1) Windows objects
Window object: It represents a Windows object for the browser

 Note: Because of the frequent invocation of methods in the Window object, in order to simplify the writing process, sometimes window can remove the method involved: open ("Opening the resource file URL "," in what way to open (_blank)/_self "," Specify newly opened window and height ") and timer-related methods: SetInterval (" task ", time millisecond value); Repeat this task after a few milliseconds clearinterval (): Canceling and setinterval related Tasks Window.clearinterval (iintervalid): This is going to insert a Id setTimeout ("task", time millisecond value); The number of milliseconds after which only one cleartimeout (): Cancels and settimeout related timeout events and the Bullet Box related method Window.alert ("Prompt box"); Window can omit window.confirm ("message dialog box"); There is a confirmation box, prompt: Prompt dialog box with a message and an input box (2) Location object: HREF attribute: The href attribute of the page can be modified to implement the HREF attribute of page jump change:---URL (Uniform Resource Locator) URI method: Timed Refresh: Reload () (3) method in history object forward: Mount the next URL in the historical list Back: Loading the previous URL in the History list go (positive or negative integer) (4) Screen object property Description availheight Gets the work area height of the system screens, excluding Microso Ft? WiNdows? Task bar. Availwidth (5) JS listener 

(6) Event programming Categories: 1) and click-related events Click Click events: OnClick Double click event: Obdbclick 2) and focus related events get focus event: Onfocus Lost Focus Event: onblur 3) and TAB changed Events related to tab changes: onchange (drop-down menu, select tag) and mouse-related events: onmouseover: Mouse-over event onmouseout: mouse-over event and page load related events: OnLoad is generally used in body This event is triggered when the contents of the body are loaded.

JavaScript Basics (i)