JavaScript basics tutorial—a must-read for getting started

JavaScript is a descriptive language. In fact, it is not difficult to learn. As long as you study hard, you will learn it well. I believe that when you read this article, you must have learned HTML. The purpose of using JavaScript is to be able to To have better interaction with web pages, let’s get to the topic.

1. JavaScript

1. What is JavaScript

JavaScript is a descriptive language that is also based on Object and Event Driven , and a scripting language with security.

2. Characteristics of JavaScript

JavaScript is mainly used to add interactive behaviors to HTML pages.

JavaScript is a scripting language with syntax similar to Java.

javaScript is generally used to write client scripts.

JavaScript is an interpreted language.

3.Composition of JavaScript

ECMScript standard (standard that specifies all properties, methods and objects)

BOM Browser Object Model: Interacting with HTML

DOM Document Object Model: Access and manipulate HTML documents

4. Basic structure of JavaScript

<script language=”javascript” type=”text/javascript”>
 
</script>
 
Language=”javascript”用来表示使用的语言是javascript

5. JavaScript execution principle

1. The browser client sends a request to the server. (The address entered by the user in the browser address bar)

2. Data processing: The server side processes a page containing javaScript.

3. Send response: The server processes the HTML file containing JavaScript and sends the page to the browser client. The browser client then parses the HTML tags and JavaScript tags one by one from top to bottom, and displays the page effect. to users.

two. Ways to introduce JavaScript into web pages

1. Use the <script> tag. </script>

2. Use external JavaScript files.

If you want to run JavaScript in multiple pages to achieve the same effect, you usually use external files as .js files.

How to reference a file with a .js extension:

Note: External files cannot contain <script></script>

3. Directly in HTML tags

<input name=&#39;btn&#39; type=”button” value=”弹出消息框” onclick=”javascript:alert(“欢迎你”);”/>

3. JavaScript core syntax

1. Variable declaration and assignment

Variable declaration can only use var. The naming convention of variables is similar to Java. Var num=1;

In JavaScript, variables can be used directly without declaration, but this usage is not recommended.

2. Data type

Undefined(undefined type)

Null(empty type)

Number(numeric type)

String (string type)

Boolean (Boolean type)

3. The difference between undefined and null

null means "no object", that is, there should be no value there . Typical usage is:

(1) As a parameter of a function, it means that the parameter of the function is not an object.

(2) As the end point of the object prototype chain.

Object.getPrototypeOf (Object.prototype)// null

undefined means "missing value", that is, there should be a value here, but it has not been defined yet. Typical usage is:

(1) When the variable is declared but not assigned a value, it is equal to undefined.

(2) When calling the function, the parameter that should be provided is not provided, and the parameter is equal to undefined.

(3) The object has no assigned attribute, and the value of this attribute is undefined.

(4) When the function does not return a value, it returns undefined by default.

4. There are only 6 situations, and the judgment result is false.

null,false,undefined,0,"",NaN

5. Some common methods of string

toString();return string

toLowerCasee(); Convert the string to lowercase.

toUpperCase(); Convert the string to uppercase

charAt(index); Return the string at the specified position

indexOf(str,index); Find a certain The position where the specified string first appears in the string

Substring(index,index); Returns the string located between the specified index index1 and index2 (including index1 but not including index2)

Split(str); Split a string into a character array

6. Three ways to create an array and assign values ​​to the array

01. Var num=('1','2') ;

02.var num=new Array(2);

Num[0]=1;

Num[1]=2;

03.var num=['1','2'];

Common methods and properties of arrays
Length: Set or return the number of elements in the array

Join(): Put all the speech rates of the array into a string and divide them by delimiters.

Sort(): Sort the array

Push(): Add one or more elements to the end of the array and put back the new length.

//01. Method 1: Create an array and assign a value to the array

// var fruit = new Array('apple', 'orange', 'peach', 'bananer');

//02. Method 2: Create an array first, and then assign values ​​to the array through subscripts

