Merge branch 'master' of http://git.luyuan.tk/luyuan/webveuje

javascriptpress/2.javascript基础.md

@@ -261,16 +261,23 @@ people("啦啦啦", 18)
 
 ### 实现上面的题目
 
+```javascript
+var num = 100;
+var shop = 80;
+function buy(num,shop){
+	if(num - shop < 0 ){
+		alert("买不起")
+	}else{
+		var shengyu = num - buy
+		alert("可以购买，剩余" + shengyu)
+	}
+}
+buy(num,shop)
+```
 
-
+## 作业
-
+- 创建一个对象 用alert 弹出它的所有属性
-
+- 创建一个数组 用alert弹出他所有的元素
-#### 循环语句
+- 创建一个function 传入两个参数 弹出这两个参数相乘的结果
-- for
+- 创建一个function 传入两个数 弹出最大的那个数
-- while 
-- do while
-
-#### for
-
-
 

javascriptpress/3.javascript基础.md

@@ -0,0 +1,98 @@
+# 数据类型转换
+
+## 显式类型转换
+
+什么叫显示类型转换？ 就是手动用代码转换的时候叫显示 先看一下如何转换
+```javascript
+var num = 8;
+alert(typeof num);
+num = String(num);
+alert(typeof num);
+```
+创建的时候是number 使用String 转换之后就成了字符串 这就是显示转换
+
+那么转化有哪几个呢？
+- Strung
+- Number
+- Boolean
+
+这三个 用法跟上面一样
+### number
+转换number的时候注意点
+- 只有是数字开头的才会被转换 不是则是nan
+- 多个小数点之后会是nan
+
+```javascript
+alert(Number("123abc")) // 123
+alert(Number("000112")) // 112
+alert(Number("1.2")) // 1.2
+alert(Number("1.2.3")) // NaN
+alert(Number("baa1212")) // NaN
+alert(Number("")) // 0
+```
+
+#### nan
+nan 代表不是数字 nan 
+
+### string
+转化为字符串注意点
+- obgect类型会转化为 "[Object obgect]"
+
+例如
+```javascript
+alert(String(1233)) // 1233
+alert(String({})) // [Object obgect]
+alert(String([1,2,3])) // 1,2,3
+function p(){alert(123)}
+alert(String(p)) //function p(){alert(123)}
+```
+
+### Boolean
+转换为Boolean 类型 非0 的数字和非空的字符串都是true 空对象和空数组都是true
+
+
+例如
+```javascript
+alert(Boolena("")) // false
+alert(Boolena("0")) // true
+alert(Boolena("123")) // true
+alert(Boolena([])) // true
+alert(Boolena({})) // true
+alert(Boolena(0)) // false
+alert(Boolena(1)) // true
+alert(Boolena(2)) // true
+```
+
+## 隐式类型转换
+### + 
+两个东西相加的时候 
+如果一侧为string 类型 将另一侧转化为string 进行拼接
+如果一侧为对象数组或函数 也会转化成字符串进行拼接
+如果除了上面的类型之外的相加 都会转化为数字进行相加 (boolena)
+- 1 + "1" = "11"
+- "1" + 1 = "11"
+- "1" + [1,2] = 212
+- [1,2] + [1,2] = 1,21,2
+
+
+### - * /
+将所有的都转化为数字 进行数学运算
+
+剩余的[查看这个页面](https://chinese.freecodecamp.org/news/javascript-implicit-type-conversion/#1--1)
+
+## ==
+判断两个变量或者值是否是相等的
+```javascript
+if(1 == 1){
+alert("相等")
+
+}
+```
+
+在程序中都是用== 作为相等 因为一个 = 是赋值 所以判断的时候得用 两个 = 
+
+作业
+
+- 将 "123" 转化为number类型
+- "123" == 123 会将两边转化为什么类型
+- undefined == NaN 是true 还是false

javascriptpress/4.javascript基础.md

@@ -0,0 +1,60 @@
+# javascript基础
+## 基础类型与引用类型
+类型之前是有区别的 什么叫基础类型 什么叫引用类型呢？
+
+## 基础类型
+- string
+- number
+- boolean
+- null
+- undefined
+
+基础类型在传递值的时候会复制自己
+```javascript
+var name = "啦啦啦";
+var name1 = name;
+name1 = "喵喵喵";
+alert(name);
+alert(name1);
+```
+## 引用类型
+- array 
+- obgect
+- function
+```javascript
+var obg = {name:"啦啦啦"}
+var bog1 = obg
+obg1.name = "喵喵喵"
+alert(obg.name)
+alert(obg1.name)
+```
+
+## 栈堆
+
+
+
+![wechatimg104](4.javascript基础.assets/163f6b03478ae38a)
+
+所有的变量都是在栈里面 但是如果创建引用类型的时候会在堆创建 然后只赋值对象地址给栈里面的变量
+
+这个得详细讲一下 
+
+
+
+当创建变量的时候 会在栈创建一个位置 对应变量名 值为undefined
+
+赋值的时候 会赋值栈里面的值
+
+创建对象的时候 会在堆里面创建一个空间 存储对象 赋值的时候赋的是堆里面的内存地址 就是在堆里面的名字
+
+根据以上的规则 当将一个指向对象的变量赋值给另一个变量的时候 因为只会赋值栈里面的值 所以赋值的是内存地址
+
+修改的时候修改的是同一个内存的对象 所以就会出现修改一个另一个也会同时改变的
+
+
+
+
+
+作业
+- 为什么对象是引用的
+- 引用类型与基础类型有什么区别

javascriptpress/5.javascript基础.md

@@ -0,0 +1,168 @@
+# javascript基础
+
+## 循环语句
+
+之前只是说了条件语句 如果说有重复工作的时候就得写好多遍 比如之前要得用alaert() 弹出数组所有的成员 在循环里面可以很简单的实现
+
+javascript 中有多少循环呢？
+
+- for
+- while
+- do while
+
+## for
+
+for是如何使用的呢 还是用一个例子 比如我定义一个数组 然后弹出所有的成员
+
+```javascript
+
+var list = ["苹果","香蕉","橘子"]
+for(var i = 0;i < list.length; i++){
+    alert(i);
+    alert(list[i])
+}
+```
+
+上面的list.lenght是什么呢？ length是 数组的一个属性 代表这有多少成员数 比如 
+
+```javascript
+var list = [1,2,3]
+alert(list.length) // 出现的是3 
+```
+
+他有多少成员就会弹出几个数字 但是这个不是从0 开始的 出现几就是有一个 0就是有0个 1 就是有1 个 并不是0 代表有一个
+
+++ 变量自增 举个例子
+
+```javascript
+var num = 1;
+num++;
+alert(num); // 2
+
+
+// 类似于
+var i = 1;
+i = i + 1;
+alert(i)
+```
+
+就是当前值加上1 的简写 除了++ 还有-- 只是自己减去1 在循环中很常用到 因为大部分都是每次循环将循环变量加上1
+
+
+
+下面看下循环
+
+
+![Javascript for循环_郭隆邦技术博客](5.javascript基础.assets/ZLrR6mFfILH-ZhmDC_KrG7BrIZMwSK7lkKvr8AV9i9vDcgR-94kJJVkimy-hRU9EPJX8W10f2tQplulr5rdrWxpVs57IgxWUBshMbTxq)
+
+上面的流程图是整个for循环执行的过程 下面将详细解释一下
+
+```javascaript
+fro(语句1 ； 语句2 ；语句3){
+	循环体
+}
+```
+
+当代码走到for的时候 先执行语句1 就是第一个分号前的那个 这个在循环中只执行一次 一般用于初始化循环变量
+
+然后走语句二 语句二是一个条件 当这个条件为true 的时候 就执行循环体 如果false 就结束循环 执行循环后面的语句
+
+如果语句二是true 那么将执行循环体 就是for后面{}里面的内容
+
+执行完循环体的内容之后就会执行语句三  执行完之后再执行语句二 然后又是开始从语句二执行 然后再进行判断 .....
+
+这样就一直循环下去
+
+
+
+#### *= 
+
+图片中还有一个 *=是什么 ?
+
+```javascript
+var num = 5;
+num *= 5;
+alert(num); // 25
+
+// 等同于
+var num = 5;
+num = num * 5;
+alert(num) // 25
+```
+
+除了*= 还有+=，-=，/=  这三个 功能是类似的
+
+## while
+
+while循环跟for循环类似 但是只有一个条件 
+
+```javascript
+var i = 0;
+while(i < 10){
+	alert(i);
+    i++
+};
+
+```
+
+![JavaScript while Loop By Examples](5.javascript基础.assets/JavaScript-while-loop.png)
+
+1. 开始的时候进入循环 判断条件
+2. 如果条件成立进入循环体 不成立结束
+3. 循环体结束判断条件 执行第2步
+
+相对于for少了两个 一个是初始化变量 一个是结束后执行的语句 
+
+上面的例子中 
+
+```javascript
+var i = 0; // 这个就是初始化语句
+while(i < 10){ // i<10 就是条件
+    i++ // 这个可以理解为for循环最后一个语句
+}
+```
+
+只是把这两个拆分出来了 有时候我们不需要初始化变量 或者循环后不需要执行什么语句 那时候就可以选择while
+
+
+
+## do-while
+
+相对于while有一些区别
+
+```javascript
+var i = 10;
+do{
+    alert("现在i是" + i)
+}while(i<9)
+```
+
+i是10 的时候 while 的条件写的是 i<9 但是第一遍还是成立了
+
+![JavaScript do-while Loop with Practical Usages](5.javascript基础.assets/JavaScript-do-while-loop.png)
+
+do-while 循环 会先执行循环体 然后再判断条件 第一次执行的时候不管条件 直接执行 循环体里面的语句 然后执行完毕之后再进行判断条件 条件是成立的 再次回到循环体开头 不成立 循环结束
+
+## break
+
+当有一次循环不想让他走的时候 就可以用break
+
+比如要从1 打印到 10 要循环10次 但是我想在第4次的时候结束循环
+
+```javascript
+for(var i = 1; i < 11; i++){
+    if(i == 4){
+        break;
+    }
+    alert(i)
+}
+```
+
+
+
+## 作业
+
+- 计算 从1 到100 的总和 (累加)
+- 创建一个数组 弹出数组的所有元素
+- 计算 1- 100中所有的偶数的和
+

javascrit info/目录.md

@@ -0,0 +1,110 @@
+# 需要学习的列表
+
+- https://zh.javascript.info/hello-world
+- https://zh.javascript.info/structure
+- https://zh.javascript.info/variables
+- https://zh.javascript.info/types
+- https://zh.javascript.info/alert-prompt-confirm
+- https://zh.javascript.info/type-conversions
+- https://zh.javascript.info/operators
+- https://zh.javascript.info/comparison
+- https://zh.javascript.info/ifelse
+- https://zh.javascript.info/logical-operators
+- https://zh.javascript.info/nullish-coalescing-operator
+- https://zh.javascript.info/while-for
+- https://zh.javascript.info/switch
+- https://zh.javascript.info/function-basics
+- https://zh.javascript.info/function-expressions
+- https://zh.javascript.info/arrow-functions-basics
+- https://zh.javascript.info/javascript-specials
+- https://zh.javascript.info/comments
+- https://zh.javascript.info/object
+- https://zh.javascript.info/object-copy
+- https://zh.javascript.info/object-methods
+- https://zh.javascript.info/constructor-new
+- https://zh.javascript.info/optional-chaining
+- https://zh.javascript.info/primitives-methods
+- https://zh.javascript.info/number
+- https://zh.javascript.info/string
+- https://zh.javascript.info/array
+- https://zh.javascript.info/array-methods
+- https://zh.javascript.info/destructuring-assignment
+- https://zh.javascript.info/date
+- https://zh.javascript.info/json
+- https://zh.javascript.info/recursion
+- https://zh.javascript.info/closure
+- https://zh.javascript.info/var
+- https://zh.javascript.info/global-object
+- https://zh.javascript.info/function-object
+- https://zh.javascript.info/new-function
+- https://zh.javascript.info/settimeout-setinterval
+- https://zh.javascript.info/call-apply-decorators
+- https://zh.javascript.info/bind
+- https://zh.javascript.info/arrow-functions
+- https://zh.javascript.info/prototype-inheritance
+- https://zh.javascript.info/function-prototype
+- https://zh.javascript.info/native-prototypes
+- https://zh.javascript.info/prototype-methods
+- https://zh.javascript.info/try-catch
+- https://zh.javascript.info/callbacks
+- https://zh.javascript.info/promise-basics
+- https://zh.javascript.info/promise-chaining
+- https://zh.javascript.info/promise-error-handling
+- https://zh.javascript.info/promise-api
+- https://zh.javascript.info/async-await
+- https://zh.javascript.info/eval
+
+## 下面是浏览器的了 dom 事件
+
+- https://zh.javascript.info/browser-environment
+- https://zh.javascript.info/dom-nodes
+- https://zh.javascript.info/dom-navigation
+- https://zh.javascript.info/searching-elements-dom
+- https://zh.javascript.info/basic-dom-node-properties
+- https://zh.javascript.info/dom-attributes-and-properties
+- https://zh.javascript.info/modifying-document
+- https://zh.javascript.info/styles-and-classes
+- https://zh.javascript.info/size-and-scroll
+- https://zh.javascript.info/size-and-scroll-window
+- https://zh.javascript.info/coordinates
+- https://zh.javascript.info/introduction-browser-events
+- https://zh.javascript.info/bubbling-and-capturing
+- https://zh.javascript.info/event-delegation
+- https://zh.javascript.info/default-browser-action
+- https://zh.javascript.info/mouse-events-basics
+- https://zh.javascript.info/mousemove-mouseover-mouseout-mouseenter-mouseleave
+- https://zh.javascript.info/mouse-drag-and-drop
+- https://zh.javascript.info/keyboard-events
+- https://zh.javascript.info/onscroll // 可能暂时不需要
+- https://zh.javascript.info/form-elements
+- https://zh.javascript.info/focus-blur
+- https://zh.javascript.info/events-change-input
+- https://zh.javascript.info/forms-submit
+- https://zh.javascript.info/onload-ondomcontentloaded
+- https://zh.javascript.info/script-async-defer
+- https://zh.javascript.info/onload-onerror
+
+## fetch 这个并不常见 了解一下 
+
+- https://zh.javascript.info/fetch
+- https://zh.javascript.info/formdata
+- https://zh.javascript.info/fetch-progress
+- https://zh.javascript.info/fetch-abort
+- https://zh.javascript.info/fetch-crossorigin
+- https://zh.javascript.info/fetch-api
+- https://zh.javascript.info/url
+
+## XMLHttpRequest
+
+- https://zh.javascript.info/xmlhttprequest
+
+## webscoket
+
+- https://zh.javascript.info/websocket
+
+## 存储
+
+- https://zh.javascript.info/cookie
+- https://zh.javascript.info/localstorage
+- https://zh.javascript.info/indexeddb // 了解
+

javascrit info/重点.md

@@ -0,0 +1,21 @@
+# 重点
+
+- 作用域 
+- this
+- 原型 原型链
+- promise
+- async await
+- doucument
+- 事件冒泡
+- 事件委托
+- 箭头函数
+- LocalStorage
+- JSON
+- 网络请求 
+
+# 难点
+
+- 继承
+- 闭包
+- 预编译
+