初始化
This commit is contained in:
asd
5
.idea/.gitignore
generated
vendored
Normal file
5
.idea/.gitignore
generated
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
8
.idea/modules.xml
generated
Normal file
8
.idea/modules.xml
generated
Normal file
@@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/zuoye.iml" filepath="$PROJECT_DIR$/.idea/zuoye.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
6
.idea/vcs.xml
generated
Normal file
6
.idea/vcs.xml
generated
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="$PROJECT_DIR$" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
12
.idea/zuoye.iml
generated
Normal file
12
.idea/zuoye.iml
generated
Normal file
@@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
BIN
htmlcss/pdfs/基础.pdf
Normal file
BIN
htmlcss/pdfs/基础.pdf
Normal file
Binary file not shown.
BIN
htmlcss/pdfs/移动端.pdf
Normal file
BIN
htmlcss/pdfs/移动端.pdf
Normal file
Binary file not shown.
BIN
htmlcss/pdfs/表单.pdf
Normal file
BIN
htmlcss/pdfs/表单.pdf
Normal file
Binary file not shown.
BIN
htmlcss/pdfs/表格.pdf
Normal file
BIN
htmlcss/pdfs/表格.pdf
Normal file
Binary file not shown.
BIN
htmlcss/基础.assets/image-20210417142345798.png
Normal file
BIN
htmlcss/基础.assets/image-20210417142345798.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.5 KiB |
BIN
htmlcss/基础.assets/image-20210417142408070.png
Normal file
BIN
htmlcss/基础.assets/image-20210417142408070.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
BIN
htmlcss/基础.assets/image-20210417142440900.png
Normal file
BIN
htmlcss/基础.assets/image-20210417142440900.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
BIN
htmlcss/基础.assets/image-20210417142544829.png
Normal file
BIN
htmlcss/基础.assets/image-20210417142544829.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
htmlcss/基础.assets/image-20210417142700974.png
Normal file
BIN
htmlcss/基础.assets/image-20210417142700974.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
83
htmlcss/基础.md
Normal file
83
htmlcss/基础.md
Normal file
@@ -0,0 +1,83 @@
|
||||
# html基础练习
|
||||
1. 写出html基本结构
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
2. 写出至少5个单标签和至少8个双标签
|
||||
|
||||
|
||||
|
||||
|
||||
3. 新建一个html文件，页面上展示hello world
|
||||
world加粗
|
||||
完成微信群内发截图
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
4. 新建一个html文件，页面上展示一篇文章的题目，作者，发布日期，正文内容，阅读量，点赞量，评论量
|
||||
其中，标题单独一行，下面放作者，发布日期，下面放正文内容，最下面放阅读量，点赞量，评论量
|
||||
完成微信群内发截图
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
5. 在任务4的基础上 在正文之前插入一个图片作为文章封面
|
||||
完成微信群内发截图
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
6. 在任务5的基础上，从最上面添加一个输入框和搜索按钮，点击搜索，将输入框中输入的值带入www.baidu.com的地址栏中
|
||||
完成微信群里发截图
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
7. 用自己的方式调整任务4的html页面的样式
|
||||
完成微信群内发截图
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
8. 完成下面的效果（内容为苏宁易购官网 https://www.suning.com/）
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
179
htmlcss/移动端.md
Normal file
179
htmlcss/移动端.md
Normal file
@@ -0,0 +1,179 @@
|
||||
# 移动端
|
||||
|
||||
1. 仿写京东手机版（https://m.jd.com/）
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
2. 手机端表格练习
|
||||
|
||||
|
||||
|
||||
备注 表格字段有 头像 昵称 活跃度 加入时间 是否为好友 性别 位置 id个性签名
|
||||
|
||||
除了用户 （包含用户名头像外 其他列可滚动）
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
资料上传列表
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 移动端 表单
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
BIN
htmlcss/移动端md.assets/image-20210417163206797.png
Normal file
BIN
htmlcss/移动端md.assets/image-20210417163206797.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 177 KiB |
BIN
htmlcss/移动端md.assets/image-20210417163418136.png
Normal file
BIN
htmlcss/移动端md.assets/image-20210417163418136.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
BIN
htmlcss/移动端md.assets/image-20210417163701901.png
Normal file
BIN
htmlcss/移动端md.assets/image-20210417163701901.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
htmlcss/移动端md.assets/image-20210417164124658.png
Normal file
BIN
htmlcss/移动端md.assets/image-20210417164124658.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
BIN
htmlcss/表单.assets/image-20210417151640744.png
Normal file
BIN
htmlcss/表单.assets/image-20210417151640744.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
htmlcss/表单.assets/image-20210417151656818.png
Normal file
BIN
htmlcss/表单.assets/image-20210417151656818.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
BIN
htmlcss/表单.assets/image-20210417151728218.png
Normal file
BIN
htmlcss/表单.assets/image-20210417151728218.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
htmlcss/表单.assets/image-20210417151948720.png
Normal file
BIN
htmlcss/表单.assets/image-20210417151948720.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
BIN
htmlcss/表单.assets/image-20210417162831726.png
Normal file
BIN
htmlcss/表单.assets/image-20210417162831726.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
100
htmlcss/表单.md
Normal file
100
htmlcss/表单.md
Normal file
@@ -0,0 +1,100 @@
|
||||
# 表单
|
||||
|
||||
完成下面练习
|
||||
|
||||
1.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
2.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
3.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
4.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
5.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
6.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
（上面的滑动验证可以先忽略掉）
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
7.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
8.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
（先只完成表单分类管理部分）
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
9.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
10.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
BIN
htmlcss/表格.assets/image-20210417143044634.png
Normal file
BIN
htmlcss/表格.assets/image-20210417143044634.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
htmlcss/表格.assets/image-20210417143051063.png
Normal file
BIN
htmlcss/表格.assets/image-20210417143051063.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
htmlcss/表格.assets/image-20210417145730641.png
Normal file
BIN
htmlcss/表格.assets/image-20210417145730641.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 69 KiB |
BIN
htmlcss/表格.assets/image-20210417145804193.png
Normal file
BIN
htmlcss/表格.assets/image-20210417145804193.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
htmlcss/表格.assets/image-20210417145821858.png
Normal file
BIN
htmlcss/表格.assets/image-20210417145821858.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
htmlcss/表格.assets/image-20210417145901068.png
Normal file
BIN
htmlcss/表格.assets/image-20210417145901068.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
htmlcss/表格.assets/image-20210417150516346.png
Normal file
BIN
htmlcss/表格.assets/image-20210417150516346.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 331 KiB |
BIN
htmlcss/表格.assets/image-20210417150651452.png
Normal file
BIN
htmlcss/表格.assets/image-20210417150651452.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 56 KiB |
89
htmlcss/表格.md
Normal file
89
htmlcss/表格.md
Normal file
@@ -0,0 +1,89 @@
|
||||
# 表格
|
||||
|
||||
* 完成下面的表格
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
* 完成课程表
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
* 完成下面简历表格
|
||||
|
||||
****
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
* 完成下面的三个数据表
|
||||
* 
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
* 结合表单完成下面表格
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
105
jq es6/es6.md
Normal file
105
jq es6/es6.md
Normal file
@@ -0,0 +1,105 @@
|
||||
# es6 相关
|
||||
|
||||
1. 下面这个例子最外面会输出10 如何解决
|
||||
|
||||
```
|
||||
for(var i = 0; i < 10; i++) {
|
||||
console.log(1);
|
||||
}
|
||||
console.log(i);
|
||||
```
|
||||
|
||||
2. 使用结构赋值，实现两个变量的值的交换
|
||||
3. 使用结构赋值，完成函数的参数默认值
|
||||
4. 利用数组推导，计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组。
|
||||
5. 使用模板字符串改写下面的代码。（ES5 to ES6改写题）
|
||||
```
|
||||
letname ="前端研究所";
|
||||
letobj = {
|
||||
"name":name,
|
||||
"say":function(){
|
||||
alert('hello world');
|
||||
}
|
||||
};
|
||||
|
||||
```
|
||||
6. 用箭头函数的形式改写下面的代码。（ES5 to ES6改写题）
|
||||
|
||||
```
|
||||
arr.forEach(function(v,i) {
|
||||
console.log(i);
|
||||
console.log(v);
|
||||
});
|
||||
|
||||
```
|
||||
|
||||
7. 设计一个对象，键名的类型至少包含一个symbol类型，并且实现遍历所有key。
|
||||
8. 有一本书的属性为：{“name”:“《ES6基础系列》”, ”price”：56 }；要求使用Proxy对象对其进行拦截处理，name属性对外为“《ES6入门到懵逼》”,price属性为只读。（练习题）
|
||||
9. 阅读下面的代码，并用for...of改成它。（ES5 to ES6改写题）
|
||||
10. 关于Set结构，阅读下面的代码，回答问题。（代码阅读题）。
|
||||
|
||||
```
|
||||
lets =newSet();
|
||||
s.add([1]);
|
||||
s.add([1]);
|
||||
console.log(s.size);
|
||||
|
||||
```
|
||||
问：打印出来的size的值是多少？为什么
|
||||
答：
|
||||
|
||||
11. 关于Map结构，阅读下面的代码，回答问题。（代码阅读题）
|
||||
|
||||
```
|
||||
letmap =newMap();
|
||||
map.set([1],"ES6系列");
|
||||
letcon = map.get([1]);
|
||||
console.log(con);
|
||||
|
||||
```
|
||||
|
||||
问：打印出来的变量con的值是多少，为什么？
|
||||
答：
|
||||
|
||||
|
||||
12. 11题的如何得到的变量con的值就是：“ES6系列”。
|
||||
|
||||
13. 通过class 定义一个类Animal，通过传参初始化它的类型，如：“猫科类”。它有一个实例方法：run，run函数体内容可自行定义。
|
||||
|
||||
14. 基于上一题的Animal类，定义一个子类Cat并继承Animal类。初始化Cat类的昵称name和年龄age。并拥有实例方法eat，eat函数体内容可自行定义。
|
||||
|
||||
15. 利用module模块，实现两个模块A和B，A模块导出变量name，age和say方法。B模块只导入变量name和say方法，并且重命名name为nickname。
|
||||
|
||||
16. 使用字符串模板 把下面代码补充完整
|
||||
```
|
||||
const greetings = (name) => {
|
||||
return `hello `; //要补充的部分
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
|
||||
17. 使用es6语法 实现下图代码功能
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
18. 冻结上面17题中定义的对象 使其无法被修改（温馨提示可以用 object.freeze()） 简单了解object.freeze()的用法
|
||||
|
||||
参考 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze
|
||||
|
||||
19. 解释一下 `Object.freeze()` 和 `const` 的区别
|
||||
|
||||
20. 说明下列方法为何不能用作 IIFE，要使其成为 IIFE，需要进行哪些更改？
|
||||
|
||||
```
|
||||
function foo(){ }();
|
||||
|
||||
```
|
||||
|
||||
21. 用promise语法封装ajax功能，并调用
|
||||
|
||||
22. 用await async 改写上面的21题
|
||||
BIN
jq es6/jq.assets/image-20210423104900177.png
Normal file
BIN
jq es6/jq.assets/image-20210423104900177.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
BIN
jq es6/jq.assets/image-20210423112831959.png
Normal file
BIN
jq es6/jq.assets/image-20210423112831959.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 195 KiB |
BIN
jq es6/jq.assets/image-20210423113120161.png
Normal file
BIN
jq es6/jq.assets/image-20210423113120161.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
jq es6/jq.assets/image-20210423113138888.png
Normal file
BIN
jq es6/jq.assets/image-20210423113138888.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
jq es6/jq.assets/image-20210423113234784.png
Normal file
BIN
jq es6/jq.assets/image-20210423113234784.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 253 KiB |
BIN
jq es6/jq.assets/image-20210423113257018.png
Normal file
BIN
jq es6/jq.assets/image-20210423113257018.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 253 KiB |
61
jq es6/jq.md
Normal file
61
jq es6/jq.md
Normal file
@@ -0,0 +1,61 @@
|
||||
# jquery相关
|
||||
|
||||
1. 在html文件中写上8个p标签，内容为
|
||||
1.你有多久没有翻开过一本书了？
|
||||
2. 加密原理详解：对称式加密VS非对称式加密
|
||||
3. 低代码：正在改变软件的开发方式
|
||||
4. Vue 转 React不完全指北
|
||||
5. web安全（xss/csrf）简单攻击原理和防御方案（实战篇）
|
||||
6. 深度解读 Chaos Mesh®，探索云原生混沌工程的奥秘
|
||||
7. 简洁设计-毛玻璃效果登陆页面
|
||||
8. 996 前端人该如何持续学习
|
||||
然后需要用jq实现点击哪个p标签 弹出对应的内容
|
||||
|
||||
2. 在html文件内写6个checkbox 内容 value值自定义 需要不一样 和一个按钮在此基础上 点击按钮需要输出 选中的checkbox的value 以及选中的总个数
|
||||
|
||||
|
||||
3. 分类添加内容
|
||||
如果选择 城市的话就添加到你喜欢哪个城市列表 如果选择游戏的话就添加到你喜欢哪个游戏的列表
|
||||
|
||||
效果图如下
|
||||
|
||||
|
||||
|
||||
4. 员工信息的增加和删除
|
||||
从输入框内填写姓名，邮箱，薪资 点击submit 就把输入的员工信息添加到员工信息表中
|
||||
效果图如下
|
||||
|
||||
|
||||
|
||||
5. 品牌展示 超出部分点击显示全部信息全都展示
|
||||
|
||||
效果图如下
|
||||
|
||||
|
||||
|
||||
6. 通过ajax 实现商品添加和商品展示功能 详情见附件 接口文档
|
||||
|
||||
7. 完成登录 注册 用户表页面 并通过ajax完成提交/渲染功能
|
||||
|
||||
8. 完成商城页面购物车的功能（单选 多选 全选。增删改查 ）<不牵扯接口 前端静态页面>
|
||||
|
||||
9. 写一个移动端的底部tabbar的效果 图片可以不变 但是文字要变颜色
|
||||
|
||||
10. 订单页面的tab切换效果
|
||||
|
||||
11. 地址管理页面的地址增删改查 设置默认地址效果
|
||||
|
||||
12. 京东页面的分类鼠标划过出不同菜单的效果
|
||||
|
||||
|
||||
|
||||
13. jq 实现 图片轮播效果（实现切换图片即可）
|
||||
|
||||
14. 秒杀倒计时效果
|
||||
|
||||
15. 根据当前时间确定在哪个区间的秒杀效果
|
||||
|
||||
|
||||
16. 京东详情 选择分类效果
|
||||
|
||||
|
||||
BIN
jq es6/pdfs/es6.pdf
Normal file
BIN
jq es6/pdfs/es6.pdf
Normal file
Binary file not shown.
BIN
jq es6/pdfs/jq.pdf
Normal file
BIN
jq es6/pdfs/jq.pdf
Normal file
Binary file not shown.
12
js/.idea/js.iml
generated
Normal file
12
js/.idea/js.iml
generated
Normal file
@@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
8
js/.idea/modules.xml
generated
Normal file
8
js/.idea/modules.xml
generated
Normal file
@@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/js.iml" filepath="$PROJECT_DIR$/.idea/js.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
6
js/.idea/vcs.xml
generated
Normal file
6
js/.idea/vcs.xml
generated
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="$PROJECT_DIR$/../.." vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
42
js/.idea/workspace.xml
generated
Normal file
42
js/.idea/workspace.xml
generated
Normal file
@@ -0,0 +1,42 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ChangeListManager">
|
||||
<list default="true" id="574aa996-43c7-40cb-9a4f-4996e79a3b88" name="Default Changelist" comment="">
|
||||
<change beforePath="$PROJECT_DIR$/../../.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/../../.idea/workspace.xml" afterDir="false" />
|
||||
</list>
|
||||
<option name="SHOW_DIALOG" value="false" />
|
||||
<option name="HIGHLIGHT_CONFLICTS" value="true" />
|
||||
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
|
||||
<option name="LAST_RESOLUTION" value="IGNORE" />
|
||||
</component>
|
||||
<component name="Git.Settings">
|
||||
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$/../.." />
|
||||
</component>
|
||||
<component name="ProjectId" id="1uUAnfSe89IVHtX21n2ybF7AbSs" />
|
||||
<component name="ProjectLevelVcsManager" settingsEditedManually="true" />
|
||||
<component name="ProjectViewState">
|
||||
<option name="hideEmptyMiddlePackages" value="true" />
|
||||
<option name="showLibraryContents" value="true" />
|
||||
</component>
|
||||
<component name="PropertiesComponent">
|
||||
<property name="RunOnceActivity.OpenProjectViewOnStart" value="true" />
|
||||
<property name="RunOnceActivity.ShowReadmeOnStart" value="true" />
|
||||
<property name="WebServerToolWindowFactoryState" value="false" />
|
||||
<property name="vue.rearranger.settings.migration" value="true" />
|
||||
</component>
|
||||
<component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" />
|
||||
<component name="TaskManager">
|
||||
<task active="true" id="Default" summary="Default task">
|
||||
<changelist id="574aa996-43c7-40cb-9a4f-4996e79a3b88" name="Default Changelist" comment="" />
|
||||
<created>1624709966538</created>
|
||||
<option name="number" value="Default" />
|
||||
<option name="presentableId" value="Default" />
|
||||
<updated>1624709966538</updated>
|
||||
<workItem from="1624709968543" duration="17000" />
|
||||
</task>
|
||||
<servers />
|
||||
</component>
|
||||
<component name="TypeScriptGeneratedFilesManager">
|
||||
<option name="version" value="3" />
|
||||
</component>
|
||||
</project>
|
||||
92
js/a (2).html
Normal file
92
js/a (2).html
Normal file
@@ -0,0 +1,92 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<script>
|
||||
var a = 2
|
||||
// var obj1 = {
|
||||
// a: 1,
|
||||
// fn1: (function (a) {
|
||||
// this.a = a
|
||||
// a++
|
||||
// return function () {
|
||||
// this.a = a++
|
||||
// console.log(this)
|
||||
// console.log(a)
|
||||
// }
|
||||
|
||||
// })(a)
|
||||
|
||||
// }
|
||||
// var fn1 = obj1.fn1
|
||||
// var fn1=function () {
|
||||
// this.a = a++
|
||||
// console.log(this)
|
||||
// console.log(a)
|
||||
// }
|
||||
|
||||
// console.log(fn1.toString())
|
||||
// fn1()
|
||||
|
||||
// console.log(getA)
|
||||
// if ('a' in window) {
|
||||
// var a = ''
|
||||
// function getA(a) {
|
||||
// a = a || this.a
|
||||
// console.log(this.a)
|
||||
// }
|
||||
// getA(a)
|
||||
// }
|
||||
|
||||
|
||||
|
||||
var c = 3
|
||||
function getC() {
|
||||
this.c++
|
||||
console.log(this,'kkkk')
|
||||
return function () {
|
||||
c = this.c * 2
|
||||
console.log(c)
|
||||
}
|
||||
}
|
||||
var obj3 = {
|
||||
c: 2,
|
||||
getC: (function () {
|
||||
this.c -= 1 //win.c-1 win.c=2
|
||||
console.log(this.c, this,'sss')
|
||||
return this.getC //obj3.getc=win.getc
|
||||
})()
|
||||
|
||||
}
|
||||
// var a=obj3.getC()
|
||||
// a()
|
||||
// obj3.getC()()
|
||||
|
||||
getC() //win.c++ =>win.c=3
|
||||
|
||||
console.log(obj3.getC.toString(),"aaaaaaa")
|
||||
obj3.getC()
|
||||
// console.log(obj3.c,window.c)
|
||||
var f3=obj3.getC;
|
||||
f3()
|
||||
// console.log(window.c)
|
||||
// console.log(obj3.c)
|
||||
|
||||
//step1 立即执行函数 => this 指向window win.c-1 -> win.c=2
|
||||
//step2 getC() this.c -=> win.c++ =>2+1 =>3
|
||||
//step3 obj3.getC() step1中 obj3.getc= win.getc 所以就是执行win.getc
|
||||
// 即 winc++ win.c=3
|
||||
//obj3.getc时 this指向的是obj3，this.c操作的是obj3.c , 所以obj3.c 也+1等于3
|
||||
//step4 f3本身等于win.getc函数， 执行f3() 即执行 win.getc() =>win.c++ win.c=4
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
86
js/a.html
Normal file
86
js/a.html
Normal file
@@ -0,0 +1,86 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
|
||||
<title>性格测试</title>
|
||||
<style type="text/css">
|
||||
#no1ul{
|
||||
list-style:none;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
}
|
||||
.close{
|
||||
display:none;
|
||||
}
|
||||
.show{
|
||||
color:#990000;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
function showTestResult(){
|
||||
var radioNodes = document.getElementsByName("answer");
|
||||
var resultNodes = document.getElementsByName("result");
|
||||
//健壮性判断
|
||||
var flag = false;
|
||||
for(var x=0;x<radioNodes.length;x++){
|
||||
if(radioNodes[x].checked){
|
||||
flag = true;
|
||||
showOne(resultNodes[x]);
|
||||
break;
|
||||
}
|
||||
}
|
||||
if(!flag){
|
||||
showOne(resultNodes[4]);
|
||||
}
|
||||
}
|
||||
//我们希望只显示一个测试结果
|
||||
function showOne(node){
|
||||
var resultNodes = document.getElementsByName("result");
|
||||
for(var x=0;x<resultNodes.length;x++){
|
||||
//先全部close
|
||||
resultNodes[x].className = "close";
|
||||
}
|
||||
//再显示这个节点
|
||||
node.className = "show";
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<h2>性格测试</h2>
|
||||
<div>
|
||||
<h3>问题</h3>
|
||||
<span>每天下班回家一进门，你会怎样脱掉鞋子?</span>
|
||||
<ul id="no1ul">
|
||||
<li><input type="radio" name="answer" value="1"/>A、很随意的脱下鞋子，不在乎如何摆放。</li>
|
||||
<li><input type="radio" name="answer" value="2"/>B、脱下鞋后，把鞋尖朝向门外的方向整齐排好。</li>
|
||||
<li><input type="radio" name="answer" value="3"/>C、脱下鞋后，把鞋尖朝屋内的方向整齐排好。</li>
|
||||
<li><input type="radio" name="answer" value="4"/>D、不自己脱鞋，而是由同住在一起的人帮你脱下鞋子。</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<input type="button" value="查看测试结果" onclick="showTestResult()"/>
|
||||
<hr/>
|
||||
<div id="a" name="result" class="close">
|
||||
A：这样的人，比较喜欢自由，认为生活舒适即可，不在意细节，完全不考虑社会体制和规则的类型，以追求自我欲望为中心。
|
||||
较冲动，喜欢自由奔放的生活方式。比较自我的人，这种人是为了追求欲望而行动的类型，仍然持续幼儿时期的性格。
|
||||
如果往好的方向发展，当然很好；但是，如果往坏的方向发展，结果会很令人惊叹。
|
||||
</div>
|
||||
<div id="b" name="result" class="close">
|
||||
B：这样的人很能吃苦，用自己的辛勤来享受生活。凡事都要准备得万全，是追求完美的人。容易在社会上树敌很多，对于同事也毫不放松。
|
||||
他们会压抑感情，喜怒不形于色，遵守社会规范而行动。但是，这种人的心里面防卫防备很严，即使认为是为了社会公益而做的事情，也会引起很多的误解。
|
||||
你的道德心和伦理感相当强烈，建议最好不要给自己过多的负担以免吃不消。
|
||||
</div>
|
||||
<div id="c" name="result" class="close">
|
||||
C：这样的人有自己的思考方式，有自己的做事风格，会适当地考虑方式方法，是办事周到的人。这样的人骄傲，但是又适度，所以会给人以成熟自信的感觉。
|
||||
</div>
|
||||
<div id="d" name="result" class="close">
|
||||
D：这样脱鞋方式的人，不用多说，一定是比较任性的人，与其说是任性，倒不如说是被完全惯坏了，因为周围的人都宠她，她要做的事情，都会由别人帮她做的很好，
|
||||
不是说她自己没由能力，是因为她的依赖性很强，所以这样的人必须注意与周围环境的协调，否则终有一天吃大亏。
|
||||
</div>
|
||||
<div id="e" name="result" class="close">
|
||||
E：你很皮！
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
97
js/callapply.md
Normal file
97
js/callapply.md
Normal file
@@ -0,0 +1,97 @@
|
||||
1.
|
||||
window.color = 'red';
|
||||
document.color = 'yellow';
|
||||
|
||||
var s1 = {color: 'blue' };
|
||||
function changeColor(){
|
||||
console.log(this.color);
|
||||
}
|
||||
|
||||
changeColor.call(); //red (默认传递参数)
|
||||
changeColor.call(window); //red
|
||||
changeColor.call(document); //yellow
|
||||
changeColor.call(this); //red
|
||||
changeColor.call(s1); //blue
|
||||
|
||||
2
|
||||
var Pet = {
|
||||
words : '...',
|
||||
speak : function (say) {
|
||||
console.log(say + ''+ this.words)
|
||||
}
|
||||
}
|
||||
Pet.speak('Speak'); // 结果：Speak...
|
||||
|
||||
var Dog = {
|
||||
words:'Wang'
|
||||
}
|
||||
|
||||
//将this的指向改变成了Dog
|
||||
Pet.speak.call(Dog, 'Speak'); //结果： SpeakWang
|
||||
|
||||
3
|
||||
用 apply重写上面两个函数
|
||||
|
||||
4
|
||||
function add(c,d){
|
||||
return this.a + this.b + c + d;
|
||||
}
|
||||
|
||||
var s = {a:1, b:2};
|
||||
console.log(add.call(s,3,4)); // 1+2+3+4 = 10
|
||||
console.log(add.apply(s,[5,6])); // 1+2+5+6 = 14
|
||||
|
||||
5.画出原型链
|
||||
//游戏--->王者---->小乔---->花嫁
|
||||
|
||||
6
|
||||
function C1(name) {
|
||||
if (name) {
|
||||
this.name = name;
|
||||
}
|
||||
}
|
||||
|
||||
function C2(name) {
|
||||
this.name = name;
|
||||
}
|
||||
|
||||
function C3(name) {
|
||||
this.name = name || 'join';
|
||||
}
|
||||
C1.prototype.name = 'Tom';
|
||||
C2.prototype.name = 'Tom';
|
||||
C3.prototype.name = 'Tom';
|
||||
alert((new C1().name) + (new C2().name) + (new C3().name));
|
||||
|
||||
7
|
||||
function Fn(num) {
|
||||
this.x = this.y = num;
|
||||
}
|
||||
Fn.prototype = {
|
||||
x: 20,
|
||||
sum: function () {
|
||||
console.log(this.x + this.y);
|
||||
}
|
||||
};
|
||||
let f = new Fn(10);
|
||||
console.log(f.sum === Fn.prototype.sum);
|
||||
f.sum();
|
||||
Fn.prototype.sum();
|
||||
console.log(f.constructor);
|
||||
|
||||
8
|
||||
var print=function(){alert(1);}
|
||||
function Fn() {
|
||||
print=function(){alert(2);}
|
||||
return this;
|
||||
}
|
||||
function print(){alert(3);}
|
||||
Fn.prototype.print=function(){alert(4);}
|
||||
Fn.print=function(){alert(5);}
|
||||
|
||||
print();
|
||||
Fn.print();
|
||||
Fn().print();
|
||||
new Fn.print();
|
||||
new Fn().print();
|
||||
|
||||
18
js/demo/digui.html
Normal file
18
js/demo/digui.html
Normal file
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<script>
|
||||
// 数格子有几种走法
|
||||
// 已知 可以走一格或者走两格
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
js/dom.assets/image-20210519165912729.png
Normal file
BIN
js/dom.assets/image-20210519165912729.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
js/dom.assets/image-20210519165917810.png
Normal file
BIN
js/dom.assets/image-20210519165917810.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
37
js/dom.md
Normal file
37
js/dom.md
Normal file
@@ -0,0 +1,37 @@
|
||||
# dom
|
||||
1. 点击按钮时，显示和隐藏盒子。
|
||||
|
||||
2. 鼠标悬停时，显示二维码大图
|
||||
|
||||
3. 点击按钮禁用文本框/解禁文本框
|
||||
|
||||
4. 文本框获取焦点/失去焦点（淘宝 京东的搜索框效果）
|
||||
|
||||
5. 用户注册信息错误时，输入框失去焦点后，高亮显示。
|
||||
|
||||
6. 全选和反选（仿京东购物车）
|
||||
|
||||
7. 电子时钟 （时间会更新）
|
||||
|
||||
|
||||
|
||||
|
||||
8. 随机点名 通过math.radom取随机数实现随机点名 名字集合放在数组里
|
||||
|
||||
|
||||
|
||||
|
||||
9. 获取验证码，并验证
|
||||
|
||||
html部分：在输入框输入验证码，验证是否一致，点击更换验证码内容
|
||||
验证：获取输入框内容，与验证码内容匹配
|
||||
|
||||
|
||||
10. 性格测试
|
||||
类似于这样 四个选项对应不同的结果
|
||||
|
||||
|
||||
|
||||
11. 仿写 todolist的备忘录功能 实现要做项的增删改查
|
||||
|
||||
12. 在html上写一个表格 包括姓名 年龄 性别 住址 职业 通过js 做信息的增删改查
|
||||
BIN
js/js/dom.pdf
Normal file
BIN
js/js/dom.pdf
Normal file
Binary file not shown.
BIN
js/js/函数.pdf
Normal file
BIN
js/js/函数.pdf
Normal file
Binary file not shown.
BIN
js/js/对象1.pdf
Normal file
BIN
js/js/对象1.pdf
Normal file
Binary file not shown.
BIN
js/js/语句.pdf
Normal file
BIN
js/js/语句.pdf
Normal file
Binary file not shown.
BIN
js/js/运算符.pdf
Normal file
BIN
js/js/运算符.pdf
Normal file
Binary file not shown.
BIN
js/js/递归.pdf
Normal file
BIN
js/js/递归.pdf
Normal file
Binary file not shown.
120
js/jsthis.md
Normal file
120
js/jsthis.md
Normal file
@@ -0,0 +1,120 @@
|
||||
# this
|
||||
1
|
||||
|
||||
function fn2(){
|
||||
console.log(this.n)
|
||||
var n='n'
|
||||
this.n=10
|
||||
console.log(n)
|
||||
}
|
||||
var obj={fn2:fn2, n:1}
|
||||
fn2()
|
||||
obj.fn2()
|
||||
console.log(obj.n, window.n)
|
||||
|
||||
//undefined 'n'
|
||||
//1 'n'
|
||||
//10 10
|
||||
|
||||
2
|
||||
|
||||
function f(){console.log(this)}
|
||||
|
||||
var obj={
|
||||
fn: (function(){
|
||||
return this.f
|
||||
})(),
|
||||
f: function(){console.log(this)}
|
||||
}
|
||||
f()
|
||||
obj.f()
|
||||
obj.fn()
|
||||
// window obj obj
|
||||
|
||||
3
|
||||
|
||||
var n = 10
|
||||
var obj1={
|
||||
n:1,
|
||||
f:function(){this.n++; n=this.n++}
|
||||
}
|
||||
|
||||
obj1.f()
|
||||
console.log(n) // 2
|
||||
console.log(obj1.n) // 2
|
||||
window.setTimeout(obj1.f, 1000)
|
||||
|
||||
//2
|
||||
//3
|
||||
|
||||
4
|
||||
|
||||
console.log(getA)
|
||||
if('a' in window){
|
||||
var a = ''
|
||||
function getA(a){
|
||||
a = a||this.a
|
||||
console.log(this.a)
|
||||
}
|
||||
getA(a)
|
||||
}
|
||||
|
||||
5
|
||||
|
||||
var a=2
|
||||
var obj1 = {
|
||||
a:1,
|
||||
fn1: (function(a){
|
||||
this.a = a
|
||||
a++
|
||||
return function(){
|
||||
this.a = a++
|
||||
console.log(a)
|
||||
}
|
||||
|
||||
})(a)
|
||||
}
|
||||
obj1.fn1() // 4
|
||||
var fn1 = obj1.fn1
|
||||
fn1() // window.a = 4,a=5
|
||||
|
||||
6
|
||||
|
||||
var c=3
|
||||
function getC(){
|
||||
this.c++
|
||||
return function (){
|
||||
c=this.c*2
|
||||
console.log(c)
|
||||
}
|
||||
}
|
||||
var obj3={
|
||||
c: 2,
|
||||
getC:(function(){
|
||||
this.c -= 1
|
||||
return this.getC
|
||||
})()
|
||||
}
|
||||
getC() // window.c = 3
|
||||
obj3.getC() // obj3.c=3
|
||||
var f3=obj3.getC
|
||||
f3() // window.c=4
|
||||
console.log(window.c) // 4
|
||||
console.log(obj3.c) // 3
|
||||
|
||||
|
||||
for (var i = 1; i <= 5; i++) {
|
||||
|
||||
setTimeout( function timer() {
|
||||
|
||||
console.log(i);
|
||||
|
||||
}, 1000 );
|
||||
|
||||
}
|
||||
|
||||
上面的代码会输出什么？怎么改动上述代码，使其依次输出1、2、3、4、5 并说明原因
|
||||
|
||||
|
||||
理论题：
|
||||
谈谈什么是闭包
|
||||
BIN
js/pdfs/函数.pdf
Normal file
BIN
js/pdfs/函数.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/基础.pdf
Normal file
BIN
js/pdfs/基础.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/对象1.pdf
Normal file
BIN
js/pdfs/对象1.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/数组.pdf
Normal file
BIN
js/pdfs/数组.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/语句.pdf
Normal file
BIN
js/pdfs/语句.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/运算符.pdf
Normal file
BIN
js/pdfs/运算符.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/递归.pdf
Normal file
BIN
js/pdfs/递归.pdf
Normal file
Binary file not shown.
BIN
js/pdfs/预编译作用域.pdf
Normal file
BIN
js/pdfs/预编译作用域.pdf
Normal file
Binary file not shown.
120
js/this.md
Normal file
120
js/this.md
Normal file
@@ -0,0 +1,120 @@
|
||||
# this
|
||||
1
|
||||
|
||||
function fn2(){
|
||||
console.log(this.n)
|
||||
var n='n'
|
||||
this.n=10
|
||||
console.log(n)
|
||||
}
|
||||
var obj={fn2:fn2, n:1}
|
||||
fn2()
|
||||
obj.fn2()
|
||||
console.log(obj.n, window.n)
|
||||
|
||||
|
||||
|
||||
2
|
||||
|
||||
function f(){console.log(this)}
|
||||
|
||||
var obj={
|
||||
fn: (function(){
|
||||
return this.f
|
||||
})(),
|
||||
f: function(){console.log(this)}
|
||||
}
|
||||
f()
|
||||
obj.f()
|
||||
obj.fn()
|
||||
|
||||
3
|
||||
|
||||
var n = 10
|
||||
var obj1={
|
||||
n:1,
|
||||
f:function(){this.n++; n=this.n++}
|
||||
}
|
||||
|
||||
obj1.f()
|
||||
console.log(n)
|
||||
console.log(obj1.n)
|
||||
window.setTimeout(obj1.f, 1000)
|
||||
|
||||
|
||||
4
|
||||
|
||||
console.log(getA)
|
||||
if('a' in window){
|
||||
var a = ''
|
||||
function getA(a){
|
||||
a = a||this.a
|
||||
console.log(this.a)
|
||||
}
|
||||
getA(a)
|
||||
}
|
||||
|
||||
5
|
||||
|
||||
var a=2
|
||||
var obj1 = {
|
||||
a:1,
|
||||
fn1: (function(a){
|
||||
this.a = a
|
||||
a++
|
||||
return function(){
|
||||
this.a = a++
|
||||
console.log(a)
|
||||
}
|
||||
|
||||
})(a)
|
||||
|
||||
}
|
||||
obj1.fn1()
|
||||
var fn1 = obj1.fn1
|
||||
fn1() // window.a = 4,a=5
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
6
|
||||
|
||||
var c=3
|
||||
function getC(){
|
||||
this.c++
|
||||
return function (){
|
||||
c=this.c*2
|
||||
console.log(c)
|
||||
}
|
||||
}
|
||||
var obj3={
|
||||
c: 2,
|
||||
getC:(function(){
|
||||
this.c -= 1
|
||||
return this.getC
|
||||
})()
|
||||
}
|
||||
getC()
|
||||
obj3.getC()
|
||||
var f3=obj3.getC
|
||||
f3()
|
||||
console.log(window.c)
|
||||
console.log(obj3.c)
|
||||
|
||||
|
||||
for (var i = 1; i <= 5; i++) {
|
||||
|
||||
setTimeout( function timer() {
|
||||
|
||||
console.log(i);
|
||||
|
||||
}, 1000 );
|
||||
|
||||
}
|
||||
|
||||
上面的代码会输出什么？怎么改动上述代码，使其依次输出1、2、3、4、5 并说明原因
|
||||
|
||||
|
||||
理论题：
|
||||
谈谈什么是闭包
|
||||
347
js/thislx.md
Normal file
347
js/thislx.md
Normal file
@@ -0,0 +1,347 @@
|
||||
# this练习
|
||||
注：document.write的题目 需要写出在页面上打印的结果
|
||||
1. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var person = {
|
||||
firstName: "John",
|
||||
lastName : "Doe",
|
||||
id : 5566,
|
||||
fullName : function() {
|
||||
return this.firstName + " " + this.lastName;
|
||||
}
|
||||
};
|
||||
|
||||
// 显示对象的数据
|
||||
document.getElementById("demo").innerHTML = person.fullName();
|
||||
|
||||
```
|
||||
|
||||
2. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
var x = this;
|
||||
document.getElementById("demo").innerHTML = x;
|
||||
|
||||
```
|
||||
|
||||
3. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
"use strict";
|
||||
var x = this;
|
||||
document.getElementById("demo").innerHTML = x;
|
||||
|
||||
```
|
||||
|
||||
4. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
document.getElementById("demo").innerHTML = myFunction();
|
||||
function myFunction() {
|
||||
return this;
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
5. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
"use strict";
|
||||
document.getElementById("demo").innerHTML = myFunction();
|
||||
function myFunction() {
|
||||
return this;
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
6. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
<body>
|
||||
|
||||
<h2>JavaScript <b>this</b> 关键字</h2>
|
||||
|
||||
<button onclick="this.style.display='none'">点我后我就消失了</button>
|
||||
|
||||
</body>
|
||||
|
||||
```
|
||||
|
||||
|
||||
7. 下面代码执行结果是什么 为什么
|
||||
```
|
||||
var person = {
|
||||
firstName : "John",
|
||||
lastName : "Doe",
|
||||
id : 5566,
|
||||
myFunction : function() {
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
// 显示表单数据
|
||||
document.getElementById("demo").innerHTML = person.myFunction();
|
||||
|
||||
```
|
||||
8. 把第7题的对象中的属性和方法挨个打印在页面上
|
||||
9. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
var person = {
|
||||
firstName: "John",
|
||||
lastName : "Doe",
|
||||
id : 5566,
|
||||
fullName : function() {
|
||||
return this.firstName + " " + this.lastName;
|
||||
}
|
||||
};
|
||||
|
||||
// 显示对象的数据
|
||||
document.getElementById("demo").innerHTML = person.fullName();
|
||||
|
||||
```
|
||||
|
||||
10. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
var person1 = {
|
||||
fullName: function() {
|
||||
return this.firstName + " " + this.lastName;
|
||||
}
|
||||
}
|
||||
var person2 = {
|
||||
firstName:"John",
|
||||
lastName: "Doe",
|
||||
}
|
||||
person1.fullName.call(person2);
|
||||
|
||||
```
|
||||
|
||||
11. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function speak(){
|
||||
var name = this.name
|
||||
console.log(`Hello I am ${name}`)
|
||||
}
|
||||
var me = {
|
||||
name: 'a',
|
||||
speak: speak
|
||||
}
|
||||
var you = {
|
||||
name: 'b',
|
||||
speak: speak
|
||||
}
|
||||
me.speak()
|
||||
you.speak()
|
||||
|
||||
```
|
||||
|
||||
12. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function fn(){
|
||||
console.log(this.name)
|
||||
}
|
||||
fn.name = 'xxx'
|
||||
fn()
|
||||
|
||||
```
|
||||
|
||||
13. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function foo() {
|
||||
var a = 2;
|
||||
this.bar();
|
||||
}
|
||||
function bar() {
|
||||
console.log( this.a );
|
||||
}
|
||||
foo();
|
||||
|
||||
```
|
||||
|
||||
14. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function foo(){
|
||||
console.log(this.a)
|
||||
}
|
||||
var a = 2
|
||||
foo()
|
||||
|
||||
```
|
||||
|
||||
15. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function foo() {
|
||||
console.log( this.a );
|
||||
}
|
||||
var obj = {
|
||||
a: 2,
|
||||
foo: foo
|
||||
};
|
||||
obj.foo();
|
||||
|
||||
```
|
||||
|
||||
14. 下面的fn中的this指向谁
|
||||
```
|
||||
obj1.obj2.obj3.fn()
|
||||
```
|
||||
|
||||
15. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function foo() {
|
||||
console.log( this.a );
|
||||
}
|
||||
var obj = {
|
||||
a: 2,
|
||||
foo: foo
|
||||
};
|
||||
var bar = obj.foo; // 函数别名!
|
||||
var a = "xxxxx"
|
||||
bar();
|
||||
|
||||
```
|
||||
|
||||
16. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function foo() {
|
||||
console.log( this.a );
|
||||
}
|
||||
var obj = {
|
||||
a: 2,
|
||||
foo: foo
|
||||
};
|
||||
var a = "xxxxx"
|
||||
setTimeout( obj.foo ,100);
|
||||
|
||||
```
|
||||
|
||||
17. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function foo(something) {
|
||||
console.log( this.a, something );
|
||||
return this.a + something;
|
||||
}
|
||||
function bind(fn, obj) {
|
||||
return function() {
|
||||
return fn.apply( obj, arguments );
|
||||
};
|
||||
}
|
||||
var obj = {
|
||||
a:2
|
||||
};
|
||||
var bar = bind( foo, obj );
|
||||
var b = bar( 3 ); // 2 3
|
||||
console.log( b );
|
||||
|
||||
|
||||
```
|
||||
|
||||
18. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
const test = {
|
||||
prop: 42,
|
||||
func: function() {
|
||||
return this.prop;
|
||||
},
|
||||
};
|
||||
|
||||
console.log(test.func());
|
||||
|
||||
```
|
||||
|
||||
19. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
console.log(this === window);
|
||||
|
||||
a = 37;
|
||||
console.log(window.a);
|
||||
|
||||
this.b = "MND";
|
||||
console.log(window.b)
|
||||
console.log(b)
|
||||
|
||||
```
|
||||
|
||||
20. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function f1(){
|
||||
return this;
|
||||
}
|
||||
//在浏览器中：
|
||||
f1() === window; //在浏览器中，全局对象是window
|
||||
|
||||
//在Node中：
|
||||
f1() === globalThis;
|
||||
|
||||
|
||||
```
|
||||
|
||||
21. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
function f2(){
|
||||
"use strict"; // 这里是严格模式
|
||||
return this;
|
||||
}
|
||||
|
||||
f2() === undefined;
|
||||
|
||||
```
|
||||
|
||||
22. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
var obj = {a: 'Custom'};
|
||||
var a = 'Global';
|
||||
|
||||
function whatsThis() {
|
||||
return this.a;
|
||||
}
|
||||
|
||||
whatsThis();
|
||||
whatsThis.call(obj);
|
||||
whatsThis.apply(obj);
|
||||
|
||||
```
|
||||
|
||||
23. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function C(){
|
||||
this.a = 37;
|
||||
}
|
||||
|
||||
var o = new C();
|
||||
console.log(o.a);
|
||||
|
||||
|
||||
function C2(){
|
||||
this.a = 37;
|
||||
return {a:38};
|
||||
}
|
||||
|
||||
o = new C2();
|
||||
console.log(o.a);
|
||||
|
||||
```
|
||||
|
||||
24. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
<button onclick="alert(this.tagName.toLowerCase());">
|
||||
Show this
|
||||
</button>
|
||||
|
||||
|
||||
```
|
||||
167
js/函数.md
Normal file
167
js/函数.md
Normal file
@@ -0,0 +1,167 @@
|
||||
# 函数
|
||||
* 简介函数语法
|
||||
* 函数名命名规则
|
||||
* 函数包含哪几部分
|
||||
* 函数调用的三种情况
|
||||
* 简述函数返回值
|
||||
* 下面代码的执行结果为
|
||||
```
|
||||
var x = myFunction(7, 8);
|
||||
function myFunction(a, b) {
|
||||
return a * b;
|
||||
}
|
||||
```
|
||||
|
||||
* 为什么要使用函数
|
||||
* 简单介绍局部变量和全局变量
|
||||
* 下面两段代码的执行结果分别是什么 并说明原因
|
||||
```
|
||||
function myFunction() {
|
||||
var carName = "Volvo";
|
||||
}
|
||||
console.log(carName)
|
||||
|
||||
```
|
||||
```
|
||||
function myFunction() {
|
||||
var carName = "Volvo";
|
||||
console.log(carName)
|
||||
}
|
||||
|
||||
|
||||
```
|
||||
|
||||
* 函数如何返回值，如何接收
|
||||
* 下面代码执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function sum(iNum1, iNum2) {
|
||||
return iNum1 + iNum2;
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
* 下面代码执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function sum(iNum1, iNum2) {
|
||||
console.log(iNum1 + iNum2);
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
* 下面代码执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function sum(iNum1, iNum2) {
|
||||
console.log(iNum1 + iNum2);
|
||||
}
|
||||
sum()
|
||||
|
||||
```
|
||||
|
||||
* 下面代码执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function sum(iNum1, iNum2) {
|
||||
return iNum1 + iNum2;
|
||||
}
|
||||
var iResult = sum(1,1);
|
||||
alert(iResult);
|
||||
|
||||
```
|
||||
|
||||
* 下面代码执行结果是什么 为什么
|
||||
|
||||
```
|
||||
function sum(iNum1, iNum2) {
|
||||
return iNum1 + iNum2;
|
||||
alert(iNum1 + iNum2);
|
||||
}
|
||||
```
|
||||
|
||||
* 下面代码的执行结果为
|
||||
```
|
||||
function sayHi(sMessage) {
|
||||
if (sMessage == "bye") {
|
||||
return;
|
||||
}
|
||||
|
||||
alert(sMessage);
|
||||
}
|
||||
```
|
||||
|
||||
* 如何检测参数的个数
|
||||
* 下面代码的执行结果是多少
|
||||
```
|
||||
function howManyArgs() {
|
||||
alert(arguments.length);
|
||||
}
|
||||
|
||||
howManyArgs("string", 45);
|
||||
howManyArgs();
|
||||
howManyArgs(12);
|
||||
|
||||
```
|
||||
* 什么是arguments 对象
|
||||
* 下面代码的执行结果
|
||||
```
|
||||
function sayHi() {
|
||||
if (arguments[0] == "bye") {
|
||||
return;
|
||||
}
|
||||
|
||||
alert(arguments[0]);
|
||||
}
|
||||
```
|
||||
|
||||
* 下面代码的执行结果是什么
|
||||
```
|
||||
function howManyArgs() {
|
||||
alert(arguments.length);
|
||||
}
|
||||
|
||||
howManyArgs("string", 45);
|
||||
howManyArgs();
|
||||
howManyArgs(12);
|
||||
|
||||
```
|
||||
* 什么是函数重载
|
||||
* 下面代码的执行结果是什么
|
||||
```
|
||||
function doAdd() {
|
||||
if(arguments.length == 1) {
|
||||
alert(arguments[0] + 5);
|
||||
} else if(arguments.length == 2) {
|
||||
alert(arguments[0] + arguments[1]);
|
||||
}
|
||||
}
|
||||
|
||||
doAdd(10);
|
||||
doAdd(40, 20);
|
||||
```
|
||||
|
||||
* 通过new function() 的系形式重新定义下面的对象
|
||||
```
|
||||
function sayHi(sName, sMessage) {
|
||||
alert("Hello " + sName + sMessage);
|
||||
}
|
||||
|
||||
```
|
||||
* Function对象的属性和方法
|
||||
* 编写一个函数，计算三个数字的大小，按从小到大顺序输出
|
||||
* 编写一个函数，计算任意两个数字之间所能组成的奇数个数，数字必须是个位数
|
||||
比如： 计算0-3之间能组成的奇数个是01、21、03、13、23、31
|
||||
|
||||
* 某个公司采用公用电话传递数据，数据是四位的整数，在传递过程中是加密的，
|
||||
加密规则如下：每位数字都加上5,然后用除以10的余数代替该数字，再将第一位和第四位交换，
|
||||
第二位和第三位交换，请编写一个函数，传入原文，输出密文
|
||||
|
||||
* 用*实现等边三角形
|
||||
|
||||
* 编写一个函数来验证输入的字符串是否是有效的 IPv4 地址。
|
||||
|
||||
如果是有效的 IPv4 地址，返回 "IPv4" ；
|
||||
如果不是上述类型的 IP 地址，返回 "Neither" 。
|
||||
|
||||
IPv4 地址由十进制数和点来表示，每个地址包含 4 个十进制数，其范围为 0 - 255， 用(".")分割。比如，172.16.254.1；
|
||||
232
js/原型链题目.md
Normal file
232
js/原型链题目.md
Normal file
@@ -0,0 +1,232 @@
|
||||
# 原型链题目
|
||||
|
||||
## 1 、prototype和__proto__的概念（简答题）
|
||||
|
||||
prototype是函数的一个属性（每个函数都有一个prototype属性），这个属性是一个指针，指向一个对象。它是显示修改对象的原型的属性。
|
||||
|
||||
__proto__是一个对象拥有的内置属性，是JS内部使用寻找原型链的属性。
|
||||
|
||||
## 2、prototype和__proto__的区别？
|
||||
|
||||
prototype是函数的内置属性，__proto__是对象的内置属性
|
||||
|
||||
## 3、js中的原型链以及最顶端是什么？（填空题）
|
||||
|
||||
Object.prototype
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 4、以下代码会输出什么？（）（）（）（）（）（填空题）
|
||||
|
||||
```
|
||||
function Foo() {
|
||||
getName = function() {
|
||||
alert(1)
|
||||
};
|
||||
return this;
|
||||
}
|
||||
Foo.getName = function() {
|
||||
alert(2)
|
||||
};
|
||||
Foo.prototype.getName = function() {
|
||||
alert(3)
|
||||
};
|
||||
var getName = function() {
|
||||
alert(4)
|
||||
};
|
||||
|
||||
function getName() {
|
||||
alert(5)
|
||||
};
|
||||
Foo.getName(); //2
|
||||
getName(); //4
|
||||
Foo().getName() // 1
|
||||
getName(); //1
|
||||
new Foo.getName(); //2
|
||||
```
|
||||
|
||||
答案：2 4 1 1 2
|
||||
|
||||
注释： getname() 在调用的时候 ，前面声明了两个getname函数 一个是function通过函数声明 另一个是通过 var 也就是函数表达式声明函数
|
||||
|
||||
根据预编译的过程 ，函数表达式和函数声明都会发生变量提升
|
||||
|
||||
var getname=function(){alert(4)}
|
||||
|
||||
function getname(){alert(5)}
|
||||
|
||||
|
||||
|
||||
过程：
|
||||
|
||||
var getname;
|
||||
|
||||
funciton getname(){alert(5)}
|
||||
|
||||
getname=function(){alert(4)}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 5、以下代码会输出什么？（）（填空题）
|
||||
|
||||
```
|
||||
function A() {
|
||||
this.do = function() {
|
||||
return 'foo'
|
||||
}
|
||||
}
|
||||
A.prototype = function() {
|
||||
this.do = function() {
|
||||
return 'bar'
|
||||
}
|
||||
}
|
||||
var x = new A().do()
|
||||
console.log(x)
|
||||
```
|
||||
|
||||
答案：foo
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 6、以下代码会输出什么？（）（填空题）
|
||||
|
||||
```
|
||||
function C1(name) {
|
||||
if (name) {
|
||||
this.name = name;
|
||||
}
|
||||
}
|
||||
|
||||
function C2(name) {
|
||||
this.name = name;
|
||||
}
|
||||
|
||||
function C3(name) {
|
||||
this.name = name || 'join';
|
||||
}
|
||||
C1.prototype.name = 'Tom';
|
||||
C2.prototype.name = 'Tom';
|
||||
C3.prototype.name = 'Tom';
|
||||
console.log((new C1().name)+'/' + (new C2().name)+'/' + (new C3().name));
|
||||
```
|
||||
|
||||
答案：Tom/undefined/join
|
||||
|
||||
new c1().name 已知 c1中没有name属性（实例化的时候没传参数） 所以在访问name属性的时候 会访问c1原型中的name属性 即后面赋值原型的语句 C1.prototype.name = 'Tom'; c2在访问name属性的时候 会先从c2内部找 已知 c2内部已经有 this.name=name了 虽然在实例化的时候没有传入参数作为name的值 但是this.name赋值的步骤没有经过任何条件判断 所以会赋值为 undefined new c3().name c3.name会先从c3的实例对象找 已知 c3的实例对象中this.name也是没有任何条件判断必然会执行 他的值是如果name有值就是传入的name的值 如果没有传入参数name的值 就是join 实例化的时候没有传参数 所以是join
|
||||
|
||||
|
||||
|
||||
## 7、以下代码会输出什么？（）（）（）（填空题）
|
||||
|
||||
```
|
||||
function A() {};
|
||||
function B(a) {
|
||||
this.a = a;
|
||||
}
|
||||
function C(a) {
|
||||
if (a) {
|
||||
this.a = a;
|
||||
}
|
||||
}
|
||||
A.prototype.a = 1;
|
||||
B.prototype.a = 1;
|
||||
C.prototype.a = 1;
|
||||
console.log(new A().a);
|
||||
console.log(new B().a);
|
||||
console.log(new C(2).a);
|
||||
```
|
||||
|
||||
答案：1 undefined 2
|
||||
|
||||
分析：首先看当前构造函数是否定义这个属性，若有直接输出，否则在其原型链上依次查找。
|
||||
A：原型链查找到 a=1；B：函数本身有 a属性；C：函数先判断参数；若参数的布尔值为真则输出 a的值,否则输出原型链上a的值
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 8、以下代码会输出什么？（）（）（）（）（填空题）
|
||||
|
||||
```
|
||||
var F = function() {};
|
||||
Object.prototype.a = function() {
|
||||
console.log("a()");
|
||||
};
|
||||
Function.prototype.b = function() {
|
||||
console.log("b()");
|
||||
};
|
||||
var f = new F();
|
||||
F.a();
|
||||
F.b();
|
||||
f.a();
|
||||
f.b();
|
||||
```
|
||||
|
||||
答案：a() b() a() 报错
|
||||
|
||||
分析：
|
||||
函数内部和函数原型上没有 a，沿着其原型链查找属性。
|
||||
f.b()，f 的构造函数是 F 而非 Function ，从上述原型链图观察，f 的原型链查找不到 Function的原型。
|
||||
|
||||
|
||||
|
||||
F.a() 因为F是 函数 继承自 Function Function又继承自 Object 所以a属性不在F中时会按顺序查找到object.prototype.a的结果为 a()
|
||||
|
||||
F.b同理
|
||||
|
||||
f.a() 因为f是通过F函数构造出的对象 所以 他属于object 能访问object.prototype 但是不属于 function 所以不能访问 function.prototype
|
||||
|
||||
所以 f.b()报错
|
||||
|
||||
|
||||
|
||||
## 9、以下代码会输出什么？（）（）（）（）（填空题）
|
||||
|
||||
```
|
||||
var A=function(){}
|
||||
A.prototype.n=1
|
||||
var b=new A()
|
||||
A.prototype={
|
||||
n:2,
|
||||
m:3
|
||||
}
|
||||
var c=new A()
|
||||
console.log(b.n,b.m,c.n,c.m)
|
||||
```
|
||||
|
||||
答案：1 undefined 2 3
|
||||
|
||||
## 10、f有方法a吗？有方法b吗？（）（）（填空题）
|
||||
|
||||
```
|
||||
var F = function () {}
|
||||
Object.prototype.a = function () {}
|
||||
Function.prototype.b = function () {}
|
||||
|
||||
var f = new F()
|
||||
```
|
||||
|
||||
答案：有a 没有b
|
||||
|
||||
## 11、以下代码会输出什么？（）（）（）（）（填空题）
|
||||
|
||||
```
|
||||
function Person(){}
|
||||
Person.prototype.n=1
|
||||
var p1=new Person()
|
||||
Person.prototype={
|
||||
n:2,
|
||||
m:3
|
||||
}
|
||||
var p2=new Person()
|
||||
console.log(p1.n,p1.m,p2.n,p2.m)
|
||||
|
||||
```
|
||||
|
||||
答案：1 undefined 2 3
|
||||
BIN
js/原型链题目.pdf
Normal file
BIN
js/原型链题目.pdf
Normal file
Binary file not shown.
178
js/基础 - 副本.md
Normal file
178
js/基础 - 副本.md
Normal file
@@ -0,0 +1,178 @@
|
||||
# js 基础练习
|
||||
* 写出三种种js引入方式并举例
|
||||
1. 外部引入 ```<script src="./main.js"></script>```
|
||||
2. 内部引入 ```<script>alert("hello world)</script> ```
|
||||
3. 在dom元素上使用script ``` <button onclick="save()">提交</button> ```
|
||||
* 下面两段代码，说明js文件的加载顺序并解释原因
|
||||
demo1:
|
||||
|
||||
```
|
||||
<script async src="js/vendor/jquery.js"></script>
|
||||
<script async src="js/script2.js"></script>
|
||||
<script async src="js/script3.js"></script>
|
||||
|
||||
```
|
||||
|
||||
demo2
|
||||
```
|
||||
<script defer src="js/vendor/jquery.js"></script>
|
||||
<script defer src="js/script2.js"></script>
|
||||
<script defer src="js/script3.js"></script>
|
||||
|
||||
```
|
||||
|
||||
第一个（async 修饰的） 没法判断加载顺序
|
||||
第二个（defer修饰的） 先加载 jquery.js 然后是 script2.js 最后是 script3.js
|
||||
|
||||
* 如果浏览器不支持javascript的语法需要在页面上提示您的浏览器不支持javascript 运行 如何实现
|
||||
在html 文件中写
|
||||
```<noscript>您的浏览器不支持javascript 运行</noscript>```
|
||||
|
||||
|
||||
* 列举几种js 交互方式
|
||||
consol.log() document.write() alert() prompt() confirm()
|
||||
|
||||
* js的组成
|
||||
ECMAScript DOM BOM
|
||||
* JavaScript 如何与 HTML 和 CSS 协同工作
|
||||
html(结构) css（样式） js(行为)
|
||||
|
||||
|
||||
* 在外部文件中放置js脚本有什么优势
|
||||
|
||||
①简化HTML代码：将HTML代码中的JavaScript代码独立成外部文件，可以简化HTML文档中的代码，让HTML代码看起来更直观、清楚。
|
||||
|
||||
②编程模块化：可以将多个HTML文档中相同的JavaScript代码独立成外部文件，方便在多个HTML文档里引用。此时外部脚本文件相当于程序中的一个模块，如果修改该脚本文件的内容，所有引用该脚本文件的HTML文档中的部分也会被修改。
|
||||
|
||||
③代码易于维护：将JavaScript代码独立成外部文件，如果需要修改其中功能，只需要修改外部文件中的代码。如果所有JavaScript代码都嵌入HTML代码之中，那么即使要修改相同部分的内容，也必须修改所有HTML文件，修改的工作量较大。
|
||||
|
||||
④增加安全性：将JavaScript代码独立成外部文件，在查看HTML源代码时看不到JavaScript代码的内容，无形之中减少了受攻击的机会。
|
||||
|
||||
⑤加速浏览：浏览器会自动缓存网络中的文件。当一个外部脚本文件使用之后，浏览器会将其放入缓存中。如果另外一个HTML文档引用该外部脚本文件，浏览器就可以直接从缓存中读取该文件，而不需要从网络中下载，因此，会加快加载网页的速度。
|
||||
|
||||
⑥引用其他服务器上的文件的脚本文件：script元素中的src属性值是一个标准的URL，因此在HTML文档中除了可以引用当前服务器中的脚本文件，还可以引用其他服务器中的脚本文件。
|
||||
|
||||
主要是1，2，3
|
||||
|
||||
|
||||
变量和常量
|
||||
* 如何交换两个变量的值
|
||||
* 字面量和变量的关系及区别
|
||||
1.字面量是指由字母，数字等构成的字符串或者数值，它只能作为右值出现,(右值是指等号右边的值，如：int a=123这里的a为左值，123为右值。)
|
||||
|
||||
2.常量和变量都属于变量，只不过常量是赋过值后不能再改变的变量，而普通的变量可以再进行赋值操作。
|
||||
* 变量命名规则
|
||||
|
||||
* 下面代码执行结果为 原因是
|
||||
```
|
||||
var obj1 = new Object();
|
||||
var obj2 = obj1;
|
||||
obj1.name = "Nicholas";
|
||||
alert(obj2.name);
|
||||
|
||||
```
|
||||
结果是 Nicholas
|
||||
原因（简单数据类型和复杂数据类型的区别）
|
||||
1.内存的分配不同
|
||||
基本数据类型存储在栈中
|
||||
复杂数据类型存储在堆中，栈中存储的变量 是指向堆中的引用地址
|
||||
2.访问机制不同
|
||||
基本数据类型是按值访问
|
||||
复杂数据类型是按引用访问
|
||||
|
||||
|
||||
* 用一行语句声明5个变量 其中值包有一个只声明不赋值 其他分别为null 数值 字符串 布尔
|
||||
数据类型
|
||||
|
||||
* 数据类型可以分为哪几类 有什么区别
|
||||
|
||||
* 如何实现功能 当浏览器不支持javascript脚本的时候 给用户在页面上提示“您的浏览器不支持javascript 脚本，请尽快升级浏览器”
|
||||
* typeof 检测数据类型的返回值都有什么 分别代表什么意思
|
||||
* 类型转换相关
|
||||
1. 输入两个数字，点求和弹出两个数字相加的结果。
|
||||
1. 输入框的默认value进行相加，结果是进行了字符串相加，而非数字相加。
|
||||
2. 将value的值进行parseInt，之后再相加，就是数字相加的结果了。
|
||||
如果输入12+abc，会是什么结果？ 你得到了什么结论
|
||||
3.isNaN，检测输入框的内容是不是NaN。true为真，false为假。
|
||||
4.写出下面的执行结果
|
||||
1 + '1' 11
|
||||
true + 0 1
|
||||
{}+[]
|
||||
4 + {}
|
||||
4 + [1]
|
||||
'a' + + 'b'
|
||||
console.log ( [] == 0 )
|
||||
console.log ( ! [] == 0 )
|
||||
console.log ( [] == ! [] )
|
||||
console.log ( [] == [] )
|
||||
console.log({} == !{})
|
||||
console.log({} == {})
|
||||
|
||||
1. 定义一个变量存储数据1234，分别输出个位，十位，百位，千位数字
|
||||
2. 输入两个数字，相减四舍五入（.toFixed() 把保留几位小数写在括号里）
|
||||
3. 从弹框中输入一个字符，判断这个字符是否是英文字母，数字，汉字（4e00-9fa5）
|
||||
4. 下面代码的输出结果
|
||||
console.log(10 + " cats");
|
||||
console.log(10 * " cats");
|
||||
Boolean([])
|
||||
console.log(10 + "2");
|
||||
console.log(10 - "2");
|
||||
Number("3")
|
||||
console.log(10 / "2");
|
||||
console.log(10 * "2");
|
||||
String(false)
|
||||
console.log(10 * " 2");
|
||||
console.log("10" * "2");
|
||||
console.log(Object(undefined));
|
||||
console.log(Object(null));
|
||||
|
||||
5. 下面代码的执行结果
|
||||
var str = "abc";
|
||||
str[0] = "d";
|
||||
|
||||
console.log(str[1]="e");
|
||||
console.log(str[0]);
|
||||
console.log(str);
|
||||
var num = [1,2,3];
|
||||
num[0] = "a";
|
||||
|
||||
console.log(num);
|
||||
|
||||
1. 下面代码的执行结果
|
||||
var obj1 = {age: 22};
|
||||
var obj2 = obj1;
|
||||
|
||||
console.log(obj1 === obj2);
|
||||
obj2.age = 18;
|
||||
console.log(obj1 === obj2);
|
||||
|
||||
2. 解释10，11结果出现的原因 并归纳基本数据类型和引用数据类型的区别
|
||||
|
||||
3. 下面代码的输出结果
|
||||
var obj1 = {age: 22};
|
||||
var obj2 = obj1;
|
||||
console.log(obj1 === obj2);
|
||||
obj2.age = 18;
|
||||
console.log(obj1 === obj2);
|
||||
console.log("1" instanceof String);
|
||||
console.log(("1").constructor === String);
|
||||
console.log((1).constructor === Number);
|
||||
console.log((true).constructor === Boolean);
|
||||
console.log(([]).constructor === Array);
|
||||
console.log((function() {}).constructor === Function);
|
||||
console.log(({}).constructor === Object);
|
||||
console.log(1 instanceof Number);
|
||||
console.log(true instanceof Boolean);
|
||||
console.log([] instanceof Array);
|
||||
console.log(function(){} instanceof Function);
|
||||
console.log({} instanceof Object);
|
||||
var test = Object.prototype.toString;
|
||||
console.log(test.call("str"));
|
||||
console.log(test.call(1));
|
||||
console.log(test.call(true));
|
||||
console.log(test.call(null));
|
||||
console.log(test.call(undefined));
|
||||
console.log(test.call([]));
|
||||
console.log(test.call(function() {}));
|
||||
console.log(test.call({}));
|
||||
|
||||
142
js/基础.md
Normal file
142
js/基础.md
Normal file
@@ -0,0 +1,142 @@
|
||||
# js 基础练习
|
||||
* 写出四种js引入方式并举例
|
||||
* 下面两段代码，说明js文件的加载顺序并解释原因
|
||||
demo1:
|
||||
|
||||
```
|
||||
<script async src="js/vendor/jquery.js"></script>
|
||||
<script async src="js/script2.js"></script>
|
||||
<script async src="js/script3.js"></script>
|
||||
|
||||
```
|
||||
|
||||
demo2
|
||||
```
|
||||
<script defer src="js/vendor/jquery.js"></script>
|
||||
<script defer src="js/script2.js"></script>
|
||||
<script defer src="js/script3.js"></script>
|
||||
|
||||
```
|
||||
* 如果浏览器不支持javascript的语法需要在页面上提示您的浏览器不支持javascript 运行 如何实现
|
||||
|
||||
|
||||
|
||||
* 列举几种js 交互方式
|
||||
|
||||
* js的组成
|
||||
|
||||
* JavaScript 如何与 HTML 和 CSS 协同工作
|
||||
|
||||
* 在外部文件中放置js脚本有什么优势
|
||||
|
||||
|
||||
|
||||
变量和常量
|
||||
* 如何交换两个变量的值
|
||||
* 字面量和变量的关系及区别
|
||||
* 变量命名规则
|
||||
|
||||
* 下面代码执行结果为 原因是
|
||||
```
|
||||
var obj1 = new Object();
|
||||
var obj2 = obj1;
|
||||
obj1.name = "Nicholas";
|
||||
alert(obj2.name);
|
||||
|
||||
```
|
||||
* 用一行语句声明5个变量 其中值包有一个只声明不赋值 其他分别为null 数值 字符串 布尔
|
||||
数据类型
|
||||
|
||||
* 数据类型可以分为哪几类 有什么区别
|
||||
|
||||
* 如何实现功能 当浏览器不支持javascript脚本的时候 给用户在页面上提示“您的浏览器不支持javascript 脚本，请尽快升级浏览器”
|
||||
* typeof 检测数据类型的返回值都有什么 分别代表什么意思
|
||||
* 类型转换相关
|
||||
1. 输入两个数字，点求和弹出两个数字相加的结果。
|
||||
1. 输入框的默认value进行相加，结果是进行了字符串相加，而非数字相加。
|
||||
2. 将value的值进行parseInt，之后再相加，就是数字相加的结果了。
|
||||
如果输入12+abc，会是什么结果？ 你得到了什么结论
|
||||
3.isNaN，检测输入框的内容是不是NaN。true为真，false为假。
|
||||
4.写出下面的执行结果
|
||||
1 + '1'
|
||||
true + 0
|
||||
{}+[]
|
||||
4 + {}
|
||||
4 + [1]
|
||||
'a' + + 'b'
|
||||
console.log ( [] == 0 )
|
||||
console.log ( ! [] == 0 )
|
||||
console.log ( [] == ! [] )
|
||||
console.log ( [] == [] )
|
||||
console.log({} == !{})
|
||||
console.log({} == {})
|
||||
|
||||
1. 定义一个变量存储数据1234，分别输出个位，十位，百位，千位数字
|
||||
2. 输入两个数字，相减四舍五入（.toFixed() 把保留几位小数写在括号里）
|
||||
3. 从弹框中输入一个字符，判断这个字符是否是英文字母，数字，汉字（4e00-9fa5）
|
||||
4. 下面代码的输出结果
|
||||
console.log(10 + " cats");
|
||||
console.log(10 * " cats");
|
||||
Boolean([])
|
||||
console.log(10 + "2");
|
||||
console.log(10 - "2");
|
||||
Number("3")
|
||||
console.log(10 / "2");
|
||||
console.log(10 * "2");
|
||||
String(false)
|
||||
console.log(10 * " 2");
|
||||
console.log("10" * "2");
|
||||
console.log(Object(undefined));
|
||||
console.log(Object(null));
|
||||
|
||||
5. 下面代码的执行结果
|
||||
var str = "abc";
|
||||
str[0] = "d";
|
||||
|
||||
console.log(str[1]="e");
|
||||
console.log(str[0]);
|
||||
console.log(str);
|
||||
var num = [1,2,3];
|
||||
num[0] = "a";
|
||||
|
||||
console.log(num);
|
||||
|
||||
1. 下面代码的执行结果
|
||||
var obj1 = {age: 22};
|
||||
var obj2 = obj1;
|
||||
|
||||
console.log(obj1 === obj2);
|
||||
obj2.age = 18;
|
||||
console.log(obj1 === obj2);
|
||||
|
||||
2. 解释10，11结果出现的原因 并归纳基本数据类型和引用数据类型的区别
|
||||
|
||||
3. 下面代码的输出结果
|
||||
var obj1 = {age: 22};
|
||||
var obj2 = obj1;
|
||||
console.log(obj1 === obj2);
|
||||
obj2.age = 18;
|
||||
console.log(obj1 === obj2);
|
||||
console.log("1" instanceof String);
|
||||
console.log(("1").constructor === String);
|
||||
console.log((1).constructor === Number);
|
||||
console.log((true).constructor === Boolean);
|
||||
console.log(([]).constructor === Array);
|
||||
console.log((function() {}).constructor === Function);
|
||||
console.log(({}).constructor === Object);
|
||||
console.log(1 instanceof Number);
|
||||
console.log(true instanceof Boolean);
|
||||
console.log([] instanceof Array);
|
||||
console.log(function(){} instanceof Function);
|
||||
console.log({} instanceof Object);
|
||||
var test = Object.prototype.toString;
|
||||
console.log(test.call("str"));
|
||||
console.log(test.call(1));
|
||||
console.log(test.call(true));
|
||||
console.log(test.call(null));
|
||||
console.log(test.call(undefined));
|
||||
console.log(test.call([]));
|
||||
console.log(test.call(function() {}));
|
||||
console.log(test.call({}));
|
||||
|
||||
|
||||
121
js/对象1.md
Normal file
121
js/对象1.md
Normal file
@@ -0,0 +1,121 @@
|
||||
# 对象练习
|
||||
* 什么是面向对象 什么是面向过程
|
||||
* 分别介绍对象的三大特征
|
||||
* 对象也是一个变量，但对象可以包含多个值（多个变量），每个值以 对呈现。
|
||||
* 定义一个对象 包含下列属性 name age sex addr(居住地) job(职业)
|
||||
包含下列方法
|
||||
eat, sleep, playgame, watchtv ,read
|
||||
函数体内自定义内容 不可为空
|
||||
* 给上面的题里的对象添加 height(身高) weight(体重) 属性并赋值
|
||||
* 给上面题里的对象添加 下列方法
|
||||
meituan(点外卖 参数需要传手机号和居住地址 想吃的东西 返回下单成功)
|
||||
cook(做饭 需要传入时间 判断当前是哪一顿饭)
|
||||
travel(需要传入目的地 返回我去哪里玩啦)
|
||||
listenmusic(传入你喜欢的歌手 控制台打印最喜欢的曲子)
|
||||
work（传入上班时间和下班时间 判断是否为996）
|
||||
|
||||
* 访问上面对象定义的以及添加后的所有属性（两种方式访问 先指明可以通过什么方式访问）
|
||||
格式为 如name字段: 姓名：+name的属性值
|
||||
通过调用不同的方法来制定行程（按照正常顺序调用上面对象的每一个方法）
|
||||
|
||||
* 探索对象创建的其他方式 每种都举例尝试（不得少于三个方法 五个属性）
|
||||
* 探索遍历函数的所有属性
|
||||
* 五大主流浏览器的名字为键 内核为值 创建一个对象
|
||||
* 下面代码的执行结果是：
|
||||
```
|
||||
function person(firstname,lastname,age,eyecolor)
|
||||
{
|
||||
this.firstname=firstname;
|
||||
this.lastname=lastname;
|
||||
this.age=age;
|
||||
this.eyecolor=eyecolor;
|
||||
return [this.firstname,this.lastname,this.age,this.eyecolor,this]
|
||||
}
|
||||
|
||||
var myFather=new person("John","Doe",50,"blue");
|
||||
var myMother=person("Sally","Rally",48,"green");
|
||||
console.log(myFather)
|
||||
console.log(myMother)
|
||||
```
|
||||
* 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
const user = {
|
||||
name: "John"
|
||||
};
|
||||
user.name = "Pete";
|
||||
alert(user.name);
|
||||
```
|
||||
|
||||
* 如何访问下面对象的bird属性
|
||||
对象为：
|
||||
var user={
|
||||
fire:"fox",
|
||||
likes:{
|
||||
type:"animal",
|
||||
bird:"fly"
|
||||
}
|
||||
}
|
||||
给user对象添加一个属性名是name 值是user
|
||||
给user对象添加一个方法 触发后可以删除user对象的likes里面的type
|
||||
|
||||
创建一个对象 属性值为用户输入的自定义字符（最少三个属性）
|
||||
|
||||
* 创建一个对象 包含如下内容
|
||||
* code 值为200
|
||||
* msg 值为"请求成功"
|
||||
* data 值为数组[]
|
||||
* data中包含如下内容
|
||||
* shopname 商品名
|
||||
|
||||
* pic 商品图片
|
||||
|
||||
* desc 商品简介
|
||||
|
||||
* price 商品价格
|
||||
|
||||
* kucun 库存
|
||||
|
||||
* xiaoliang 销量
|
||||
|
||||
* caozuo 操作
|
||||
|
||||
注 写的时候把值赋上
|
||||
|
||||
* 把上面那个题目用构造函数的重新写一份，并生成4个内容不同的对象
|
||||
|
||||
* 创建一个对象 包含如下内容
|
||||
* store 商店名称
|
||||
* addr 商店地址
|
||||
* sale: 方法 输出xxx商店正在大甩卖
|
||||
|
||||
* 遍历上面的两个对象 并输出每个的键和值
|
||||
|
||||
* 从外面给商店的对象增添一个shoplist的属性 该属性是一个数组 包含英雄名称跟英雄价格 货币单位以金币计算（5个王者英雄就ok）
|
||||
|
||||
* 把第一题中的data中的对象里面的caozuo 属性删除
|
||||
|
||||
|
||||
* 分析
|
||||
```
|
||||
var F = function () {}
|
||||
Object.prototype.a = function () {}
|
||||
Function.prototype.b = function () {}
|
||||
|
||||
var f = new F()
|
||||
// 请问f有方法a 方法b吗
|
||||
|
||||
|
||||
* 写出p1,p2,person,obj,Function,Object等的原型链
|
||||
function Person(){}
|
||||
|
||||
let p1 = new Person()
|
||||
let p2 = new Person()
|
||||
let obj = {}
|
||||
* 通过原型链实现祖孙三层继承关系 （每个对象包含三个属性，两个方法）
|
||||
* 访问上个题中原型中的对象
|
||||
* 用用原型链继承封装dom操作
|
||||
* 创建元素
|
||||
* 修改属性
|
||||
* 修改内容
|
||||
* 添加事件
|
||||
|
||||
56
js/数组.md
Normal file
56
js/数组.md
Normal file
@@ -0,0 +1,56 @@
|
||||
# 数组
|
||||
* 什么是数组
|
||||
|
||||
* 创建一个长度为4的内容为字符串的数组 并把数组中的元素和数组长度打印在页面上
|
||||
|
||||
* 下面这种数组声明方式对嘛？为啥
|
||||
```
|
||||
var cars = [
|
||||
"Saab",
|
||||
"Volvo",
|
||||
"BMW"
|
||||
];
|
||||
|
||||
```
|
||||
|
||||
* 下面这种数组声明方式对嘛？为啥
|
||||
```
|
||||
var cars = [
|
||||
"Saab",
|
||||
"Volvo",
|
||||
"BMW",
|
||||
];
|
||||
|
||||
```
|
||||
|
||||
* 把第1题的数组用new关键字重新声明一遍
|
||||
* 如何访问数组中的元素
|
||||
* 定义一个长度为10的没有空元素的数组（内容正规一点哈 别整敷衍的abcdefg 1234567...这样的）
|
||||
不通过遍历挨个输出每个元素的值（输出的方式随意）
|
||||
|
||||
* 定义个数组里面装着 五大主流浏览器 然后通过 下标把浏览器名字改成对应的内核（不去重）
|
||||
|
||||
* 通过遍历方法对浏览器内核的数组去重
|
||||
* 通过splice方法完成五大主流浏览器题目的效果
|
||||
* typeof 一个数组的返回结果为
|
||||
* 数组中能存储对象嘛？能存储函数嘛? 能存储数组嘛？ 如果能请举例 不能的话说明理由
|
||||
|
||||
* 列举数组相关的方法 并说明作用每个方法附带两个例子
|
||||
* 定义一个长度为5的数组 并访问最后一个元素（用两种方式）
|
||||
* 定义一个长度为 20的数组，用三种方式实现数组的遍历并输出数组中每个元素的值（自己拓充foreach）
|
||||
* 使用4种方式给数组添加新元素
|
||||
* 如何准确的识别是否为数组
|
||||
* 为什么要避免使用new array创建数组
|
||||
* 计算给定数组 arr 中所有元素的总和
|
||||
|
||||
输入 [ 1, 2, 3, 4 ]
|
||||
输出： 10
|
||||
|
||||
* 找出数组 arr 中重复出现过的元素
|
||||
输入[1, 2, 4, 4, 3, 3, 1, 5, 3]
|
||||
输出：[1, 3, 4]
|
||||
|
||||
* 写一个函数 统计数组 arr 中值等于 item 的元素出现的次数
|
||||
输入： [1, 2, 4, 4, 3, 4, 3], 4
|
||||
输出：3
|
||||
|
||||
BIN
js/语句.assets/image-20210324153432392.png
Normal file
BIN
js/语句.assets/image-20210324153432392.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
17
js/语句.md
Normal file
17
js/语句.md
Normal file
@@ -0,0 +1,17 @@
|
||||
# 语句
|
||||
* 完成jsinfo相关练习
|
||||
* 判断闰年
|
||||
* 根据分数划分等级（四个等级）
|
||||
* 用switch完成查询水果的价格（五种水果 如果不在列表里就提示未上架）
|
||||
* 在弹框中输入你的工资，大于等于20000显示高工资，8000-20000显示中高工资，小于8000显示普通工资
|
||||
* 实现 fizzBuzz 函数，参数 num 与返回值的关系如下：
|
||||
1、如果 num 能同时被 3 和 5 整除，返回字符串 fizzbuzz
|
||||
2、如果 num 能被 3 整除，返回字符串 fizz
|
||||
3、如果 num 能被 5 整除，返回字符串 buzz
|
||||
4、如果参数为空或者不是 Number 类型，返回 false
|
||||
5、其余情况，返回参数 num
|
||||
|
||||
示例
|
||||
输入：15
|
||||
输出：fizzbuzz
|
||||
|
||||
220
js/运算符 - 副本.md
Normal file
220
js/运算符 - 副本.md
Normal file
@@ -0,0 +1,220 @@
|
||||
# 运算符相关
|
||||
1. 两个自定义变量进行相等对比，弹出运算结果。 （分别放两个按钮 第一个弹出==的比较结果 第二个弹出 ===的比较结果）
|
||||
2. 完成计算器的功能 输入两个数 输出计算结果 具体计算功能包含 加减乘除成方取余 每个计算方式分别放按钮 点击输出计算结果
|
||||
3. 用js 取模实现表格的隔行换色
|
||||
4. 求商取模应用于秒转时间 输入框单位为秒
|
||||
思路：不管输入框获取到的数字是多少，都执行除60取分钟，除600取小时，最后取模为秒数。通过parseInt取整数
|
||||
5. 判断是否为两位数
|
||||
6. 写出运算符优先级
|
||||
7. 计算年龄案例：输入生日输出年龄 并且判断是否能进入网吧
|
||||
8. 运算符的优先级
|
||||
9. 下面代码的执行结果为
|
||||
```
|
||||
var age = 29;
|
||||
var anotherAge = --age + 2;
|
||||
alert(age);
|
||||
alert(anotherAge);
|
||||
|
||||
var time=1
|
||||
var newtime=time++
|
||||
console.log(time,newtime)
|
||||
|
||||
```
|
||||
|
||||
11. 下面代码的执行结果为
|
||||
```
|
||||
<script>
|
||||
var a =1;
|
||||
function test(){
|
||||
alert(a);
|
||||
var a = 2;
|
||||
alert(a);
|
||||
}
|
||||
test();
|
||||
alert(a);
|
||||
</script>
|
||||
|
||||
```
|
||||
12. 下面代码的执行结果为
|
||||
```
|
||||
var x = 7;
|
||||
x += 8;
|
||||
console.log(x)
|
||||
|
||||
|
||||
var y=7
|
||||
y=+8;
|
||||
console.log(y)
|
||||
|
||||
```
|
||||
|
||||
13. 下面代码的执行结果为：
|
||||
```
|
||||
txt1 = "Hello ";
|
||||
txt1 += "Kitty!";
|
||||
console.log(txt1)
|
||||
|
||||
console.log(x = 7 + 8;)
|
||||
console.log(y = "7" + 8;)
|
||||
console.log(z = "Hello" + 7;)
|
||||
|
||||
```
|
||||
|
||||
14. 已知 x=5 分别写出下列语句的打印结果
|
||||
x == 8
|
||||
x == 5
|
||||
x == "5"
|
||||
x === 5
|
||||
x === "5"
|
||||
x != 8
|
||||
x !== 5
|
||||
x !== "5"
|
||||
x !== 8
|
||||
x > 8
|
||||
x < 8
|
||||
x >= 8
|
||||
x <= 8
|
||||
|
||||
|
||||
15. 已知 x=6 y=3 分别写出下列语句的打印结果
|
||||
x < 10 && y > 1
|
||||
x == 5 || y == 5
|
||||
!(x == y)
|
||||
|
||||
|
||||
16. 已知现有fish="23"
|
||||
var cat = (fish < 18) ? "再来一筐锦鲤":"吃饱啦";
|
||||
最后的cat 打印结果为
|
||||
|
||||
17. 写出下面的打印结果
|
||||
2 < 12
|
||||
2 < "12"
|
||||
2 < "John"
|
||||
2 > "John"
|
||||
2 == "John"
|
||||
"2" < "12"
|
||||
"2" > "12"
|
||||
"2" == "12"
|
||||
|
||||
18. 写出下面的打印结果
|
||||
```
|
||||
txt1="What a very ";
|
||||
txt2="nice day";
|
||||
txt3=txt1+txt2;
|
||||
console.log(txt3)
|
||||
var x = 1;
|
||||
x = -x;
|
||||
alert( x );
|
||||
|
||||
var x = 1, y = 3;
|
||||
alert( y - x );
|
||||
|
||||
```
|
||||
|
||||
19. 写出下面的打印结果
|
||||
```
|
||||
alert( 5 % 2 );
|
||||
alert( 8 % 3 );
|
||||
alert( 2 ** 2 );
|
||||
alert( 2 ** 3 );
|
||||
alert( 2 ** 4 );
|
||||
alert( 4 ** (1/2) );
|
||||
alert( 8 ** (1/3) );
|
||||
alert( '1' + 2 );
|
||||
alert( 2 + '1' );
|
||||
alert(2 + 2 + '1' );
|
||||
var x = 1;
|
||||
alert( +x );
|
||||
|
||||
var y = -2;
|
||||
alert( +y );
|
||||
|
||||
// 转化非数字
|
||||
alert( +true );
|
||||
alert( +"" );
|
||||
|
||||
var apples = "2";
|
||||
var oranges = "3";
|
||||
alert( apples + oranges );
|
||||
alert( Number(apples) + Number(oranges) );
|
||||
```
|
||||
20. 运算符优先级
|
||||
21. 下面代码的执行结果为
|
||||
```
|
||||
let a = 1;
|
||||
let b = 2;
|
||||
|
||||
let c = 3 - (a = b + 1);
|
||||
|
||||
alert( a );
|
||||
alert( c );
|
||||
|
||||
```
|
||||
|
||||
```
|
||||
let a, b, c;
|
||||
|
||||
a = b = c = 2 + 2;
|
||||
|
||||
alert( a );
|
||||
alert( b );
|
||||
alert( c );
|
||||
|
||||
let n = 2;
|
||||
n += 5;
|
||||
n *= 2;
|
||||
|
||||
alert( n );
|
||||
|
||||
let n = 2;
|
||||
n *= 3 + 5;
|
||||
alert( n );
|
||||
|
||||
```
|
||||
|
||||
22. 下面代码的打印结果为
|
||||
```
|
||||
alert( true || true ); // true
|
||||
alert( false || true ); // true
|
||||
alert( true || false ); // true
|
||||
alert( false || false ); // false
|
||||
|
||||
```
|
||||
|
||||
```
|
||||
alert( 1 || 0 );
|
||||
|
||||
alert( null || 1 );
|
||||
alert( null || 0 || 1 );
|
||||
alert( undefined || null || 0 )
|
||||
var firstName = "";
|
||||
var lastName = "";
|
||||
var nickName = "SuperCoder";
|
||||
alert( firstName || lastName || nickName || "Anonymous");
|
||||
```
|
||||
23. 下面代码会执行嘛 为什么
|
||||
```
|
||||
true || alert("not printed");
|
||||
false || alert("printed");
|
||||
```
|
||||
|
||||
24. 下面代码的执行结果
|
||||
```
|
||||
alert( 1 && 0 );
|
||||
alert( 1 && 5 );
|
||||
alert( null && 5 );
|
||||
alert( 0 && "no matter what" )
|
||||
alert( 1 && 2 && null && 3 )
|
||||
alert( 1 && 2 && 3 )
|
||||
alert( !!"non-empty string" );
|
||||
alert( !!null );
|
||||
alert( Boolean("non-empty string") );
|
||||
alert( Boolean(null) );
|
||||
alert( null || 2 || undefined );
|
||||
alert( alert(1) || 2 || alert(3) )
|
||||
alert( alert(1) && alert(2) );
|
||||
alert( null || 2 && 3 || 4 );
|
||||
|
||||
```
|
||||
附加
|
||||
游戏开始时，显示12个图像的背面，用鼠标点击其中任意一张，即可显示图像的正面，如果点击了两张，则显示出两张图像的正面。如果点击过的两张图像是相同的图像，则将图像从界面中移除
|
||||
BIN
js/运算符.assets/image-20210324114152811.png
Normal file
BIN
js/运算符.assets/image-20210324114152811.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
12
js/运算符.assets/数组.md
Normal file
12
js/运算符.assets/数组.md
Normal file
@@ -0,0 +1,12 @@
|
||||
# 数组
|
||||
* 笔记跟课上的内容整理
|
||||
* 用两种方式定义一个数组，并遍历出数组中的每一个元素
|
||||
* 定义一个数组来存储12个学生的成绩{72,89,65,58,87,91,53,82,71,93,76,68}，计算并输出学生的平均成绩。
|
||||
* 创建一个4位的二维数组，并遍历循环出每一个元素
|
||||
* 写一个函数实现 传入一个数组 返回他冒泡排序处理后的结果
|
||||
* 三种数组去重的方法
|
||||
* 用js实现随机选取10~100之间的10个数字，存入一个数组，并排序
|
||||
//要是获取不重复的，则对随机数再进行去重。
|
||||
|
||||
* 定义一个长度为6的数组（元素为数字，并且有可能重复），请给Array.prototype增加一个方法（方法名自取），该方法能去掉数组中全部最大和最小的数字。
|
||||
数组最大值
|
||||
BIN
js/运算符.assets/数组.pdf
Normal file
BIN
js/运算符.assets/数组.pdf
Normal file
Binary file not shown.
220
js/运算符.md
Normal file
220
js/运算符.md
Normal file
@@ -0,0 +1,220 @@
|
||||
# 运算符相关
|
||||
1. 两个自定义变量进行相等对比，弹出运算结果。 （分别放两个按钮 第一个弹出==的比较结果 第二个弹出 ===的比较结果）
|
||||
2. 完成计算器的功能 输入两个数 输出计算结果 具体计算功能包含 加减乘除成方取余 每个计算方式分别放按钮 点击输出计算结果
|
||||
3. 用js 取模实现表格的隔行换色
|
||||
4. 求商取模应用于秒转时间 输入框单位为秒
|
||||
思路：不管输入框获取到的数字是多少，都执行除60取分钟，除600取小时，最后取模为秒数。通过parseInt取整数
|
||||
5. 判断是否为两位数
|
||||
6. 写出运算符优先级
|
||||
7. 计算年龄案例：输入生日输出年龄 并且判断是否能进入网吧
|
||||
8. 运算符的优先级
|
||||
9. 下面代码的执行结果为
|
||||
```
|
||||
var age = 29;
|
||||
var anotherAge = --age + 2;
|
||||
alert(age);
|
||||
alert(anotherAge);
|
||||
|
||||
var time=1
|
||||
var newtime=time++
|
||||
console.log(time,newtime)
|
||||
|
||||
```
|
||||
|
||||
11. 下面代码的执行结果为
|
||||
```
|
||||
<script>
|
||||
var a =1;
|
||||
function test(){
|
||||
alert(a);
|
||||
var a = 2;
|
||||
alert(a);
|
||||
}
|
||||
test();
|
||||
alert(a);
|
||||
</script>
|
||||
|
||||
```
|
||||
12. 下面代码的执行结果为
|
||||
```
|
||||
var x = 7;
|
||||
x += 8;
|
||||
console.log(x)
|
||||
|
||||
|
||||
var y=7
|
||||
y=+8;
|
||||
console.log(y)
|
||||
|
||||
```
|
||||
|
||||
13. 下面代码的执行结果为：
|
||||
```
|
||||
txt1 = "Hello ";
|
||||
txt1 += "Kitty!";
|
||||
console.log(txt1)
|
||||
|
||||
console.log(x = 7 + 8;)
|
||||
console.log(y = "7" + 8;)
|
||||
console.log(z = "Hello" + 7;)
|
||||
|
||||
```
|
||||
|
||||
14. 已知 x=5 分别写出下列语句的打印结果
|
||||
x == 8
|
||||
x == 5
|
||||
x == "5"
|
||||
x === 5
|
||||
x === "5"
|
||||
x != 8
|
||||
x !== 5
|
||||
x !== "5"
|
||||
x !== 8
|
||||
x > 8
|
||||
x < 8
|
||||
x >= 8
|
||||
x <= 8
|
||||
|
||||
|
||||
15. 已知 x=6 y=3 分别写出下列语句的打印结果
|
||||
x < 10 && y > 1
|
||||
x == 5 || y == 5
|
||||
!(x == y)
|
||||
|
||||
|
||||
16. 已知现有fish="23"
|
||||
var cat = (fish < 18) ? "再来一筐锦鲤":"吃饱啦";
|
||||
最后的cat 打印结果为
|
||||
|
||||
17. 写出下面的打印结果
|
||||
2 < 12
|
||||
2 < "12"
|
||||
2 < "John"
|
||||
2 > "John"
|
||||
2 == "John"
|
||||
"2" < "12"
|
||||
"2" > "12"
|
||||
"2" == "12"
|
||||
|
||||
18. 写出下面的打印结果
|
||||
```
|
||||
txt1="What a very ";
|
||||
txt2="nice day";
|
||||
txt3=txt1+txt2;
|
||||
console.log(txt3)
|
||||
var x = 1;
|
||||
x = -x;
|
||||
alert( x );
|
||||
|
||||
var x = 1, y = 3;
|
||||
alert( y - x );
|
||||
|
||||
```
|
||||
|
||||
19. 写出下面的打印结果
|
||||
```
|
||||
alert( 5 % 2 );
|
||||
alert( 8 % 3 );
|
||||
alert( 2 ** 2 );
|
||||
alert( 2 ** 3 );
|
||||
alert( 2 ** 4 );
|
||||
alert( 4 ** (1/2) );
|
||||
alert( 8 ** (1/3) );
|
||||
alert( '1' + 2 );
|
||||
alert( 2 + '1' );
|
||||
alert(2 + 2 + '1' );
|
||||
var x = 1;
|
||||
alert( +x );
|
||||
|
||||
var y = -2;
|
||||
alert( +y );
|
||||
|
||||
// 转化非数字
|
||||
alert( +true );
|
||||
alert( +"" );
|
||||
|
||||
var apples = "2";
|
||||
var oranges = "3";
|
||||
alert( apples + oranges );
|
||||
alert( Number(apples) + Number(oranges) );
|
||||
```
|
||||
20. 运算符优先级
|
||||
21. 下面代码的执行结果为
|
||||
```
|
||||
let a = 1;
|
||||
let b = 2;
|
||||
|
||||
let c = 3 - (a = b + 1);
|
||||
|
||||
alert( a );
|
||||
alert( c );
|
||||
|
||||
```
|
||||
|
||||
```
|
||||
let a, b, c;
|
||||
|
||||
a = b = c = 2 + 2;
|
||||
|
||||
alert( a );
|
||||
alert( b );
|
||||
alert( c );
|
||||
|
||||
let n = 2;
|
||||
n += 5;
|
||||
n *= 2;
|
||||
|
||||
alert( n );
|
||||
|
||||
let n = 2;
|
||||
n *= 3 + 5;
|
||||
alert( n );
|
||||
|
||||
```
|
||||
|
||||
22. 下面代码的打印结果为
|
||||
```
|
||||
alert( true || true ); // true
|
||||
alert( false || true ); // true
|
||||
alert( true || false ); // true
|
||||
alert( false || false ); // false
|
||||
|
||||
```
|
||||
|
||||
```
|
||||
alert( 1 || 0 );
|
||||
|
||||
alert( null || 1 );
|
||||
alert( null || 0 || 1 );
|
||||
alert( undefined || null || 0 )
|
||||
var firstName = "";
|
||||
var lastName = "";
|
||||
var nickName = "SuperCoder";
|
||||
alert( firstName || lastName || nickName || "Anonymous");
|
||||
```
|
||||
23. 下面代码会执行嘛 为什么
|
||||
```
|
||||
true || alert("not printed");
|
||||
false || alert("printed");
|
||||
```
|
||||
|
||||
24. 下面代码的执行结果
|
||||
```
|
||||
alert( 1 && 0 );
|
||||
alert( 1 && 5 );
|
||||
alert( null && 5 );
|
||||
alert( 0 && "no matter what" )
|
||||
alert( 1 && 2 && null && 3 )
|
||||
alert( 1 && 2 && 3 )
|
||||
alert( !!"non-empty string" );
|
||||
alert( !!null );
|
||||
alert( Boolean("non-empty string") );
|
||||
alert( Boolean(null) );
|
||||
alert( null || 2 || undefined );
|
||||
alert( alert(1) || 2 || alert(3) )
|
||||
alert( alert(1) && alert(2) );
|
||||
alert( null || 2 && 3 || 4 );
|
||||
|
||||
```
|
||||
附加
|
||||
游戏开始时，显示12个图像的背面，用鼠标点击其中任意一张，即可显示图像的正面，如果点击了两张，则显示出两张图像的正面。如果点击过的两张图像是相同的图像，则将图像从界面中移除
|
||||
26
js/递归.md
Normal file
26
js/递归.md
Normal file
@@ -0,0 +1,26 @@
|
||||
# 递归
|
||||
|
||||
* 1+2+3+4+....+100(n)求和
|
||||
|
||||
* 输入一个正整数n，输出n!的值。其中n!=123*…*n,即求阶乘
|
||||
|
||||
|
||||
* 一共有n格，每步可以走1格或者2格，问一共有多少走法。
|
||||
*
|
||||
一只青蛙可以一次跳 1 级台阶或者一次跳 2 级台阶，例如：
|
||||
跳上第 1 级台阶只有一种跳法：直接跳 1 级即可。 跳上第 2 级台阶有两种跳法：每次跳 1 级，跳两次；或者一次跳 2 级。 问要跳上第 n 级台阶有多少种跳法？
|
||||
|
||||
|
||||
* 小易准备去魔法王国采购魔法神器,购买魔法神器需要使用魔法币,但是小易现在一枚魔法币都没有,但是小易有两台魔法机器可以通过投入x(x可以为0)个魔法币产生更多的魔法币。
|
||||
魔法机器1:如果投入x个魔法币,魔法机器会将其变为2x+1个魔法币
|
||||
魔法机器2:如果投入x个魔法币,魔法机器会将其变为2x+2个魔法币
|
||||
小易采购魔法神器总共需要n个魔法币,所以小易只能通过两台魔法机器产生恰好n个魔法币,小易需要你帮他设计一个投入方案使他最后恰好拥有n个魔法币
|
||||
|
||||
输入描述：
|
||||
|
||||
输入包括一行,包括一个正整数n(1 ≤ n ≤ 10^9),表示小易需要的魔法币数量。
|
||||
|
||||
输出描述：
|
||||
输出一个字符串,每个字符表示该次小易选取投入的魔法机器。其中只包含字符'1'和'2'。
|
||||
|
||||
比如输入10，返回122
|
||||
178
js/闭包.md
Normal file
178
js/闭包.md
Normal file
@@ -0,0 +1,178 @@
|
||||
# 闭包
|
||||
1. 什么是闭包
|
||||
2. 简述闭包的作用
|
||||
3. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
function fn1() {
|
||||
var name = 'iceman';
|
||||
function fn2() {
|
||||
console.log(name);
|
||||
}
|
||||
fn2();
|
||||
}
|
||||
fn1();
|
||||
|
||||
```
|
||||
|
||||
4. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
function fn1() {
|
||||
var name = 'iceman';
|
||||
function fn2() {
|
||||
console.log(name);
|
||||
}
|
||||
return fn2;
|
||||
}
|
||||
var fn3 = fn1();
|
||||
fn3();
|
||||
|
||||
```
|
||||
|
||||
5. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
function fn1() {
|
||||
var name = 'iceman';
|
||||
function fn2() {
|
||||
console.log(name);
|
||||
}
|
||||
fn3(fn2);
|
||||
}
|
||||
function fn3(fn) {
|
||||
fn();
|
||||
}
|
||||
fn1();
|
||||
```
|
||||
6. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
function waitSomeTime(msg, time) {
|
||||
setTimeout(function () {
|
||||
console.log(msg)
|
||||
}, time);
|
||||
}
|
||||
waitSomeTime('hello', 1000);
|
||||
```
|
||||
|
||||
7. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
for (var i = 1; i <= 10; i++) {
|
||||
setTimeout(function () {
|
||||
console.log(i);
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
8. 怎么才能在第7题中输出 1-10
|
||||
9. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
function module() {
|
||||
var arr = [];
|
||||
function add(val) {
|
||||
if (typeof val == 'number') {
|
||||
arr.push(val);
|
||||
}
|
||||
}
|
||||
function get(index) {
|
||||
if (index < arr.length) {
|
||||
return arr[index]
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
return {
|
||||
add: add,
|
||||
get: get
|
||||
}
|
||||
}
|
||||
var mod1 = module();
|
||||
mod1.add(1);
|
||||
mod1.add(2);
|
||||
mod1.add('xxx');
|
||||
console.log(mod1.get(2));
|
||||
|
||||
```
|
||||
|
||||
10. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var a = 10
|
||||
function foo(){
|
||||
console.log(a)
|
||||
}
|
||||
|
||||
function sum() {
|
||||
var a = 20
|
||||
foo()
|
||||
}
|
||||
|
||||
sum()
|
||||
```
|
||||
|
||||
11. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var n = 10
|
||||
function fn(){
|
||||
var n =20
|
||||
function f() {
|
||||
n++;
|
||||
console.log(n)
|
||||
}
|
||||
f()
|
||||
return f
|
||||
}
|
||||
|
||||
var x = fn()
|
||||
x()
|
||||
x()
|
||||
console.log(n)
|
||||
|
||||
```
|
||||
|
||||
12. 简述闭包形成的原因
|
||||
13. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var a = 0
|
||||
function foo(){
|
||||
var b =14
|
||||
function fo(){
|
||||
console.log(a, b)
|
||||
}
|
||||
fo()
|
||||
}
|
||||
foo()
|
||||
```
|
||||
|
||||
14. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var n = 10
|
||||
function fn(){
|
||||
var n =20
|
||||
function f() {
|
||||
n++;
|
||||
console.log(n)
|
||||
}
|
||||
return f
|
||||
}
|
||||
|
||||
var x = fn()
|
||||
x()
|
||||
|
||||
```
|
||||
|
||||
15. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var a = '林一一'
|
||||
function foo(){
|
||||
var a = 'foo'
|
||||
function fo(){
|
||||
console.log(a)
|
||||
}
|
||||
return fo
|
||||
}
|
||||
|
||||
function f(p){
|
||||
var a = 'f'
|
||||
p()
|
||||
}
|
||||
f(foo())
|
||||
|
||||
```
|
||||
215
js/预编译作用域.md
Normal file
215
js/预编译作用域.md
Normal file
@@ -0,0 +1,215 @@
|
||||
# 预编译作用域练习
|
||||
|
||||
1. 下面代码的执行结果是什么为什么
|
||||
```
|
||||
console.log(x)
|
||||
x=5
|
||||
```
|
||||
|
||||
2. 下面代码的执行结果是什么为什么
|
||||
```
|
||||
console.log(x)
|
||||
var x=5
|
||||
```
|
||||
3. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var x = 5;
|
||||
console.log(x+""+y)
|
||||
var y=5
|
||||
|
||||
```
|
||||
|
||||
4. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
"use strict";
|
||||
x = 3.14;
|
||||
```
|
||||
|
||||
5. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
"use strict";
|
||||
myFunction();
|
||||
|
||||
function myFunction() {
|
||||
y = 3.14; // 报错 (y 未定义)
|
||||
}
|
||||
```
|
||||
|
||||
6. 为什么要使用严格模式
|
||||
7. 总结严格模式的限制
|
||||
8. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
var x = 0.1;
|
||||
var y = 0.2;
|
||||
var z = x + y
|
||||
console.log(z==0.3)
|
||||
```
|
||||
|
||||
9. js有几种类型的作用域 分别是啥
|
||||
10. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
|
||||
function myFunction() {
|
||||
var carName = "porsche";
|
||||
|
||||
console.log(carName)
|
||||
|
||||
}
|
||||
|
||||
```
|
||||
11. 下面代码的执行结果是什么 为什么
|
||||
```
|
||||
|
||||
function myFunction() {
|
||||
var carName = "porsche";
|
||||
}
|
||||
console.log(carName)
|
||||
|
||||
```
|
||||
|
||||
12. js运行三部曲是
|
||||
|
||||
13. 任何变量如果未经声明就赋值 此变量是
|
||||
|
||||
14. 一切声明的全局变量 全是 的属性
|
||||
|
||||
15. 分析下面代码 的预编译执行过程
|
||||
|
||||
```
|
||||
var x = 1,
|
||||
y = z = 0;
|
||||
|
||||
function add (n) {
|
||||
return n = n + 1;
|
||||
}
|
||||
|
||||
y = add(x);
|
||||
function add (n) {
|
||||
return n = n + 3;
|
||||
}
|
||||
|
||||
z = add(x)
|
||||
```
|
||||
|
||||
|
||||
|
||||
16. 函数预编译的步骤
|
||||
|
||||
17. 全局预编译的步骤
|
||||
|
||||
18. 分析下面代码的预编译执行过程
|
||||
|
||||
```
|
||||
function fn(a){
|
||||
console.log(a);
|
||||
var a = 123;
|
||||
console.log(a);
|
||||
|
||||
function a(){};
|
||||
console.log(a);
|
||||
|
||||
var b = function(){};
|
||||
console.log(b);
|
||||
|
||||
function d(){};
|
||||
}
|
||||
|
||||
//调用函数
|
||||
fn(1);
|
||||
```
|
||||
|
||||
|
||||
|
||||
18. 分析下面代码的预编译执行过程
|
||||
|
||||
```
|
||||
var a = 1;
|
||||
console.log(a);
|
||||
function test(a) {
|
||||
console.log(a);
|
||||
var a = 123;
|
||||
console.log(a);
|
||||
function a() {}
|
||||
console.log(a);
|
||||
var b = function() {}
|
||||
console.log(b);
|
||||
function d() {}
|
||||
}
|
||||
var c = function (){
|
||||
console.log("I at C function");
|
||||
}
|
||||
console.log(c);
|
||||
test(2);
|
||||
```
|
||||
|
||||
|
||||
|
||||
19. 为什么会发生变量提升
|
||||
|
||||
20. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
fun();
|
||||
console.log(b);
|
||||
var b = function fun(){
|
||||
var a = 456;
|
||||
console.log(a);
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
21. 下面代码的执行结果是什么 为什么
|
||||
|
||||
```
|
||||
console.log(b);
|
||||
var b = function fun(){
|
||||
var a = 456;
|
||||
console.log(a);
|
||||
}
|
||||
fun();
|
||||
|
||||
```
|
||||
|
||||
22. 什么是执行期上下文
|
||||
|
||||
23. js中有哪几种执行期上下文 分别介绍
|
||||
|
||||
24. 分析下面代码的预编译执行过程
|
||||
|
||||
```
|
||||
global = 100;
|
||||
function fn() {
|
||||
console.log(global);
|
||||
global = 200;
|
||||
console.log(global);
|
||||
var global = 300;
|
||||
}
|
||||
fn();
|
||||
var global;
|
||||
```
|
||||
|
||||
|
||||
|
||||
25. 分析下面代码 预编译执行过程
|
||||
|
||||
```
|
||||
function test() {
|
||||
console.log(b);
|
||||
if (a) {
|
||||
var b = 100;
|
||||
}
|
||||
c = 234;
|
||||
console.log(c);
|
||||
}
|
||||
var a;
|
||||
test();
|
||||
a = 10;
|
||||
console.log(c);
|
||||
|
||||
作者：前端布吉岛
|
||||
链接：https://juejin.cn/post/6933756598678454280
|
||||
来源：掘金
|
||||
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
|
||||
```
|
||||
|
||||
|
||||
Reference in New Issue
Block a user