WEB全栈学习笔记-JS

黄生 发表于 2020/09/06 22:21:00 2020/09/06
【摘要】 本周是前端三大件之第二件JavaScript的学习的第一周2020年07月19日 星期日 22时33分40秒 JS基础不是雨神老师,而是黑马的视频,我学习下来,觉得老师讲的也很好,也很有趣。而且对于关联的系统知识、历史背景也有介绍,是很系统的教程。第一章 JS基础1.语言的分类,HTML是标记语言,而JS是编程语言,再分,是解释型语言(翻译一行执行一行,报错则停止),而不是编译型语言科普背景...


本周是前端三大件之第二件JavaScript的学习的第一周

2020年07月19日 星期日 22时33分40秒 
JS基础不是雨神老师,而是黑马的视频,我学习下来,觉得老师讲的也很好,也很有趣。
而且对于关联的系统知识、历史背景也有介绍,是很系统的教程。
第一章 JS基础
1.语言的分类,HTML是标记语言,而JS是编程语言,再分,是解释型语言(翻译一行执行一行,报错则停止),而不是编译型语言
科普背景知识:计算机组成、存储单元等。JS的发明历史,与Java的关系(就是没有关系)
JS的历史上的最早应用只是做表单校验,而现在是前途远大,前后端都可以做
浏览器的内核/渲染引擎(负责HTML/CSS),和JS引擎(负责JS)
JS有ECMA语法和API(DOM&BOM)组成
JS可以写在三个位置:行内(元素内)、内嵌(<head><script>下)、外部(src属性引用)
教程里主要使用的内嵌
2.基础概念和语句:变量、声明+赋值=初始化、弱类型(很神奇,变量的类型在运行时决定)、输入输出语句(alert/console.log/prompt)
然后是数据类型,以及chrome里输出的颜色的区分、布尔型、类型的隐士转换(在做算数计算时、要对比字符串接符+
来学)、typeof 关键字的用处。
还有一下些特殊值如NaN(Not a Number)/Infinity/null/undefined/''等,还有字符型的length属性,转换方法toString(),parseInt()等。
知识点比较细碎,需要仔细掌握。

第二章 运算符
1.避免浮点直接运算,有误差。全等===的概念。算术、逻辑、赋值运算符。逻辑里的短路运算的概念。
2.流程控制-分支:if\ifelse\switch. 三元运算符的写法,简洁实现if else的效果。
第三章 循环
1.for;while;do..while
2.应用:倒三角星;九九乘法口诀
第二章、第三章记得比较简单,是因为我有一些基础。老师讲到:知难行易,和知易行难。
对于我来说,不知道怎么写代码,或者知道怎么写,下手时却写不出来。这2种情况都有过,说明自己的火候有不到的地方,需要多学多练。



本周是前端三大件之第二件JavaScript的学习的第二周,老师仍然是黑马的pink老师

2020年07月28日 星期二 00时08分48秒 
本周内容有:数组、函数、对象
1.数组
应用场景:求最大值。核心算法用很形象的说法,是每次2个人打擂台,赢的是擂主,再打...输的就下,最后台上的是最大。
解决应用场景的思路:首先是分析,人类进行分析,自然是用人类语言; 分析完成后,要转换为数学语言,找到规律,然后再动手编码。
应用场景:翻转数组、冒泡排序。这里说一下冒泡,是泡泡一个位置一个位置的挪动,第一次把最那个的数挪到位,第二次把次那个的数挪到位,...最那个,就是指最大或最小。细节一下说不到位,要细品。
2.函数
目的是重复执行。封装的是重复的代码。那和循环有什么差异呢?这个好好想想
函数一般取名用动词。形参和实参,当他们个数不匹配时;函数的返回,当没有return时
只能返回一个值,当想返回多个值时。好好想想吧
函数的内置对象,arguments 像数组;应用场景:求任意个数的最大值。
另一种声明方式:函数表达式(匿名函数)
其实函数要多想多练:有普通函数、函数表达式(匿名函数)、对象里的方法(也是用匿名函数)、对象的构造函数;这么多,要明白区别和关联
作用域、作用域链、
预解析,这个是对解释语言处理的深入理解,代码先预解析,然后再执行(这个阶段才对应之前学的所谓解释一行,执行一行)
那么在预解析,有声明提升的动作(var function)
3.对象
对象的创建方法有 1字面量 2new Object() 3构造函数。显然3更合适创建大量的对象。
构造函数封装的对象,类似java类。调用new类似java的实例化。这里有一个有趣的理解方式
当new 和 构造函数名 确认了眼神,他们就在一起,然后生了宝宝,叫做this,执行代码成长,并返回回报父母
遍历对象(无序)的方法
JS的对象有:自定义、内置、浏览器对象
MDN查阅方法。内置对象:Math/Date/Array/String
简单/复杂数据类型、栈和堆
内置对象这里面知识小点很多,应用场景也很丰富。但今天比较晚了,记得比较乏味就不一一记录了。使用时查阅即可。

