js基础知识1
本博客转自某不知名程序员
1.
JavaScript基础分为三个部分：
ECMAScript：JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。
DOM：操作网页上的元素的API。比如让盒子移动、变色、轮播图等。
BOM：操作浏览器部分功能的API。比如让浏览器自动滚动。
PS：JS机械重复性的劳动几乎为0，基本都是创造性的劳动。而不像HTML、CSS中margin、padding都是机械重复劳动。
2.第一个js
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <script type="text/javascript">
7 var a = 2;
8 var b ;
9 b = 3;
10 var c = "3";
11 console.log(a);
12 console.log(b);
13 console.log(c);
14 typeof 检查数据类型
15 console.log(typeof a);
16 console.log(typeof c);
17 字符串和数字相加会将数值隐式转换
18 隐式转转>>数字类型转换成字符串
19 console.log(a+c);
20 console.log(a+"");
21 警告又出框
22 alert("账期");
23 用户输入
24 var a = prompt("今天什么天气");
25 console.log(a);
26 没有被定义不可以被找到
27 var e ;log()
28 console.log(e);
29 console.log(typeof e);
30 console.log("我"+"哎")
31 parseInt 是将字符串转换成数字
32 console.log(parseInt(c));
33 字符串-数值=数值
34 console.log(c-a);
35 console.log(parseInt("2015你在哪 "));
36 var a1 = 5/0;
37 console.log(a1);
38 console.log(typeof a1);
39 当在小数转换成整数的时候只取整数一位
40 var d = parseInt(5.75)+parseInt(8.66);
41 console.log(d)
42
43
44 </script>
45 </head>
46 <body>
47
48 </body>
49 </html>
3.算数运算符 ++ --
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <script type="text/javascript">
7
8 var a = 5;
9 var x = a++;
10 控制台先将a身的值赋给x输出5,然后运行a++输出6
11 console.log(a);
12 console.log(x);
13 先进行a++,在赋值
14 var x = ++a;
15 console.log(a);
16 console.log(x);
17
18
19 </script>
20 </head>
21 <body>
22
23 </body>
24 </html>
4.比较
1 var a = 2;
2 var b = "2";
3 //比较的是数值
4 console.log(a==b);
5 //比较的是数值和类型
6 //返回ture或false
7 console.log(a===b);
8 console.log(a!=b);
5.强制类型转换
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <script type="text/javascript">
7
8 var name = "中国";
9 var am = "美军";
10 //拼接用${} ` ` 或 "+name+"
11 var str = `2003年3月20日,${name}战争爆发，以${am}为主的联合部队仅用20多天就击溃了萨达姆的军队。这是继十多年前的海湾战争后，美军又一次取得的大规模压倒性军事胜利。`;
12 console.log(str)
13
14 var a = 123;
15 //强制类型转换为字符串
16 var astr = String(a);
17 console.log(astr);
18 console.log(typeof (astr));
19 //强制转换成为字符串 如果后面有dada会提示NAN
20 var stringNum = '789.123';
21 var num2 = Number(stringNum); //NaN
22 console.log(num2);
23 //Boolean 非零即真
24 var b1 = NaN;
25 console.log(Boolean(b1));
26
27 </script>
28 </head>
29 <body>
30
31 </body>
32 </html>
6.switch语句
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <script type="text/javascript">
7 var age = 18;
8 //switch 依次匹配 遇到break退出循环
9 switch (age) {
10 case 18:
11 console.log("成年了");
12 break;
13 case 16:
14 console.log("上学了");
15 break;
16 case 80:
17 console.log("城A级");
18 break;
19 default:
20 console.log("和遗憾")
21
22 }
23
24 </script>
25 </head>
26 <body>
27
28 </body>
29 </html>
7.循环 while for
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6
7 </head>
8 <body>
9 <script type="text/javascript">
10 <!--初始化循环变量-->
11 var a = 1;
12 while (a<10){
13 //判断循环条件
14 console.log(a);
15 //更新循环变量
16 a++;
17 }
18 var b = 3;
19 do{
20 console.log(b);
21 b++;
22 }while (b<10);
23 for (var i =0;i<5;i++ ){
24 console.log(i);
25 }
26
27 for(var i = 0; i < 5; i++){ //控制行数
28 for(var j = 0; j < 10; j++){//控制的每行的*数
29
30 document.write('*');
31 }
32 document.write('<br>');
33 }
34
35
36
37
38
39 </script>
40
41 </body>
42 </html>
8.关于数组
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 </head>
7 <body>
8 <script type="text/javascript">
9 var color = ["red","yellow","blue"];
10 console.log(color);
11 var arr=[];
12 //数组的赋值
13 arr[0] = 122;
14 arr[1] = "哈啊哈";
15 arr[2] = "嘿嘿嘿";
16 console.log(arr);
17
18
19 var north = ['北京','山东','天津'];
20 var south = ['东莞','深圳','上海'];
21 //数组的合并
22 var newCity = north.concat(south);
23 console.log(newCity);
24
25
26 var socre = [77,88,99,10];
27 //转换成字符串
28 var str = socre.toString();
29 console.log(str);
30
31 var ar = ['张三','李四','王文','赵六'];
32 //slice 左开右闭
33 var newar = ar.slice(1,3);
34 console.log(newar);
35
36 var Aarr = ['张三','李四','王文','赵六'];
37 //在数组后面添加一个字符串
38 var newArr = Aarr.push('小马哥');
39 console.log(newArr);//["张三", "李四"，"王文"，"赵六"，"小马哥"]
40
41 //移出数组的第一个元素
42 ar.shift();
43 console.log(ar);
44
45 //在数组前面添加第一个元素
46 ar.unshift("张庆");
47 console.log(ar);
48 //利用循环将ar document打印在页面上
49 for (var i= 0;i <ar.length; i++){
50 console.log(ar[i]);
51 document.write(arr[i]+'1');
52 }
53
54
55
56
57
58
59
60
61
62
63 </script>
64
65 </body>
66 </html>
9.关于字符串的功能
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 </head>
7 <body>
8 <script type="text/javascript">
9 var str = 'alex';
10 //进行索引查找 从0开始
11 console.log(str.charAt(1))
12 var str1 = new String();
13 console.log(str1);
14
15 //split分割成字符串 用逗号隔开
16 var str2 = '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
17 console.log(str2.split('a'));
18
19 //teim去除两边空格
20 var str3 = ' alex ';
21 console.log(str3.trim());
22
23 </script>
24
25 </body>
26 </html>
js基础知识1的更多相关文章
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- HTML+CSS+JS基础知识
HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...
- Node.js基础知识
Node.js入门 Node.js Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...
- 网站开发进阶(十五)JS基础知识充电站
JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...
- NodeJs>------->>第三章：Node.js基础知识
第三章:Node.js基础知识 一:Node.js中的控制台 1:console.log.console.info 方法 console.log(" node app1.js 1> ...
- JS基础知识笔记
2020-04-15 JS基础知识笔记 // new Boolean()传入的值与if判断一样 var test=new Boolean(); console.log(test); // false ...
- js基础知识--BOM
之前说过,在js的 运行环境为浏览器时,js就主要有三部分组成: ECMAScript核心语法.BOM.DOM.今天就和大家详细说一下BOM的一些基础知识. BOM BOM通常被称为浏览器对象模型,主 ...
- JS基础知识总结
js基础知识点总结 如何在一个网站或者一个页面,去书写你的js代码:1.js的分层(功能):jquery(tool) 组件(ui) 应用(app),mvc(backboneJs)2.js的规划() ...
- js基础知识温习：Javascript中如何模拟私有方法
本文涉及的主题虽然很基础,在很多人眼里属于小伎俩,但在JavaScript基础知识中属于一个综合性的话题.这里会涉及到对象属性的封装.原型.构造函数.闭包以及立即执行表达式等知识. 公有方法 公有方法 ...
- js基础知识总结（2016.11.1）
js基础知识点总结 如何在一个网站或者一个页面,去书写你的js代码:1.js的分层(功能):jquery(tool) 组件(ui) 应用(app),mvc(backboneJs)2.js的规划():避 ...
随机推荐
- web端自动化——webdriver驱动
1.1Edge浏览器(不过,Edge浏览器只能运行于 Windows 10) Edge驱动的下载地址,复制链接http://go.microsoft.com/fwlink/?LinkId=619687 ...
- iOS-UITableView的性能优化10个小技巧
通常你会发现一个图片类的app会在一个imageView上做下面这些事情: 1 下载图片(主要的内容图片+用户头像图片)2 更新时间戳3 展示评论4 计算动态的cell的高度 Tip#1 学习 ...
- 常见问题:MySQL/排序
MySQL的排序分为两种,通过排序操作和按索引扫描排序. 按索引顺序扫描是一种很高效的方式,但使用的条件较为严格,只有orderby语句使用索引最左前列,或where语句与orderby语句条件列组合 ...
- 微信小程序之一：动态添加view（view包含picker,input）
<view wx:for="{{array}}" wx:key="this" class="borderContainer"> ...
- 关于tomcat9的startup.bat闪退问题&乱码
1.打开apache-tomcat-9.0.22的bin目录 选择图中文件 记事本打开 2.更改文件 setclasspath.bat .0_172\jre 3.保存 startup ----- ...
- RHEL 6.5 安装Docker
一,配置远程yum源二,下载依赖包1.安装downloadonly插件使用yum下载rpm包2.下载docker需要的依赖包三,安装docker(离线节点)1. 依次执行docker的安装包2. 启动 ...
- docker 实践四：数据管理
这篇是关于 docker 的数据管理. 注:环境为 CentOS7,docker 19.03. 一般容器中管理数据主要有两种方式: 数据卷(Data Volumes):容器内数据直接映射到本地主机环境 ...
- javascript-state-machine
import StateMachine from 'javascript-state-machine' import EventEmitter from 'events' /** * 上传的文档的状态 ...
- 简单即时通讯、聊天室--java NIO版本
实现的功能: 运行一个服务端,运行多个客户端.在客户端1,发送消息,其余客户端都能收到客户端1发送的消息. 重点: 1.ByteBuffer在使用时,注意flip()方法的调用,否则读取不到消息. 服 ...
- Python中的单例模式的几种实现方式和优化以及pyc文件解释（转）
原文:https://www.cnblogs.com/huchong/p/8244279.html 另一篇关于.pyc文件是什么? 原文: http://blog.sina.com.cn//s/bl ...