From 28a4e16fdd53c3f98125ef0d8bf4b87cffcf4fb5 Mon Sep 17 00:00:00 2001 From: Levi <5457109+linkpingit@user.noreply.gitee.com> Date: Thu, 29 Apr 2021 00:34:00 +0800 Subject: [PATCH] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E5=85=AB=E5=91=A8=E5=85=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...54\344\270\200\350\212\202\350\257\276.md" | 171 ++++++++++ ...54\344\270\211\350\212\202\350\257\276.md" | 304 ++++++++++++++++++ ...54\344\272\214\350\212\202\350\257\276.md" | 177 ++++++++++ 3 files changed, 652 insertions(+) create mode 100644 "\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\200\350\212\202\350\257\276.md" create mode 100644 "\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\211\350\212\202\350\257\276.md" create mode 100644 "\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\272\214\350\212\202\350\257\276.md" diff --git "a/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\200\350\212\202\350\257\276.md" "b/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\200\350\212\202\350\257\276.md" new file mode 100644 index 00000000..d511e752 --- /dev/null +++ "b/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\200\350\212\202\350\257\276.md" @@ -0,0 +1,171 @@ +# 第十八周-第一节课 + +## JavaScript简介 + +- 什么是JavaScript + + JS是一种脚本, 一门**动态**, **弱类型**编程语言. 基于在网页上实现复杂的功能产生的脚本语言. + + 虽然JS作为开发web页面的脚本语言而出名, 但是如今已被用到了很多非浏览器环境当中, 比如Node.js, Apache, Electron, Frida. + + > 动态语言意味着JS不需要提前声明变量的类型; + > + > 弱类型意味着JS可以隐式地转换类型; + +- JavaScript可以做什么? + + - 操作页面 + - 响应网页种发生的事件 + - 数据处理 + - 胶水语言, 连接各种语言环境 + +- Java和JavaScript有什么关系 + + 雷锋和雷峰塔的关系, 除了语法相似以外, 几乎没有任何关系. + +- JavaScript和JQuery有什么关系 + + JQuery其实是JS种的一个框架, 它封装了很多原生函数, 提供了更丰富的函数库. `Vue`和`React`等框架也是同样的道理, 只是在高度封装的过程中, 发展除了自己抽象内涵. + +## 运行环境 + +- 浏览器页面中 + + 在**浏览器内核**提供了JS引擎, 所以可以直接执行JS. + + JS也是有版本之分的, 语法互相有差异. 现在主流的标准是ES6(ECMAScript 6) + + - 主流浏览器的内核版本 + + ``` + chrome ------ blink + safari ------ webkit + FireFox ----- Gecko + chromium ---- V8 + ``` + +- 浏览器页面外 + + 本质就是封装了浏览器内核中的JS引擎, 达到浏览器外运行JS的目的 + + - Node.Js + - PyV8 + +## 环境搭建 + +- 安装Node.js + + ``` + https://nodejs.org/en/ + ``` + +- 安装IDE + + ``` + https://www.jetbrains.com/webstorm/ + ``` + +- 配置IDE + + ``` + File -> Settings -> Language&Frameworks -> Node.js and NPM + ``` + +## 声明变量 + +- 可变变量 + + 声明一个可变变量 + + ``` + var a = 1; + let b = 2; + ``` + + - let和var的区别 + + - var不会引起变量作用域的改变 + + ``` + a = 1; + + function foo(){ + console.log(a) + } + + foo() + + // var a; + let a; + ``` + + - let只在代码块区域中有效 + + ``` + function foo(){ + { + var a = 1; + let b = 2; + } + + console.log(a); + console.log(b) + } + + + foo() + ``` + +- 不可变变量/常量 + + ``` + const NAME = "tunan" + + NAME = "tunan2" + ``` + +## 函数 + +- 声明一个函数 + + - 关键字为function + + - 函数体在代码块中(`{}`) + + - 每一句语句结束以`;`结尾 + + ``` + // Math.random() 返回(0, 1) 之间的随机数 + // 实现一个伪随机函数 + + + function randInt(min_num, max_num){ + return parseInt(Math.random()* (max_num-min_num+1)) + min_num + } + ``` + + > 把Math.random() * max_num, 然后通过`parseInt`转为整数, 返回的是(0, max_num)之间的随机数 + > + > parseInt(Math.random()* max_num) + min_num, 返回的是(min_num, max_num + min_num)之间的随机数 + > + > parseInt(Math.random() * (max_num-min_num)) + min_num + > + > randint是闭区间, 所以我们最后再 + 1 + +- 声明一个匿名函数 + + ``` + (function (a){ + console.log(a) + }) + + // 声明并调用匿名函数 + (function (a){ + console.log(a) + })("tunan") + ``` + +## 课后作业 + +- 安装JS运行环境; +- 练习变量声明和函数声明; \ No newline at end of file diff --git "a/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\211\350\212\202\350\257\276.md" "b/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\211\350\212\202\350\257\276.md" new file mode 100644 index 00000000..d41b7f79 --- /dev/null +++ "b/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\270\211\350\212\202\350\257\276.md" @@ -0,0 +1,304 @@ +# 第十八周-第三节课 + +## 数据类型的CRUD操作 + +- 字符串 + + - Create + + - 声明一个字符串 + + ``` + let myString = "abcdefg" + + // 可以包含换行符等空白字符 + let myString = `abcdef + g` + ``` + + - 合并两个字符串并返回一个新的字符串 + + ``` + let myString2 = '1234567' + let myString3 = myString + myString2 + ``` + + - Retrieve + + - 获取当前字符串的长度 + + ``` + myString.length + ``` + + - 通过索引值获取单个字符 + + ``` + myString[index] + ``` + + - 通过索引值获取一段范围内的字符串 + + ``` + myString.slice(start, end) + ``` + + - 获取某个元素的索引值 + + ``` + myString.indexOf(value) + + // 如果不存在该元素, 则返回-1 + // 对-1进行位取反后得到的是0, 代表false + if (~myString.indexOf(value){ + .... + } + ``` + + - Update + + - 替换目标字符串 + + ``` + // 只会替换掉它最先找到的元素 + myString.replace(value_1, value_2) + + // 替换掉所有匹配的子字符串 + myString.replaceAll(value_1, value_2) + ``` + + - 大小写转换 + + ``` + // 转为大写 + myString.toUpperCase() + // 转为小写 + myString.toLowerCase() + ``` + + - Delete + + pass + + - 字符串格式化 + + ``` + `get myString => ${myString}` + ``` + +- 数组(Array) + + - Create + + - 复制一个数组 + + ``` + let myArray = [1, 2, 3, 4] + let myArray2 = myArray + console.log(myArray === myArray2) + myArray2 = Array.from(myArray) + console.log(myArray === myArray2) + ``` + + - 合并两个数组 + + ``` + > myArray + myArray2 + // 返回的是字符串拼接的结果 + < "1,2,3,41,2,3,4" + + // js中合并数组的方法, 返回一个新的数组 + let myArray3 = myArray.concat(myArray2) + ``` + + - Retrieve + + - 查看当前数组的大小 + + ``` + myArray.length + ``` + + - 通过索引值查询单个元素 + + ``` + myArray[index] + + // 超过索引范围不会报错, 返回undefined + myArray[10086] + ``` + + - 通过索引值获取一定范围内的元素 + + ``` + myArray.slice(1,3) + ``` + + - 通过元素获取索引值' + + ``` + myArray.indexOf(index) + ``` + + - Update + + - 通过索引去替换元素 + + ``` + myArray[0] ='a' + + // 超过索引范围, 会自动补全empty元素 + myArray[1008] = 'b' + ``` + + - 添加一个元素至末尾 + + ``` + myArray.push('c') + ``` + + - 向指定下标插入元素 + + ``` + // splice默认用来删除, 如果数量参数为0, 则为添加 + myArray.splice(起始索引, 数量, item) + + myArray.splice(1, 0, 'd') + ``` + + - Delete + + - 从末尾删除元素 + + ``` + myArray.pop() + ``` + + - 通过索引值删除元素 + + ``` + myArray.splice(5, 10082) + ``` + + - 排序 + + - 倒序 + + ``` + myArray.reverse() + ``` + + - 排序 + + ``` + // 数组排序是将元素转为string后进行排序 + myArray.sort() + [10086, 2, 3, 4, "a", "b", "d"] + + function compare(a, b){ + if(a < b){ + return -1 + } + if(a > b){ + return 1 + } + + return 0 + } + + myArray = [1, 10087, 2, 9, 4] + myArray.sort(compare) + console.log(myArray) + ``` + +- 对象(Object) + + - Create + + - 合并两个对象, 并返回一个新对象 + + ``` + let myObj = {"a":1, "b":2} + let myObj2 = {"c":3, "d": 4} + + Object.assign(myObj,myObj2) + ``` + + - Retrieve + + - 获取当前对象所有key + + ``` + Object.keys(myObj) + ``` + + - 获取当前对象所有value + + ``` + Object.values(myObj) + ``` + + - Update + + - 键对值复制 + + - Object.definePropery + + ``` + Object.defineProperty(navigator, 'webdriver', {value: true, writable:true}) + ``` + + - Delelte + + ``` + delete myObj.a + ``` + + - JSON转换 + + ``` + let jsonData = JSON.stringify(myObj) + JSON.parse(jsonData) + ``` + +## Date模块操作 + +- 获取当前时间 + + ``` + new Date() + ``` + +- 创建时间 + + ``` + // 传入的时间代表UTC时间 + new Date('2021-03-07T00:00:00.000Z') + ``` + +- 获取时间戳 + + ``` + // 单位是毫秒 + new Date().getTime() + ``` + +- 时间格式化 + + ``` + // 转变为符合ISO 8601 格式的字符串 + new Date().toISOString() + "2021-03-07T13:58:58.942Z" + + // JSON中传递时间对象时会转为ISO 8601 格式的字符串 + new Date().toJSON() + + # Python转换ISO 860 格式的字符串 + >>> now = "2021-03-07T14:00:44.105Z" + >>> datetime.strptime(now, '%Y-%m-%dT%H:%M:%S.%fZ') + ``` + +## 课后作业 + +- 练习数据类型的CRUD操作 +- 练习Date模块的操作 \ No newline at end of file diff --git "a/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\272\214\350\212\202\350\257\276.md" "b/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\272\214\350\212\202\350\257\276.md" new file mode 100644 index 00000000..fa922fb5 --- /dev/null +++ "b/\347\254\254\344\272\214\346\234\237\350\256\255\347\273\203\350\220\245/4\347\217\255/4\347\217\255_LiPing/\347\254\254\345\215\201\345\205\253\345\221\250/\347\254\254\345\215\201\345\205\253\345\221\250-\347\254\254\344\272\214\350\212\202\350\257\276.md" @@ -0,0 +1,177 @@ +# 第十八周-第二节课 + +> 这节点的难点并不是浮在js数据类型表面上, 而是需要大家在没玩转Python前提下, 将你们以为的编程世界观打碎重新定义. + +## 基本数据类型 + +- 6种原始类型 + + - undefined + + 所有变量的初始值为undefined + + ``` + typeof False + ``` + + - boolean(布尔值) + + ``` + typeof false + ``` + + - number(整数) + + ``` + typeof 1 + typeof 1.0 + ``` + + - String(字符串) + + ``` + type of "1" + ``` + + - BigInt + + ``` + let myBigInt = BigInt(1) + typeof 1n + ``` + + - Symbol(符号) + + 声明一个独一无二的值 + + ``` + let a = Symbol(1) + let b = Symbol(1) + + a === b + ``` + +- null + + 深入地讲, null是一个空指针, 而undefined是个表示"空"的值. + +- Object + + 一种像HashMap, 用键对值表示属性关系的数据类型. + + 键是字符串(或者是Symbol), 值可以是任意值 + + ``` + let myObj = {"test":1} + typeof myObj + ``` + +- Function + +## 基本数据结构 + +- 对象(Object) + + > JS的对象非要和Python做对比的话, 更接近于类, 而不是字典 + + - 声明一个对象 + + ``` + myObj = {undefined: 1, true:2, 1:3, '1':4, 1n:5} + myObj[Symbol(1)] = 6 + ``` + + - new 一个对象 + + 通过构造函数生成一个对象 + + ``` + function Dog(){ + this.color = "black" + } + + let dog = new Dog() + console.log(dog) + ``` + +- 数组 + + ``` + let myArray = [1, 2] + typeof myArray + ``` + +- Map + + 有序的HashMap + + ``` + let myMap = new Map() + myMap.set('1', 2) + myMap.set(1, 3) + ``` + + - Map和HashMap的区别 + - 对象其实更类似于类, 说到类就会想到继承, 可能会继承一些初始值. + - Map对象提供了一些HashMap操作的基本方法 + - Map对象的值可以是任意基本数据类型 + +- Set + + ``` + let mySet = new Set() + ``` + +## 命名规范 + +- 变量和函数使用小驼峰命名法 + + ``` + let myVar = 1 + function myFunc(){} + ``` + +- 常量使用大写 + + ``` + const MAX_NUM = 1000 + ``` + +- 类和构造函数使用大驼峰命名法 + + ``` + function Dog(){ + this.color = "black" + } + ``` + +- 私有属性使用`_`属性 + + ``` + function Dog(){ + this.color = "black"; + this._owner = "tunan" + } + ``` + +- 注释 + + - 单行注释 + + ``` + // test + ``` + + - 多行注释 + + ``` + /* + test + ... + */ + ``` + +## 课后作业 + +- 练习JS基本类型和数据结构的声明 +- 熟悉JS命名规范 \ No newline at end of file -- Gitee