感想:
js只所以能蓬勃发展、拓展领域,前途无量,从这几天的学习来看,js语言本身的品格,是一个决定因素
js语言的品格非常好,虽然最开始使用在前端只是小打小闹,后来终能成大器。
品格不好,虽然一时辉煌,难免没落,一蹶不振。

本周是学习AJAX的第一周。实话实说,雨神老师讲HTML和CSS比本周要更精彩。

1.AJAX初识
AJAX的发音。2种发音的来源和使用场合。其实是微软初创的,但由GOOGLE慧眼识珠并发扬光大。
所以说微软只会抄袭捡漏也是不准确的
AJAX的应用场景:异步的,化整为零的提交;一部分一部分的加载数据
讲了TCP/IP的5层协议栈;数据链路层-交换机;网络层-路由器
HTTP是无状态协议。要消除误解:客户端和服务但一直保持连接状态

2.Node.js
来源是Ryan Dahl要选择一种高级语言。要用异步。现实中开发者写了同步模式就不想再动异步,很自然,有简单的方式实现一般没人愿意去做更难的方式
所以选择了JS,它只支持异步,没的选,这下搞定。基于chrome v8 引擎建立JS运行时环境,使得JS脱离了浏览器环境,走向了后端
搭建Web框架:install node.js; 安装脚手架 npm/cnpm install koa-generator -g;npm install -g cnpm --registry=https://registry.npm.taobao.og
这里华为应该也有自己的node.js库镜像;但淘宝做的比较早吧,就用它的cnpm; 创建项目 koa2 ajax; npm start 默认端口3000 调用的app.js 端口在bin/www理定义

3.解密ajax
4步走:1new 2open 3send 4onreadystatechange
跨域的JSONP方法介绍

总结:
前端后端的开发都讲到了。要好好实践一下,后端复用前端的JS语言,节约了学习成本


本周是学习AJAX的第二周。雨神老师讲到第二周,感觉又熟悉了。第一周突然从Pink老师换到雨神老师,还有一点的不适应。

4.jQuery中的AJAX
$就是jquery的缩写。jquery的理念是write less, do more。这个确实得到了践行。比如
$只是一个符号字母,却能代表jquery一个单词;难道不算写的少,做的多吗?哈哈
get和post是最常用的方法,所以write less的形式是:
$.get(url,data,callback,type)
$.post(url,data,callback,type)
而最基本的方法是
$.ajax(option) option是JSON格式的配置参数
complete: 不管成功或失败的请求完成后的回调函数
有点像java里try catch里面的finally

5.Ajax实战
实战的案例是做一个登陆页面
老师一步一步的细心的讲了怎么操作
怎么一步一步完全用原生的javascript编写和jquery里ajax封装的一样效果的实现方法
完成了自己的ajax方法,包含get和post
这是一个很了不起的成就
很有获得感

总结:
师傅领进门,修行看个人。
后面要多实践,多操练,搞熟一点。


【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区),文章链接,文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件至:cloudbbs@huaweicloud.com进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容。
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。