JavaScript知识点小结

一、变量

1.js的命名规则

1. 变量

  命名方法：小驼峰式命名法。

  命名规范：前缀应当是名词。

2. 常量

  命名方法：名称全部大写。

  命名规范：使用大写字母和下划线来组合命名，下划线用以分割单词。

3. 函数

  命名方法：小驼峰式命名法。

  命名规范：前缀应当为动词。

4. 构造函数

  命名方法：大驼峰式。

  命名规范：前缀为名称。

5. 类的成员

  ① 公共属性和方法：小驼峰。

  ② 私有属性和方法：前缀为_(下划线)，后面小驼峰。

2.如何声明变量

var关键字：存在变量提升，可以重复声明

let关键字：不存在变量提升，不可以重复声明

const关键字：不存在变量提升，不可以重复声明，必须赋初值，值不允许修改

声明对象类型使用const，声明非对象类型使用let

二、数据类型

1.有几种数据类型

两种：引用数据类型和基础数据类型

引用数据类型：Array（数组）、Object（对象）、Function（函数）

基础数据类型：Number（数字）、String（字符串）、Boolean（布尔值）、Undefined（未定义）、Null（空）、Symbol（ES6新增，独一无二的值）

2.基础数据类型和引用数据类型的区别

存放区别：基础数据类型存放在栈中，引用数据类型存放在堆内存中，栈内存中存放的是指向堆内存的引用地址，通过地址可以快速查找到对象

比较区别：基础数据类型比较的是值是否相等，引用数据类型比较的是所指向的地址是否相等

赋值区别：基础数据类型是简单赋值，引用数据类型是对象引用

3.类型间的转换

强制类型转换：Number（）、parseInt（）、String（）、toString（）

隐式类型转换：一元运算符（+、-、++、--）、相等运算符（==）

三、数组

1.增、删、改、查

unshift（头部添加）、push（尾部添加）、concat（合并数组）、shift（头部删除）、pop（尾部删除）、splice（数组删除/替换，看具体用法）、indexOf（查找指定元素索引）

2.循环

forEach：

array.forEach(function(currentValue, index, arr), thisValue)//语法

 

let arr = [1,2,3,4,5]
 
arr.forEach(function(item,index,arr){
 
    arr[index] = item*2
 
})
 
console.log(arr) // [2,4,6,8,10]

特点：接收一个回调函数作为参数，没有返回值，不能使用break或return关键字进行跳出循环

map：

array.map(function(currentValue,index,arr), thisValue)//用法

let arr = [1,2,3,4,5]
 
let newArr = arr.map(function(item,index,arr){
 
return item*2
 
})
 
console.log(newArr) // [2,4,6,8,10]

特点：与forEach用法类似，区别在于forEach() 方法不会返回执行结果，而是undefined。  map会返回一个新数组  也就是说 forEach会修改原来的数组。而map()方法会得到一个新的数组并返回

filter（过滤）：

array.filter(function(currentValue,index,arr), thisValue)//用法

const arr = [{name:1},{name:2}]
			
let arr1 = arr.filter((item)=>item.name == 1)
console.log(arr1);

特点：不会对空数组进行检测，不会改变原始数组

3.排序

sort排序

var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b});
//1,5,10,25,40,100

冒泡排序

let len = arr.length - 1;
for(let i = 0; i < len;i++){
    for(let j = 0;j < len - i;j++){
        if(arr[j] > arr[j+1]){
            let num = arr[j];
            arr[j] = arr[j+1];
            arr[j+1] = num;
        }
    }
}
console.log(arr);

四、函数

1.定义

函数是一段被封装起来可被重复调用的代码块

2.调用

函数调用、对象方法调用、构造器调用、apply/call调用

3.传参

函数调用过程中存在的参数传递情况，将实参的值传递给形参（本质是赋值）

4.箭头函数（ES6）

更简洁的函数定义方法，多用于匿名函数，this指向声明时所在作用域下this的值

1，箭头函数使用箭头定义，普通函数没有。

2，普通函数可以有匿名函数，也可以有具体名函数，但箭头函数都是匿名函数。

3，箭头函数不能用于构造函数，不能用new，普通函数可以用构造函数以此创建对象。

4，箭头函数中this指向不同，在普通函数中，this总是指向调用它的对象，如果用作构造函数，this指向创建的对象实例。

5.闭包

闭包函数是位于另一个函数体中的函数，可以访问所在函数的所有局部变量、参数、当他们被调用时就形成了闭包

五、数字

parseInt        字符串转整数

parseFloat        字符串转浮点数

isNaN        判断是否能转换成数字

toFixed        返回保留指定位数、四舍五入后的数字

六、Date

