JavaScript、Es6--基础总结

一、基础概念
1.原始类型:boolean、null、undefined、number、string、symbol
2.字面量:一般固定值称为字面量,如 3.14。

  • 数字(Number)字面量有整数字面量,浮点数字面量,Infinity,NaN
  • 字符串(String)字面量 可以使用单引号或双引号
  • 表达式字面量
  • 数组(Array)字面量
  • 对象(Object)字面量
  • 函数(Function)字面量

3.JavaScript 语句标识符

语句 描述
break 用于跳出循环。
catch 语句块,在 try 语句块执行出错时执行 catch 语句块。
continue 跳过循环中的一个迭代。
do ... while 执行一个语句块,在条件语句为 true 时继续执行该语句块。
for 在条件语句为 true 时,可以将代码块执行指定的次数。
for ... in 用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。
function 定义一个函数
if ... else 用于基于不同的条件来执行不同的动作。
return 退出函数
switch 用于基于不同的条件来执行不同的动作。
throw 抛出(生成)错误 。
try 实现错误处理,与 catch 一同使用。
var 声明一个变量。
while 当条件语句为 true 时,执行语句块。

4.变量提升:函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。也就是说,变量可以先使用后声明。

注意:JavaScript 只有声明的变量会提升,初始化的不会。

5.闭包:闭包是一种保护私有变量的机制,在函数执行时形成私有的作用域,保护里面的私有变量不受外界干扰。直观的说就是形成一个不销毁的栈环境。
通俗的讲,在函数A里,声明了变量a,函数A内嵌了一个函数B,函数B访问了变量a,最后返回函数B,函数B就是一个闭包。
示例1:

function A(){
       var a="hello world"
        function B(){
            console.log(a);
        }
        return B;
}
var c = A();
c();//hello world

闭包有3个特性:
①函数嵌套函数
②函数内部可以引用函数外部的参数和变量
③参数和变量不会被垃圾回收机制回收

示例2:

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();
 
add();
add();
add();
 
// 计数器为 3

6.深浅拷贝:
示例:

let a={name:'hello'}
let b=a
a.name="world"
console.log(b.name) // world

上述例子中,将a拷贝到b其实是拷贝了地址,一旦对象a的name属性发生改变,对象b的name属性也会改变,为了解决以上问题,引出了浅拷贝和深拷贝。
如何实现深浅拷贝

  • 浅拷贝:
    Object.assign({}, a)
    展开运算符...
  • 深拷贝:
    JSON.parse(JSON.stringify(obj))

7.立即执行函数
见闭包的示例2代码。
二、常用的方法使用示例
1.indexOf :返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现,则该方法返回 -1。
stringObject.indexOf(searchvalue,fromindex)
2.lastIndexOf:返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。如果要检索的字符串值没有出现,则该方法返回 -1。
stringObject.lastIndexOf(searchvalue,fromindex)
3.splice:从数组中添加/删除项目,然后返回被删除的项目。
arrayObject.splice(index,howmany,item1,.....,itemX)。
示例:

<!doctype html>
<html> 
<body> 
<script >
    let arr1 = [1,2,3,4]
    let arr2 = [1,2,3,4]
    arr1.splice(2,0,"88")
    document.write(arr1 + "<br />")
    arr2.splice(2,1,"88")
    document.write(arr2 + "<br />")
</script>
</body> 
</html> 

输出结果:

1,2,88,3,4
1,2,88,4

4.slice:从已有的数组中返回选定的元素。该方法并不会修改数组,而是返回一个子数组。
arrayObject.slice(start,end)

5.split:用于把一个字符串分割成字符串数组。
stringObject.split(separator,howmany)
示例:

<script >
var str="1,2,3,4,5"
document.write(str.split(",") + "<br />")
document.write(str.split(",",3))
</script>

输出结果:

1,2,3,4,5
1,2,3

6.replace:用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
stringObject.replace(regexp/substr,replacement)
示例:

<script >
var str="hello world!hello,123"
document.write(str.replace(/hello/g, "你好"))
</script>

输出结果:

你好 world!你好,123

More
7.substr:在字符串中抽取从 start 下标开始的指定数目的字符。
stringObject.substr(start,length)
8.substring:用于提取字符串中介于两个指定下标之间的字符。
stringObject.substring(start,stop)
注意:与 slice() 和 substr() 方法不同的是,substring() 不接受负的参数
9.toLocaleLowerCase();toLowerCase()转小写
10.toLocaleUpperCase();toUpperCase()转大写
11.trim:用于删除字符串的头尾空格。
string.trim()

12.map、filter、reduce

  • map:生成一个新数组,遍历原数组,将每个元素拿出来做一些变换然后放入到新的数组中。另外 map 的回调函数接受三个参数,分别是当前索引元素,索引,原数组
[1, 2, 3].map(v => v + 1) // -> [2, 3, 4]
  • filter:生成一个新数组,在遍历数组的时候将返回值为 true 的元素放入新数组,我们可以利用这个函数删除一些不需要的元素。
let array = [1, 2, 4, 6]
let newArray = array.filter(item => item !== 6)
console.log(newArray) // [1, 2, 4]
  • reduce:可以将数组中的元素通过回调函数最终转换为一个值。它接受两个参数,分别是回调函数和初始值。
const arr = [1, 2, 3]
const sum = arr.reduce((acc, current) => acc + current, 0)
console.log(sum)

13.reverse:reverse() 方法用于颠倒数组中元素的顺序
arrayObject.reverse()

14、every、some、join

  • every:用于检测数组所有元素是否都符合指定条件。
    every() 方法使用指定函数检测数组中的所有元素:
    如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
    如果所有元素都满足条件,则返回 true。
    语法:array.every(function(currentValue,index,arr), thisValue)
var ages = [32, 33, 12, 40];
function checkAge(age) {
    return age >= 18;
}
function myFunction() {
   ages.every(checkAge);
}
  • some:测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。
    Array.some()
const array = [1, 2, 3, 4, 5];
const even = (element) => element%2===0;
console.log(array.some(even));
//true
  • join:用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。
    arrayObject.join(separator)
<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr.join())
</script>
//George,John,Thomas

15.Math

  • Math.floor() 返回小于或等于一个给定数字的最大整数
Math.floor( 45.95); // 45 
  • Math.round()把一个数字舍入为最接近的整数
<script type="text/javascript">
document.write(Math.round(0.60) + "<br />")
document.write(Math.round(0.50) + "<br />")
document.write(Math.round(0.49) + "<br />")
document.write(Math.round(-4.40) + "<br />")
document.write(Math.round(-4.60))
</script>
//output
1
1
0
-4
-5

16.正则表达式:使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。

三、其他
1.==和===的区别
== ,如果对比的数据类型不相同,先进行类型转换,再进行比较;
===,判断两者类型和值是否相同。
2.在条件判断时,除了 undefined, null, false, NaN, ' ', 0, -0,其他所有值都转为 true。
类型转换
3.理解this
JavaScript this 关键字
JavaScript中this详解

参考网址:

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,185评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,445评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,684评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,564评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,681评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,874评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,025评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,761评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,217评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,545评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,694评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,351评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,988评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,778评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,007评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,427评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,580评论 2 349