Javascript基本语法速查

时间 2019-12-04

标签 javascript 基本语法速查栏目 JavaScript 繁體版

原文原文链接

你们好，我是言淦，我今天带来的文章是《Javascript基本语法速查》，但愿能给大家带来帮助！javascript

目录：html

1.变量

ES6规范以前， Js定义变量的方式只有一种，即var；在ES6规范到来后，Js定义变量的方式有三种，var， let和const。java

var：使用var声明变量有两个”bug“，第一是没有块级做用域；第二是循环内变量过分共享。
let：解决上述var声明的两个bug，能够说let是更完美的var。
const：定义常量数组

变量提高数据结构

函数及变量的声明都将被提高到函数的最顶部
变量能够在使用后声明，也就是变量能够先使用再声明

参考： www.jianshu.com/p/4e9cd99ec…ide

2.数据类型

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、空值（Null）、未定义（Undefined）、Symbol
引用类型：对象(Object)、数组(Array)、函数(Function)函数

2.1.Symbol

Symbol 是 ES6 引入了一种新的原始数据类型，表示独一无二的值。ui

2.2.值类型和引用类型区别

// 值类型（d的值不会跟着c变）
> c = 1
 1
> d = c
 1
> c = 2
 2
> d
 1

// 引用类型（l2的值会跟着l变）
> a = [1, 2, 3]
(3) [1, 2, 3]
> a2 = a
(3) [1, 2, 3]
> a[0] = 4
4
> a2
(3) [4, 2, 3]
复制代码

2.3.类型判断

typeof：返回的结果有number、boolean、symbol、string、object、undefined、function
instanceof：检测的只是原型。或者说instanceof只能用来判断两个对象是否属于实例关系，而不能判断一个对象实例具体属于哪一种类型。（不建议用）
constructor：用法和typeof差很少，可是不支持null和undefined，第二是注意prototype属性重写的问题
toString：用法和typeof差很少

参考： www.cnblogs.com/onepixel/p/…this

什么是原型?
3.1.原型是JavaScript为了继承设计出的一个概念idea

3.2.Js没有"子类"和"父类"的概念，也没有"类"（class）和"实例"（instance）的区分，全靠一种很奇特的"原型链"（prototype chain）模式，来实现继承。

3.3.”原型“能够理解为面对对象语言的”构造函数“

// Java写法
public class Dog{
    String name;
    int age;
    // 构造方法
    Dog(String name, int age){
        this.name = name;
        this.age = age;
    }
}
// Java new一个对象
Dog damao = new Dog("大毛", 1);

// JavaScript写法(是否是跟构造函数很像)
function Dog(name, age){
    this.name = name;
    this.age = age;
}
// JavaScript new一个对象
var damao = new Dog('大毛', 1);
复制代码

3.4.Js new出来的实例没法共享属性（每个实例都有本身的属性和方法的副本），没法作到数据共享，形成资源的极大浪费，因此设计者决定为构造函数设置prototype属性。

3.5.因为全部的实例对象(dogA, dogB)共享同一个prototype对象，那么从外界看起来，prototype对象就好像是实例对象的原型(父类，爸爸)，而实例对象则好像"继承"了prototype对象同样（Java 子类默认继承父类属性，除非本身重写）

参考： www.ruanyifeng.com/blog/2011/0…

2.4.判断整数和浮点数

Math.floor(obj) === obj // 推荐
Number.isInteger(obj) // 推荐，可是只在ES6中支持

2.5.判断对象是否相等

JSON.stringify()：有局限性，好比位置变化

2.6.判断是不是字符串数字

isNaN(value): 若是value是Number类型为False
!Number.isNaN(Number(value))：若是value是Number类型为true
正则

var reg = /^[\d|\.]*$/;
undefined
reg.test('aa')
false
reg.test('111')
true
复制代码

3.类型转换

3.1 Number转String： String方法

3.2 String转Number

// Number方法： 视图解析你给他的数字
b = Number("111")
111
b = Number("111.111")
111.111
b = Number("111.111aaa")
NaN
Number("023"); // returns 23
Number(023); // returns 19


// ParseInt, ParseFloat
parseInt("111.11aa")
111
parseInt("aa111")
NaN

parseFloat("aa111")
NaN
parseFloat("111.11aa")
111.11
复制代码

3.3 Object转String

String: 不行
JSON.stringify: 能够

3.4 String转Object

JSON.parse

3.5 Array转String

JSON.stringify

3.6 String转Array

JSON.parse

4.字符串操做

www.runoob.com/js/js-strin…

5.数据结构

Object：对象
Array：数组

判断元素是否存在

in关键字，适用Object和Array
hasOwnProperty方法： arr.hasOwnProperty(key); 或 obj.hasOwnProperty(key)

Object的增删查改

增长: object.property=value
删除： delete object.property
查找： in关键字或者 hasOwnProperty方法

Array的增删查改

增长： push（向数组末尾添加元素）， unshift（向数组开头添加元素）
删除： pop（删除数组的最后一项）， shift(删除数组的的第一项)
查找： slice， indexOf
增长+删除（修改）： arr.splice(index, howmany, item1,.....,itemX)
排序： sort（只能排序在10之内的数字）， reverse(把数组倒过来排序)

参考： www.cnblogs.com/supershare/…

单词计数

blog.csdn.net/u013778905/…

6.For循环的四种形式

juejin.im/entry/5a165…

7.深拷贝与浅拷贝

针对的对象：引用类型，如Object， Array。

Array

浅拷贝：直接赋值
深拷贝

// 1.slice
arr = [1, 2, 3]
arr2 = arr.slice(0)
arr[0] = 4
arr2 // 仍然为[1, 2, 3]

// 2.concat
arr = [1, 2, 3]
arr3 = arr.concat()
arr[0] = 5
arr3 // 仍然为[1, 2, 3]
复制代码

Object
- 浅拷贝：直接赋值 - 深拷贝：

// 1.new 一个对象，把旧对象的值赋予新对象
var a={name:'yy',age:26};
var b=new Object();

b.name=a.name;
b.age=a.age;

a.name='xx';
console.log(b);//Object { name="yy", age=26}
console.log(a);//Object { name="xx", age=26}

// 2.JSON方法
var a = {age:1,name:'ccy',info:{address:'wuhan',interest:'playCards'}};
var b = JSON.parse(JSON.stringify(a));

a.info.address = 'shenzhen';
console.log(a.info,b.info);

复制代码