1、第一个js程序

一个项目包括三部分:前端(html、css、js)、数据库、后端技术

引入方式:页面中直接写,script标签引入

js事件绑定:

<input type="button" value="按钮" onclick="myClick()" />
<input type="button" value="按钮" id="btn"/>
function myClick(){
console.log("点击按钮");
} document.getElementById('btn').onclick=function(ev){
console.log("点击按钮");
}

2、js变量声明规则

var iNum1 = 10;
var sString = "abceelf";
var bFlag = true;
var aNum = [1,2,3,4,5];
var oObject = {name:'marry',age:18};
var fNumber = 10.3;

变量命名规范:

  1)变量的第一个字符必须是字母、下划线_、或$

  2)其余的字符必须是 下划线_ 、字母、数字、或$

  3)不能用js的关键字

  4)驼峰命名法

3、变量转换

var  iNum1 = 10;
var sString = "baude";
// + 作拼接作用,使数字转换成字符串浏览器自动转换的,取toString()方法
iNum1 + sString
//而 -号、*号、/号只能作运算,即将所有数据转换为数字,取Number()方法,如果不能转换则为NaN var bFlag = true;
//布尔值转换为数字1或0
iNum1 + bFlag //把数据转换成数字
var sString2 = “20djaog”;
Number(sString2)//将数字的字符串转换为数字
parseInt(sString2)//将不能转换为止
parseFloat("10.2ajofg")//可以转换浮动型

4、js字符串操作

var  sString = "Hello world";
sString.length //获取字符串长度
sString.charAt(2) //获取字符串指定索引的字符
sString.substring(start,end) //截取字符串从start位置到end位置,如果end缺省则到结尾
sString.substr(start,length) //截取字符串从start位置截取length个字符
sString.indexOf('a',start) // 返回字符串中指定的字符a第一次出现的位置,若无则返回-1;若第二个参数有,则从第二个参数start的位置开始
sString.lastIndexOf('a',start) //从右边到左边查询

5、js数组

//数组声明
var aTeam = new Array(4);
aTeam[0] = "dkop";
...... var aTeam = ["dd","es","ag"]; //数组方法
aTeam.toString(); //默认通过逗号隔开
aTeam.join("_").toString(); //指定通过 _ 隔开
aTeam.reverse().toString() //反序处理 //字符串处理为数组
var sString = "deig_taig_kie_lieng";
sString.split("_") //通过指定字符进行分割,返回一个数组

6、条件判断

  运算:除/ 、取余%

  条件语句

if(条件1){
//第一种情况
}else if(条件2){
//第二种情况
}else{
//剩余情况
} //if语句也可以使用三元运算符等价代替
if(a>b){
c=a;
}else{
c=b;
}
等价于 c = a>b ? a:b;

7、等于号的区别=、==、===

// =是赋值
// ==是不判断类型,会自动转换为相同的类型再进行判断
// ===会先判断类型是否相同
var iNum = 10;
var sNum = ‘10’;
if(iNum == sNum){
//不判断类型
}
if(iNum === sNum){
//判断类型
} //逻辑运算符 &&、 ||、 !

8、循环结构

//while循环
var i = 0;
var iSum = 0;
while(i<101){
//当前的iSum=上次的iSum+当前的i
iSum += i;
i++
}
alert(iSum); //do...while循环
//for循环
var iSum = 0;
for(var i=0;i<101;i++){
iSum += i;
}

9、for循环的嵌套

//9*9乘法表,首先最重要的就是确定各个循环变量的范围
// var i (1~9) var j<i
var sHtml = "<table>";
for(var i = 1;i<=9;i++){
sHtml+="<tr>";
for(var j = 1;j<=i;j++){
sHtml+="<td>"+i+"*"+j+"="+i*j+"</td>";
}
}
sHtml+="</table>";
document.writeln(sHtml); //以下是反向写入页面中
var sHtml = "<table>";
for(var i = 9;i>=1;i--){
sHtml+="<tr>";
for(var j = i;j>=1;j--){
sHtml+="<td>"+i+"*"+j+"="+i*j+"</td>";
}
}
sHtml+="</table>";
document.writeln(sHtml);
//冒泡排序:前面的元素依次和后面的元素进行比较
var aNumber = [10,2,34,4,56,12,45,44,6,12,23,55];
var iNum = 0;
for(var i = 0;i<=aNumber.length-2;i++){
for(var j = i+1;i<=aNumber.length-1;j++){
if(aNumber[i]>aNumber[j]){
iNum = aNumber[i];
aNumber[i] = aNumber[j];
aNumber[j] = iNum;
}
}
}
alert(aNumber); //以下是降序
var aNumber = [10,2,34,4,56,12,45,44,6,12,23,55];
var iNum = 0;
for(var i = 0;i<=aNumber.length-2;i++){
for(var j = i+1;i<=aNumber.length-1;j++){
if(aNumber[i]<aNumber[j]){
iNum = aNumber[i];
aNumber[i] = aNumber[j];
aNumber[j] = iNum;
}
}
}
alert(aNumber);