Date对象作用于处理时间和日期，在创建Date对象时会自动的把当前时间和日期作为初始值存入。后面再使用Date对象里的方法进行操作。

new Date()获取当前时间时间戳

getFullYear()获取完整的年份

getMonth()获取月份（0-11）

getDate()获取当前日（1-31）

getHours()获取当前时

getMinutes()获取当前分

getSeconds()获取当前秒

指定时间时间戳

new Date(dateString)

new Date(year,month,date,hours,minutes,seconds)

getDay()获取一周中的某一天（0-6）

七、对象

1.增、删

增：对象.属性名 = 属性值

删：delete 对象.属性名

2.浅拷贝与深拷贝

浅拷贝：有两种方式，一种是把一个对象里面的所有的属性值和方法都复制给另一个对象，另一种是直接把一个对象赋给另一个对象，使得两个都指向同一个对象。

深拷贝：把一个对象的属性和方法一个个找出来，在另一个对象中开辟对应的空间，一个个存储到另一个对象中。

两者就在于，浅拷贝只是简单的复制，对对象里面的对象属性和数组属性只是复制了地址，并没有创建新的相同对象或者数组。而深拷贝是完完全全的复制一份，空间大小占用一样但是位置不同

八、布尔值

true、false

九、事件

常用事件：onclick、oninput、onchange

onclick鼠标单次点击时触发

oninput输入框内容发生变化时触发

onchange输入框内容发生变化，输入框失焦后触发

其他常见事件：

鼠标进入元素mouseenter

鼠标离开元素mouseleave

鼠标放到元素上mouseover

鼠标从元素上离开mouseout

按下鼠标mousedown

松开鼠标mouseup

按下按键keydown

松开按键keyup

按下并松开按键keypress

图片加载完成 onload

图片加载中断onabort

图片加载失败onerror

页面滚动onscroll

获得焦点onfocus

失去焦点onblur

十、字符串

1.比较、拼接、切割、转义

字符串之间可以通过比较运算符来进行比较

（注意：==会改变数据类型，如果是字符串之间的比较应使用===）

拼接：通过+来进行拼接或使用模板字符串（ES6）

切割：split（）

转义：\ 利用反斜杠来转义特殊字符

2.相关函数

split()切割

replace()替换

find()、indexOf()查找

trim()去除空白

toUpperCase()转大写 toLowerCase()转小写

十一、运算符

算术运算符（+、-、*、/）

赋值运算符（==、===）

一元运算符（正、负、++、--）

比较运算符（>、<、>=、<=）

逻辑运算符（&&、||）

十二、语句

1.if语句、for语句

if语句

//if-else基本格式
if (表达式){
    //语句１
}else{
    //语句２
}
//功能说明
//如果表达式的值为true则执行语句1,
//否则执行语句2

判断语句，可以单独使用，也可以进行嵌套

for语句

for(var i = 1; i < 100; i++){
    
    console.log("hello world!")
 
}

循环语句，for循环主要用于把某些代码循环若干次，通常跟技术有关

2.三元表达式

条件表达式 ? 表达式1 : 表达式2

如果条件表达式为真，则返回表达式1的值。如果条件表达式为假，则返回表达式2的值。

3.break，continue

break：终止当前循环

continue：跳过本次循环，执行下一次循环

十三、JSON

JSON指的是Javascript对象表示法，是轻量级的文本数据交换格式

JSON中可存放的数据类型：

number（数字）、string（字符串）、boolean（布尔值）、array（数组）、object（对象）、Null（空）

主要用途是用于在服务器和Web应用程序之间传输数据，是XML的替代方法

常用方法：

json.stringify()对象转字符串

json.parse()字符串转对象

十四、DOM

1.获取

document.getElementById(‘id’)                                 通过元素id来查找元素

document.getElementByTagName('name)               通过标签名来查找元素

document.getElementByClassName(‘class’)            通过类名来查找元素

document.getElementsByName('name')                   通过表单元素中name名查找元素

document.querySelector(‘CSS选择器’)                     通过CSS选择器获取匹配上的第一个元素

document.querySelectorAll('CSS选择器')                 通过CSS选择器获取匹配上的所有元素

2.修改

元素.innerHTML = 内容

元素.属性 = 属性值

元素.style.样式 = 样式值

元素.onclick = function(){}

input元素.value()

十五、BOM

1.屏幕尺寸

window.innerWidth获取宽度

window.innerHeight获取高度

2.跳转页面

window.open(‘url’)

window.location.href = ‘url’

在url后添加?可以进行传参，在其他页面通过

location.search来接收参数

3.定时器

setTimeout()        临时定时器

setInterval()        循环定时器

clearTimeout()        清除临时定时器

clearInterval()        清除循环定时器