var fruits = new Array(4);

fruits[0] = 'apple';

fruits[1] = 'orange';

fruits[2] = ' peach';

fruits[3] = 'bananer';

//03 Method three: similar to method one except that the symbol is changed

//var fruits = new Array['apple', 'orange', 'peach', 'bananer'];

//04. Access the data with subscript 3 in the array

document.write(fruits [0]);

//05通过数组的join方法把元素放到字符串中并用指定分隔符进行分割

var result = fruits.join(',');

//06通过sort方法对数组进行排序

fruits.sort();

//06.向末尾添加一个或多个元素，最后返回该数组的新长度

var length= fruits.push('wert','foot');

document.write('\n' + length);

//07.遍历数组

for(var item in fruits)

       {

 alert(fruits[item]);

       }

7.运算符

8 程序调试

方案一：在VS中调试

步骤：01.将要调试的页面设置成起始页

02.设置断点

03.按F5启动调试

方案二：chrome浏览器调试

步骤：01.点击F12，将工具调出

02.设置断点

03.刷新页面

方案三：IE浏览器

步骤：01.F12，开发人员工具

02.切到脚本选项卡

03.设置断点

04.启动调试

 05.刷新

四.JavaScript中的函数

1.常用的系统函数

01.   parseInt（“字符串”）；

parseInt（）函数首先查看位置为0处的字符，判断他是否为一个有效数字，如果不是则返回NaN，不在执行其他操作，但如果该字符是有效参数，则该函数将查看位置为1处的字符，进行同样的测试，这一过程将持续到发现该字符是有效字符为止，此时该字符将之前的字符串转换成数字。

eg：

var num1=parseInt(“78.9”)//返回值为78

var num2=parseInt(“afa78.9”)//返回值为NaN

02.parseFloat（“字符串”）；

他的用法和parseInt类似，只不过字符串中出现的第一个点将被认为是有效字符.

eg:

var num1=parseInt(“78.9”)//返回值为78

var num2=parseInt(“afa78.9”)//返回值为NaN

2.自定义函数

在JavaScript中，自定义函数是由function,函数名，一组以参数以及置于括号中待执行的JavaScript语句组成。

下面来看一看语法：

function 函数名(参数1，参数2,..)

{

//JavaScript语句

[return 返回值]

}

function是定义函数的关键字，必须有。

参数1，和参数2是该函数的参数，因为JavaScritp他本省的类型是弱类型，所有在给定参数时没有必要提供类型

{}定义的函数的开始和结尾.

return 语句用来规定函数返回的值.

2.调用函数

要执行一个函数，首先肯定要调用这个函数，必须制定函数名和其后的参数。

eg：

<script type=”text/javascript”>
 
function show(){
 
 
 
}
 
show();
 
</script>

3.匿名函数

匿名函数就是没有名字的函数了，也叫闭包函数(closures),允许 临时创建一个没有指定名称的函数。最经常用作回调函数(callback)参数的值，很多新手朋友对于匿名函数不了解。这里就来分析一下。

function 函数名(参数列表){函数体;}

如果是创建匿名函数，那就应该是：

function(){函数体;}

因为是匿名函数，所以一般也不会有参数传给他。

为什么要创建匿名函数呢？在什么情况下会使用到匿名函数。匿名函数主要有两种常用的场景，一是回调函数，二是直接执行函数。

eg：

<script language="javascript">
var a = "a";
(function(){
  var a="b";
  alert(a);
})();
alert(a);
</script>

在上面这段代码中，会顺序输出两个alert框。第一个alert框内容为b，第二个为a。以为该Script标签中有一个匿名方法时自调用的，所有首先弹出b，然后碰到匿名方法后的alert（a）则弹出a。

以上这篇JavaScript基础教程——入门必看篇就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持PHP中文网。

更多JavaScript basics tutorial—a must-read for getting started相关文章请关注PHP中文网！