JS进阶技术总结

day01

一,字符串API

语法调用:字符串.函数名()

所有字符串的API都不会修改字符串本身:字符串具有恒定性

1.分解字符串:字符串.split(分隔符)

2.截取字符串 字符串.slice(起始位置,结束位置)

3.查找字符串 字符串.indexOf(目标)

4.转字母大小写 字符串.toUpperCase()||toLowerCase()

二.字符串API应用 ,综合案例

三.数组字符串-不改变数组本身

1.将数组变成字符串:数组.join('分隔符')

2.合并数组 :数组.concat(第二个数组[,....])

3.数组遍历:数组.forEach(回调函数:至少带1个参数)

注:

不是所有的伪数组都可以使用: 伪数组本身就不可以用forEach伪数组:长得像数组,也可以用下标,也可以for循环,但是不能调用数组的API,querySelectorAll()得到的伪数组可以使用forEach(NodeList对象本身有forEach)

如果遍历前几个元素,forEach怎么遍历,forEach不能控制条件:必须回遍历全部

4.数组过滤:数组.filter(function(元素,下标){ return 元素的条件})

5. 数组加工:数组.map(function(元素,下标){ return 元素加工后的结果})

6. 基于条件寻找数组中满足条件的第一个(元素):数组.find(function(元素,下标){ return 条件匹配}

四.数组字符串-改变数组本身

排序数组:数组.sort()

数组.sort(function(a,b){ return a - b || b - a})

day02

01常量 const

1.语法:const 名字=值

2.常量不能像变量一样分两步操作:先声明,后赋值

2.1

02函数默认值

// 总结:参数一旦有了默认值:调用的时候如果不传,那么默认值生效;如果传了,实参生效,默认值不生效// 在定义函数的时候:给形参赋值,这个值就叫做默认值

03对象简写

// 对象简写:当变量的名字本身就应该当做属性名的时候,那么对象可以直接放一个变量,而不用给属性名:系统会自动将变量的名字当成属性名,变量的值当成属性值 // 要求:定义变量的时候,要做到见名知意,变量名本身翻译就是对应的数据业务        // 使用较多的场景: 表单数据提交

04解构

简单方式:解构(解除解构:把复杂的东西简单化)

数组解构:按顺序获取元素(与变量名字无关)

语法:let [变量1, 变量2...] = 数组

对象解构:按属性名获取数据

语法:let { 属性名1, 属性名2...} = 对象

对象解构才重要:数组不会用解构

数组解构有妙用:面试题的答案

要求:交换两个变量的值,不允许使用第三方变量

05剩余运算

// 总结剩余:接收多个数据,一般用于形参:...形参变量拓展:展开一个数据变成多个,一般用于实参(数组):...数组实参

局限一点: ...无外乎做两件事件:将多个数据变成数组,要么将数组变成多个数据

剩余运算也叫拓展运算,语法:在变量前面放三个点:...变量名

剩余运算:将多余的数据放到一个变量中,一般用于形参接收数据

拓展运算:将一个变量打散变成多个数据,一般用于数组变成多个数06据

06箭头函数

// 箭头函数:不是新内容,只是原来函数的简写方式/ 箭头函数:() => {}        // (param1) => { statements }        // 箭头函数:用于回调函数,默认箭头函数是没有名字的

// 箭头函数还可以更简单

1.如果形参只有1个:可以省略()

2.如果函数体只有1行:可以省略{}

2.1 如果只有一行代码,而且没有{},自带了一个return如果你的箭头函数里面有return关键字,必有{}

07this与函数的调用关系

this与函数调用关系:谁调用,this指向谁

1.函数调用模式:所有的函数调用,如果前面没有对象:此时都是window在调用:this一定指向window对象

2.方法调用模式:函数放到对象内部,是属性值

3.构造函数模式:new 构造函数()产生孩子对象(暂时不做要求)

// 不管是DOM0(on事件)还是DOM2(add事件),事件回调函数的内部的this都是指向事件源

    // 箭头函数除外:本身没有this,输出的是window

08借调模式

1.call借调:目标函数.call(新对象),借一次

新对象:修改目标函数里面的this,修改函数的归属权

2.他三种借调

  // 总结        // 1. 借调是好东西,但是不会没有关系(不影响开发 ,影响效率)        // 2. 长期学习的过程:需要掌握系统的API的源代码(自己也能定义函数实现)        // 3. 借调有三种方式:call \ apply \ bind        // call和apply是一样的:一次性借调,传参有点区别        // bind:永久性借调,传参与call一样

day03

01.创建对象的几种方式

1.字面量

2.构造函数:Object

3.设计模式

02.构造函数

总结

构造函数:分类事务,产生对象

构造函数语法特点:大驼峰,里面使用this给属性赋值,不要return,new,调用函数

构造函数里面如何给对象挂载函数:this.属性名 = function(){},缺点是产生的对象都会有自己独立的内存:函数会重复占用内存

03方法内存重复问题解决

04原型对象

// 是函数:都有原型对象,函数名.prototype// 原型对象中:默认有1个属性(自定义构造函数):constructor指向构造函数本身// 定义身份        // 构造函数:男的,男的找老婆:自己.prototype        // prototype:女的,女的找老公:自己.constructor

实际开发中:构造函数产生的对象(new出来的)不认爸爸,只认妈妈,不管多少个孩子:都指向同一个妈妈

// 到此为止:原型对象中挂载方法,既解决了内存占用问题(一份),又解决了安全问题(对象内部方法,不会被外面污染)

   // 以后创建构造函数的时候:不要给this赋值方法,应该将方法放到原型对象中存储

   // 1. 创建构造函数:给this增加基本属性(数据)

   // 2. 给原型对象:构造函数.prototype挂载方法

   // 3. 实例化对象:产生孩子,孩子可以直接访问原型对象中的任何内容

05原型挂载的应用

06原型链

07原型链继承

// 1. 修改子构造函数的原型对象的上级:不要指向Object.prototype,应该指向目标(父)构造函数的原型:Person.prototype// 此时:原型完成了上下级关系:继承关系 // 但是:构造函数本身还是兄弟关系:都是Function的孩子 // Person.proto还是Student.proto都是Function.prototype// 2. 为了完善父子级别关系:不单单修改原型的继承,还要让构造函数也产生继承(父子关系)

day04

01闭包

1.广义闭包/侠义闭包

总结        通常所说的程序闭包:狭义闭包,内部函数用到了外部函数的局部变量        作用:变量变局部,数据是安全的        细节:函数内部可以定义函数,不要用有名函数,使用函数表达式(匿名函数),最后应该返回该内部函数

闭包缺点

闭包面试题

  // 面试题:你知道闭包吗? || 你给我解释一下闭包? || 什么是闭包?

   // 0. 闭包有广义和狭义之分,广义的是函数内部用到了外部变量;一般讲是狭义闭包:内部函数用到了外部函数的局部变量

   // 1. 一般用闭包是为了解决数据安全的问题:全局变量容易被污染,局部无法操作,外部函数返回内部函数实现闭包:外部函数负责提供数据,内部负责逻辑处理

   // 2. 但是闭包也有缺点:会占用内存,原因是内部函数占用了外部函数的变量,而内部函数又被返回给外部变量,导致产生占用链条,垃圾回收机制无法回收

   // 3. 闭包要释放:只要解决源头:占用内部函数的变量释放掉即可。一般情况下,不会释放,很有可能返回的函数外部需要多次调用

分析代码执行顺序

1.函数定义:不会自己运行,必须名字+()调用才会执行

2.事件会自动执行:触发执行,执行事件函数

3.回调函数如何执行?主函数内部调用,一般都是数组:主函数内边遍历数组(看不到),有多少个元素,就调用多少次回调函数

4.定时器什么时候执行? 等主代码执行结束后,按照间隔时间:无限的重复的执行

5.变量的作用域问题:局部变量,函数调用一次,每个函数都会产生新的变量;如果变量在上级作用域:只有1个变量

02递归

// 广义递归:递归recursive,指的是一种算法。当一个大问题存在的时候,往往里面有很多相似的小问题(性质相同,规模较小)。解决方案,先解决小问题(最小问题:最优子结构),利用这种解决小问题的方式,逐步放大,最终解决所有问题

   // 狭义递归:函数内部调用自己

   // function go(){

   //     go()

   // }

   // go()

   // 递归:利用空间换时间

   // 同时让N个相同的函数执行,内存会不断的被占用

   // 狭义递归解决问题的方式

   // 1. 必须是函数:函数内部调用自己

   // 2. 先解决大问题,然后通过规模变小后,再调用自己去解决小问题

   // 递归两个要素

   // 1. 递归点:在函数解决问题的过程中,发现小问题(规模变小,性质一样),调用自己(参数规模减小:递归一定有参数)

   // 2. 递归出口:函数一定要能够不再调用自己

   // 2.1 显示出口:发现不应该调用函数自己,立马结束:return

   // 2.2 隐式出口:函数自动运行结束,没有发现递归点

// 递归方式实现

       // 1. 建议一个函数:需要一个形参(数据规模)

       // 2. 找到最外层的解决方案:用代码实现

       // 3. 寻找递归点:规模变小,性质一样的位置:对象.chilren与外部的data是一样的:调用函数自己(实参要规模变小)

       // 4. 寻找递归出口:什么时候函数不会继续调用自己


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

推荐阅读更多精彩内容

  • 闭包 变量作用域 变量根据作用域不同可以将函数分为全局变量和局部变量 函数内部可以使用全局变量 函数外部不可以使用...
    alfalfaw阅读 206评论 0 0
  • 数组创建 javascript中创建数组的方式有两种: 第一种是 使用Array构造函数: 第二种是 使用数组字面...
    那年点夏阅读 727评论 4 3
  • 数组Array 字符串String 集合Set 字典Map
    林思念阅读 351评论 1 0
  • JavaScript 1 初识JavaScript 1.1 JavaScript 是什么 JavaScript 是...
    SY阅读 235评论 0 2
  • 今天总结了一下之前所学到的js中数组的方法,分别从参数,返回值,是否改变原数组等方面介绍了数组方法,方法如下: 1...
    肉团儿啊阅读 1,285评论 1 3