10、switch语句

    switch(num){
case 1:
alert('星期1');
break;
case 2:
alert('星期2');
break;
case 3:
alert('星期3');
break;
case 4:
alert('星期4');
break;
default:
alert("星期天");
break;
}

11、break、continue和return

    function myClick() {
var iSum = 0;
for(var i=1;i<101;i++){
if(i==5){
//跳出整个循环体,只加到5
// break;
//跳过当前条件的循环,即除去5
// continue;
//结束整个方法体,此外return也可以作为函数的返回值
return;
}
iSum += i;
}
alert(iSum);
}

12、Math对象

    Math.PI;
Math.max(10,32,40);
Math.min(10,32,40);
Math.round(12.59);//四舍五入
Math.ceil(12.1);//向上取整
Math.floor(12.9);//向下取整
Math.random();//获取0~1的随机数,不包括0和1
Math.floor(Math.random()*100+1) //获取1~100之前的整数

13、date对象

    var myData = new Date();
myData.getFullYear();
myData.getMonth()+1;//月是从0开始的,所以要加1
myData.getDay();
myData.getHours();
myData.getMinutes();
myData.getSeconds();

14、setInterval和setTimeout

    function myClick() {
var i=0;
//循环执行
var timer = setInterval(function () {
i++;
if(i==6){
//清除指定的定时器
clearInterval(timer);
}
console.log(i);
},1000); //只执行一次
setTimeout(function () {
i++;
console.log(i);
},1000);
}

js基础知识入门总结的更多相关文章

  1. Js基础知识-入门

    创建脚本块 <script language=”JavaScript”> JavaScript code goes here </script> 隐藏脚本代码 <scri ...

  2. Node.js基础知识

    Node.js入门   Node.js     Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...

  3. [JS复习] JS 基础知识

    项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display  :inline or bloc ...

  4. HTML+CSS+JS基础知识

    HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...

  5. Linux基础知识入门

    [Linux基础]Linux基础知识入门及常见命令.   前言:最近刚安装了Linux系统, 所以学了一些最基本的操作, 在这里把自己总结的笔记记录在这里. 1,V8:192.168.40.10V1: ...

  6. 网站开发进阶(十五)JS基础知识充电站

    JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...

  7. NodeJs>------->>第三章:Node.js基础知识

    第三章:Node.js基础知识 一:Node.js中的控制台 1:console.log.console.info  方法 console.log(" node app1.js 1> ...

  8. Hibernate入门1. Hibernate基础知识入门

    Hibernate入门1. Hibernate基础知识入门 20131127 前言: 之前学习过Spring框架的知识,但是不要以为自己就可以说掌握了Spring框架了.这样一个庞大的Spring架构 ...

  9. JS基础知识笔记

    2020-04-15 JS基础知识笔记 // new Boolean()传入的值与if判断一样 var test=new Boolean(); console.log(test); // false ...

随机推荐

  1. POJ1269(KB13-D 计算几何)

    Intersecting Lines Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 16681   Accepted: 71 ...

  2. vue 相对路径的图片 不显示问题

    例如 data () { return { img: '../../images/jifen/index/img_list_default_pic.jpg' //路径也没问题啊,怎么不显示呢,难道他瞎 ...

  3. vue.js自定义指令详解

    写在文本前:相信在做vue的项目,你肯定接触了指令,我们常用vue内置的一些指令,比如v-model,v-text,v-if,v-show等等,但是这些内置指令不在本文的讲解范畴,本文想说的是其自定义 ...

  4. Python 初识网络

    一. C/S架构:客户端(client)/服务端(server)架构 B/S架构:浏览器(browser) / 服务端(server)架构 软件cs架构: 浏览器,qq,微信等等 硬件cs架构:打印机 ...

  5. JS 的map和array集合组合返回JSON字符串

    使用map 和array 返回自定义对象的JSON字符串: function getObjectJSON() { var array = new Array(); for (var i = 0; i ...

  6. js-ES6学习笔记-Symbol

    1.ES6引入了一种新的原始数据类型Symbol,表示独一无二的值.它是JavaScript语言的第七种数据类型,前六种是:Undefined.Null.布尔值(Boolean).字符串(String ...

  7. AppManager

    1.统一应用程序中所有的Activity的栈管理  涉及到activity的添加.删除指定.删除当前.删除所有.返回栈大小的方法 public class AppManager { private S ...

  8. vs2017安装cuda9.0编译默认示例失败解决方法

    https://devtalk.nvidia.com/default/topic/1027209/cuda-setup-and-installation/cuda-9-0-does-not-work- ...

  9. 用例设计之API用例覆盖准则

    基本原则 本文主要讨论API测试的用例/场景覆盖,基本原则如下: 用户场景闭环(从哪来到哪去) 遍历所有的实现逻辑路径 需求点覆盖 覆盖维度 API协议(参数&业务场景) 中间件检查 异常场景 ...

  10. MiUI开发者版刷入xposed框架--简洁方法

    一,首先要确定手机是否解锁 可以去这里查看怎么解锁: http://www.miui.com/unlock/index.html 二,手机系统需要是开发者版,且在安全中心的授权管理打开了ROOT授权 ...