JavaScript --- Basics

1. What is JavaScript

1. Overview
JavaScript is a scripting language that belongs to the network, has been widely used for Web application development, used to add functionality to a wide range of dynamic pages, to provide users with a more smooth appearance browsers.
JavaScript is one of the world's most popular scripting language.
2. Historical
originally designed by Brendan Eich Netscape's. JavaScript is a registered trademark of Oracle Corporation. JavaScript-based Ecma International has developed ECMAScript standard. JavaScript can be used in other applications, such as server-side programming.
Full JavaScript implementation consists of three parts:
ECMAScript, DOM, browser object model
ECMAScript It can be understood as a standard JavaScript, the latest version has to es6 version, but most browsers support es5 just stop at the code!

2.JavaScript Quick Start

1. The introduction of JavaScript

  • 1. Internal tags: in HTML, JavaScript code must be inserted between the tag

<script> //......</script>

  • 2. External introduced: scripts can be placed with an external file

abs.js
JavaScript 文件的文件扩展名是 .js

//。。。

test.html
如需使用外部脚本,需在 <script> 标签的 src (source) 属性中设置脚本的名称

<script src="abc.js"></script>

External JavaScript advantages :

  • HTML codes and separated
  • The HTML and JavaScript easier to read and maintain
  • Cached JavaScript file can speed up page load

Test code :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!--script标签内,写Javascript代码-->
    <!--<script>-->
        <!--alert('hello,world');-->
    <!--</script>-->


    <!--外部引入-->
    <!--注意:script标签必须成对出现-->
    <script src="js/yy.js"></script>


    <!--不用显示定义type,也默认就是 javascript-->
    <script type="text/javascript">

    </script>


</head>
<body>

<!--这里也可以存放-->
</body>
</html>

2. Basic Grammar
JavaScript严格区分大小写
1. 定义变量 变量类型 变量名 = 变量值;
2. 条件控制 alert(num);

<!--JavaScript严格区分大小写!-->
<script>
    // 1. 定义变量    变量类型  变量名  = 变量值;
    var score = 71;
    // alert(num);
    // 2. 条件控制
    if (score>60 && score<70){
        alert("60~70")
    }else if(score>70 && score<80){
        alert("70~80")
    }else{
        alert("other")
    }

    //console.log(score) 在浏览器的控制台打印变量! System.out.println();
    /*
        * asdasdasd
        * */

</script>

3. Data Types
1. Variables

var 王者荣耀 = "荣耀王者";

2.number

123 //整数123
123.1 // 浮点数123.1
1.123e3 //科学计数法
-99    //复数
NaN    // not  a  number
Infinity //表示无限大

3. String
’abc‘ “abc”
4. Boolean value
true , false
The logical operation
&& 两个都为真,结果为真
|| 一个为真,结果为真
! 真即假,假即真
6. Comparison operators
=
== 等于(类型不一样,值一样,也会判断为true)
=== 绝对等于(类型一样,值一样,结果true)
This is a JS defect, insist not to use == comparison

  • NaN === NaN, this is not all of equal value, including their own
  • It can only be judged by isNaN (NaN) if the number is NaN

Floating-point problem ::
console.log((1/3) === (1-2/3))
Try to avoid the use of floating point operations carried out, there are accuracy problems!
Math.abs(1/3-(1-2/3))<0.00000001
7.null 和 undefined

  • null null
  • undefined undefined

8. Array: Java value must be the same type of object ~, JS unnecessary so!

//保证代码的可读性,尽量使用 []
var arr = [1,2,3,4,5,'hello',null,true];
new Array(1,12,3,4,4,5,'hello');

Take array subscript: If you cross the line willundefined
9. Object: The object is braces, arrays are in parentheses

  • Using commas to separate each attribute, a need to add the last
//Person person =  new Person(1,2,3,4,5);
var person = {
    name: "yy",
    age: 18,
    tags: ['js','java','web','...']
}
  • Value takes the object
person.name
> "yy"
person.age
> 18

4. Strict inspection format
Here Insert Picture Description

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!--
    前提:IEDA 需要设置支持ES6语法
    'use strict'; 严格检查模式,预防JavaScript的随意性导致产生的一些问题
    必须写在JavaScript的第一行!
    局部变量建议都使用 let 去定义~
    -->
    <script>
        'use strict';
        // 全局变量
        let i = 1;
        // ES6   let
        
    </script>

</head>
<body>

</body>
</html>
Published 39 original articles · won praise 1 · views 540

Guess you like

Origin blog.csdn.net/love_to_share/article/details/103897449