JS超详细学习笔记_toutcstring() { [native code] }-CSDN博客

本文链接：https://blog.csdn.net/Barry_kk/article/details/113763576

这篇博客详细介绍了JavaScript，从概述和历史开始，逐步讲解快速入门、数据类型、函数、内部对象和面向对象编程等内容，特别强调了操作BOM和DOM对象的重要性，并提到了jQuery的使用和巩固JavaScript的学习方法。

摘要由CSDN通过智能技术生成

1.什么是JavaScript

1.1概述

JavaScript一门世界上最流行脚本语言。

一个合格的后端人员，必须精通JavaScript。

1.2历史

ECMAscript它可以理解为JavaScript的一个标准，最新版本已经到es6版本，但是大部分浏览器还只停留在支持es5代码上！

开发环境—线上环境，版本不一致。

2.快速入门

2.1 引入JavaScript

1.内部标签

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

2.外部引入

abc.js

//...

test.html

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

2.2基本语法入门

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--    Javascript严格区分大小写！-->
    <script>
        // 1.定义变量   变量类型   变量名=变量值；
        var score = 77;
        // 2.条件控制
        if(score>60&&score<70){
    alert("60-70")
        }else if(score>70&&score<80){
    
            alert("70-80")
        }else{
    alert(other)}
        // 3.多行注释  /*    */
        // 4.console.log(score)  在浏览器的控制台打印变量！System.out.println()
        // 5.
    </script>
</head>
<body>
</body>
</html>

浏览器必备知识：

2.3.数据类型

数值文本图形音频视频…

变量(定义是不能以数字开头)

var 王者荣耀="倔强青铜"

number

js不区分小数和整数 Number

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

字符串

‘abc’ ‘‘abc’’

布尔值

true , flase

逻辑运算

！

比较运算符

= 赋值

== 等于（类型不一样，值一样，也会判断为true）

=== 绝对等于（类型和值一样）

须知：

NaN与所有的数值都不想等，包括自己
只能通过isNaN(NaN)来判断这个数是否为NaN

浮点数问题：

console.log((1/3)===(1-2/3))

尽量避免使用浮点数进行运算，存在精度问题！

Math.abs(1/3-(1-2/3))<0.00001

null和undefined

null 空
undefined 未定义

数组

java的数组必须是相同的类型，一系列相同类型的对象,js中不需要这样！

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

去数组下标，如果越界了，就会 undefined

对象

对象是大括号，数组是中括号

，每个属性之间使用逗号隔开，最后一个不要添加

//Person person=new person(1,2,3,4,5);
        var person={
            name:"kk",
            age:18,
            tags:['js','java','web']
        }

取对象的值

person.name
"kk"

2.4严格检查格式

（‘use strict’；）

<script>
//'use strict';   严格检查模式，预防JavaScript的随意性导致产生的一些问题
//'use strict'; 必须写在JavaScript第一行；
//局部变量 建议都是用let去定义
        'use strict';
        //Es6  let定义局部变量
        let i=2;
    </script>

3. 数据类型

3.1字符串

正常字符串我们使用’ ‘或者“ ”包裹
注意转义字符 \

\'
\n
\t
\u4e2d  unicode字符
\x41   Ascll字符

多行字符串编写

//tab上面的piao
        var msg=`
        world
        你好
        kk
        `

模板字符串

//tab上面的piao
        let name ='kk';
        let agr=18;
        let msg=`
        你好呀,
        ${name}
        `

字符串长度

str.length

字符串的可变性，不可变

student[0]=1
1
console.log(student)
VM361:1 student

大小写转换

//注意：这里是方法，不是属性
console.log(student.toLocaleUpperCase())
console.log(student.toLocaleLowerCase())

student.indexOf(‘u’)

console.log(student.indexOf('u'))
//字符串中u的位置

substring

console.log(student.substring(1,3))
tu
//字符串中2.3的内容

3.2数组

Array可以包含任意数据类型

var arr =[1,2,3,4,5,6]  //通过下标取值和赋值
arr[0]
arr[0]=1;

长度

 arr.length

注意：假如给arr,length赋值，数组大小会发生变化~如果赋值过小，元素会丢失

indexOf,通过元素获得下标索引

arr.indexOf(2)
1

字符串的1和数字1是不同的！

slice（）截取Array的一部分，返回一个新的数组

arr=[1,2,3,4,5,6,"1","2"]
(8) [1, 2, 3, 4, 5, 6, "1", "2"]
arr.slice(3)
(5) [4, 5, 6, "1", "2"]

push和pop(压入尾部和弹出尾部)

arr
(8) [1, 2, 3, 4, 5, 6, "1", "2"]
arr.push('a','b')
10
arr
(10) [1, 2, 3, 4, 5, 6, "1", "2", "a", "b"]
arr.pop()
"b"
arr
(9) [1, 2, 3, 4, 5, 6, "1", "2", "a"]

unshift(),shift()(压入头部和弹出头部)（同4）
排序 sort()

(5) [1, 2, 3, 4, 5]
arr.unshift(6)
6
arr.sort()
(6) [1, 2, 3, 4, 5, 6]

元素反转

arr.reverse()
(6) [6, 5, 4, 3, 2, 1]

conat()

arr.concat(["a","b","c"])
(9) [6, 5, 4, 3, 2, 1, "a", "b", "c"]
arr
(6) [6, 5, 4, 3, 2, 1]

注意：concat（）并没有修改数组，只是返回一个新的数组

连接符join

arr
(6) [6, 5, 4, 3, 2, 1]
arr.join('-')
"6-5-4-3-2-1"

打印拼接数组，使用特定的字符串连接

多维数组

array=[[1,2],[3,4],["5","6"]];
array [1][1]
4

数组：存储数据（如何存，如何取，方法都可以实现）

3.3对象

若干个键值对，

var 对象名={
   
    属性名：属性值,
    属性名：属性值,
    属性名：属性值
}
    
var person={
   
           name:"kk",
           age: 3,
           email:"17664000187@163.com",
           score:0
        }