12-2 js基础
一 数据类型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>数据类型</title>
</head>
<body>
<script> var a=123;
console.log(typeof a);
//string
var b='';
console.log(typeof b);
//boolean
var c=false;
console.log(typeof c);
//null
var d=null;
console.log(d);
//undefined未定义
var d1;
console.log(typeof d1) </script> </body>
</html>
二 数据类型转换
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>数据类型转换</title>
</head>
<body>
<script>
//隐式转换
// var n1=123;
// var n2='';
// var n3=n1+n2;
// console.log(typeof n3);//字符串类型
//强制类型转换
// var str1=String(n1);
// console.log(str1,typeof str1);//强制转换成字符串
// var num=234;
// console.log(num.toString());//转成字符串
//将字符串类型转换成数值类型
// var stringNum='789.12113kjk';
// var num2=Number(stringNum);
// console.log(num2,typeof num2);//NaN "number"
// console.log(parseInt(stringNum));//789 只保留整数部分
// console.log(parseFloat(stringNum));//789.123 保留数字部分
//转换成boolean类型
var b1='';
var b2=0;
var b3=-123;
var b4=Infinity;
console.log(typeof b1);
console.log(typeof b2);
console.log(typeof b3);
console.log(typeof b4);//number
console.log(typeof b5);//mumber
console.log(typeof b7);//object
console.log(Boolean(b7));//false console.log(Boolean(b4));//true
//下面三个都是为false
var b5 = NaN; var b6; //undefined
var b7 = null; </script> </body>
</html>
三 常用内置对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常用内置对象</title>
</head>
<body>
<script>
//---------- 数组array创建---------------------------------
// var arr=[1,2,3];
// console.log(arr);
// 数组赋值
// arr[0]=1234;
// arr[1]='呵呵';
// arr[2]='嘿嘿';
// -----数组的常用方法------
// concat合并数组
// var north = ['北京','山东','天津'];
// var south = ['东莞','深圳','上海'];
// var newCity = north.concat(south);
// console.log(newCity); // ["北京", "山东", "天津", "东莞", "深圳", "上海"]
// join() 将数组中的元素使用指定的字符串连接起来,它会形成一个新的字符串
// var score = [98,78,76,100,0];
// var str = score.join('|');
// console.log(str);//98|78|76|100|0
// 将数组转换成字符串 toString()
// var score = [98,78,76,100,0];
//toString() 直接转换为字符串 每个元素之间使用逗号隔开
// var str = score.toString();
// console.log(str);//98,78,76,100,0
// slice(start,end); 返回数组的一段,顾头不顾尾
// var list= ['','','','']; //list不能写成name,不知道是什么原因
// var newArr = list.slice(1,3);
// console.log(newArr); // pop 移除数组的最后一个元素
// var arr = ['张三','李四','王文','赵六'];
// var newArr = arr.pop();
// console.log(arr);//["张三", "李四","王文"] // push() 向数组最后添加一个元素
// var arr = ['张三','李四','王文','赵六'];
// var newArr = arr.push('张三丰');
// console.log(arr);//["张三", "李四", "王文", "赵六", "张三丰"] // ---reverse()翻转数组------
// var arr1 = ['张三','李四','王文','赵六'];
// arr1.reverse();
// console.log(arr1);//["赵六", "王文", "李四", "张三"] // sort对数组排序
// var names = ['alex','xiaoma','tanhuang','abngel'];
// names.sort();
// console.log(names);// ["abngel", "alex", "tanhuang", "xiaoma"] //isarray()判断是否是数组
// var arr1 = ['张三','李四','王文','赵六'];
// console.log(Array.isArray(arr1)); //true
//
// var a=3;
// console.log(Array.isArray(a)); //false
// --------------字符串----------------------
// chartAt() 返回指定索引的位置的字符
// var str='alex';
// var charset=str.charAt(3);
// console.log(charset);
// concat 返回字符串值,表示两个或多个字符串的拼接
var str1 = 'al';
var str2 = 'ex';
console.log(str1.concat(str2,str2));//alexex
// replace(a,b) 将字符串a替换成字符串b
// var a = '';
// var newStr = a.replace("","****");//把4567替换成****
// console.log(newStr);//123****755
// indexof() 查找字符的下标,如果找到返回字符串的下标,找不到则返回-1 。跟seach()方法用法一样
// var str = 'alex';
// console.log(str.indexOf('e'));//2
// console.log(str.indexOf('p'));//-1
// slice(start,end) 左闭右开 分割字符串
var aa='你是谁';
console.log(aa.slice(1,2));//是
// split('a',1) 以字符串a分割字符串,并返回新的数组。如果第二个参数没写,表示返回整个数组,如果定义了个数,则返回数组的最大长度
// var str = '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
// console.log(str.split('a',2));
// substr(statr,end) 左闭右开,可以显示从那到哪,顾头不顾尾
// var str = '我的天呢,a是嘛,你在说什么呢?a哈哈哈';
// console.log(str.substr(0,6));//我的天呢
// toLowerCase()转小写
// var str = 'XIAOMAGE';
// console.log(str.toLowerCase());//xiaomage
// toUpperCase()转大写
// var str4 = 'xiaomage';
// console.log(str4.toUpperCase());
// 数字转换字符串
// var num = 132.32522;
// var numStr = num.toString();
// console.log(typeof numStr);//string
// 四舍五入
// var newNum = num.toFixed(2);
// console.log(newNum); // #####################data日期对象##############################
var mydate=new Date();
console.log(mydate); //Tue Jul 10 2018 15:58:05 GMT+0800 (中国标准时间)
console.log(mydate.getDate());//获取当前日期具体是哪天
//返回本地时间
console.log(mydate.toLocaleDateString());//2018/7/10
console.log(mydate.getFullYear());//只获取年份
console.log(mydate.getMonth()+1);//获取当前月份,必须加1 // ################math内置对象##############
// Math.ceil() 向上取整,'天花板函数'
var x = 1.234;
//天花板函数 表示大于等于 x,并且与它最接近的整数是2
var a = Math.ceil(x);
console.log(a);//2
// Math.floor 向下取整,'地板函数'
var y = 1.234;
// 小于等于 x,并且与它最接近的整数 1
var b = Math.floor(y);
console.log(b);//1
// 求两个数的最大值和最小值
console.log(Math.max(2,5));//5
console.log(Math.min(2,5));//2
// 随机数 Math.random()
var ran = Math.random();
console.log(ran);//0.3176434165181341
// 求100-200之间的随机数
//min+Math.random()*(max-min)公式背过
console.log(Math.floor(100+Math.random()*(100))); </script> </body>
</html>
四运算符
赋值运算符
算数运算符
比较运算符
实例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>运算符</title>
</head>
<body>
<script>
// 赋值运算符
// var x=12;
// var y=5;
// // x+=y;
// // x=x+y;
// x=x*y;
// console.log(x)
// 算数运算符
// var a=5,b=2;
// var c =a+b;
// console.log(c)
// var x=a++;
// console.log(x);//5
// console.log(a);//6
// var d=a--;
// console.log(d);//5
// console.log(a);//4
// 比较运算符
// var x=5;
// console.log(x==='');//false
// var a1='';
// var a2='';
// console.log(a1+a2);//12
// var n1=133;
// var str1=String(n1);
// console.log(typeof str1);//字符串
var stringNum = '1233.33yudasdiusaudsaugd';
var num2=Number(stringNum);
console.log(num2);//NaN
console.log(parseInt(stringNum));//1233
console.log(parseFloat(stringNum));//1233.33 </script> </body>
</html>
五 流程控制
实例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>流程控制</title>
</head>
<body>
<script>
// 判断语句
// var ji=20;
// if(ji>20){
// console.log('吃鸡成功')
// }
// else if(ji=20){
// console.log('差一点吃到')
// }
// else{
// console.log('吃鸡失败')
// }
// 逻辑与和逻辑或
// sum=300;
// math=99;
// // &&两个条件都要满足
// if(sum>400 && math>90){
// console.log('录取成功')
// }
// else{
// console.log('高考失利')
// }
// // ||或只满足一个条件即可
//
// if(sum>400 ||math>90){
// console.log('录取成功')
// }
// else{
// console.log('高考失利')
// }
// switch语法
// var gameScore = 'good';
//
// switch(gameScore){
//
// //case表示一个条件 满足这个条件就会走进来 遇到break跳出。break终止循环。如果某个条件中不写 break,
// // 那么直到该程序遇到下一个break停止
// case 'good':
// console.log('玩的很好');
// //break表示退出
// break;
// case 'better':
// console.log('玩的老牛逼了');
// break;
// case 'best':
// console.log('恭喜你 吃鸡成功');
// break;
//
// default:
// console.log('很遗憾');
//
// }
// while循环
// var i =1;
// while(i<=9){
// console.log(i);
// i=i+1;
// }
// 打印出1-100内的偶数
// var a=0;
// while (a<100){
// a=a+1;
// if (a%2==0){
// console.log(a);
// }
// }
// do while语法 不管有没有满足while中的条件do里面的代码都会走一次
// var i=13;
// do{
// console.log(i);
// i++
// }while (i<10)
//
// for 循环
// for (var i=1;i<10;i++){
// console.log(i)
// }
// for (var i=1;i<100;i++){
// if (i%2==0){
// console.log(i)
// document.write(i)
// }
// document.write('<br>')
// }
// #求1-100直接的之和
// var sum=0;
// for (var j=1;j<=100;j++){
// sum=sum+j;
// }
// console.log(sum)
//
// 双重for循环
// for(var i=1;i<=3;i++){
// for (var j=0;j<6;j++){
// document.write('*')
// }
// document.write('<br>')
// }
</script> </body>
</html>
六 函数和伪数组arguments
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>函数</title>
</head>
<body>
<script>
sayHello(); //调用函数 .js调用的时候顺序可以随便写
//定义函数:
function sayHello(){
console.log("hello world");
} // 函数的形参和实参
// sum(3,4);//7
// sum("",4);//34
// sum("Hello","World");//helloworld
//
// //函数:求和
// function sum(a, b) {
// console.log(a + b);
// }
// 函数的返回值
// function sum(a,b) {
// return a+b;
// }
// console.log(sum(3,0));
//#########伪数组arguments############
// arguments代表的是实参。有个讲究的地方是:arguments只在函数中使用。
// (1)返回函数实参的个数:arguments.length
// fn(2,4);
// fn(2,4,6);
// fn(2,4,6,8);
//
// function fn(a,b,c) {
// // console.log(arguments);
// console.log(fn.length); //获取形参的个数
// console.log(arguments.length); //获取实参的个数
//
// console.log("----------------");
// } // arguments可以修改元素,但不能改变数组的长短
// fn(2,4);
// fn(2,4,6);
// fn(2,4,6,8);
//
// function fn(a,b) {
// console.log(arguments)
// arguments[0] = 99; //将实参的第一个数改为99
// // arguments.push(8); //此方法不通过,因为无法增加元素
// } // 清空数组的几种方式
// var array = [1,2,3,4,5,6];
// console.log(array);
//
// // array.splice(0); //方式1:删除数组中所有项目
// // array.length = 0; //方式1:length属性可以赋值,在其它语言中length是只读
// array = []; //方式3:推荐 // function add() {
// console.log(arguments);
// for(var i=0; i<arguments.length;i++){
// console.log(arguments[i]);
// }
// }
// add('',2,3);
console.log(window);
console.log(document);
console.log(document.documentElement);
console.log(document.body); </script> </body>
</html>
12-2 js基础的更多相关文章
- js基础到精通全面教程--JS教程
适合阅读范围:对JavaScript一无所知-离精通只差一步之遥的人 基础知识:HTML JavaScript就这么回事1:基础知识 1 创建脚本块 1: <script language=”J ...
- Web3D编程入门总结——WebGL与Three.js基础介绍
/*在这里对这段时间学习的3D编程知识做个总结,以备再次出发.计划分成“webgl与three.js基础介绍”.“面向对象的基础3D场景框架编写”.“模型导入与简单3D游戏编写”三个部分,其他零散知识 ...
- JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象
前 言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...
- JS基础 复习: Javascript的书写位置
爱创课堂JS基础 复习: Javascript的书写位置复习 js书写位置:body标签的最底部.实际工作中使用书写在head标签内一对script标签里.alert()弹出框.console.log ...
- js基础——运算符
爱创课堂前端培训--js基础 运算符一.运算符 运算符(Operators,也翻译为操作符),是发起运算的最简单形式.分类:(运算符的分类仁者见智,本课程进行一下分类.)数学运算符(Arithmeti ...
- js基础进阶--关于Array.prototype.slice.call(arguments) 的思考
欢迎访问我的个人博客:http://www.xiaolongwu.cn Array.prototype.slice.call(arguments)的作用为:强制转化arguments为数组格式,一般出 ...
- js基础--javaScript数据类型你都弄明白了吗?绝对干货
欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...
- JS基础学习1
1 JS 概述 一个完整的javascript实现是由以下3个不同部分组成的: (1) 核心(ECMAscript) (2) 文档对象模型(DOM) Document object ...
- 前端面试题目汇总摘录(JS 基础篇)
JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string typeof null; // o ...
- day51 JS基础
复习 1.字体图标 用i标签, 设置类名, 与第三方字体图标库进行图标匹配 <link rel="stylesheet" href="font-awesome-4. ...
随机推荐
- ACMer之歌
<<死了都要编>> 死了都要编 不动态规划不痛快 算法多深只有这样 才足够表白 死了都要编 不A星算法不痛快 宇宙毁灭星还在 把每天当成是比赛来编程 一分一秒都编到汗水掉下来 ...
- 读书笔记--Apache.Tomcat.6高级编程 目录
1.Apache Tomcat 2.web的应用:Servlet.JSP及其他 3.Tomcat安装 4.Tomcat架构 5.Tomcat基本配置 6.高级Tomcat特性 7.Web应用程序配置 ...
- mybatis深入理解(六)-----MyBatis的二级缓存的设计原理
MyBatis的二级缓存是Application级别的缓存,它可以提高对数据库查询的效率,以提高应用的性能.本文将全面分析MyBatis的二级缓存的设计原理. 1.MyBatis的缓存机制整体设计以及 ...
- 各种语言web性能简单对比测试
忽然想比较一下 python nodejs go 的web 响应,就简单的写了个性能对比测试. 测试目标:1 . i5 4核 32G 同一机器 linux 2. 用python(flas ...
- webstorm之Monokai-Sublime主题颜色设置方法及激活注册码
打开https://github.com/OtaK/jetbrains-monokai-sublime 链接,然后点击右边的下载ZIP文件即可.解压之后,会得到一个Monokai-Sublime.ja ...
- Oracle中Function学习2
上一节说函数 这回聊一下 存储过程:有了上节知识点,对这个也许会一种小感觉.呵呵 过程(存储过程):与过程相比, 存储过程是存在数据库中的一个对象 我主要通过例子来了解 不做多解释 相信你也能明白: ...
- linux系统服务
系统服务分类,根据其使用的方法来分,可以被分为三类 a.由init控制的服务:基本都是系统级别的服务,运行级别这一章讲的就是这一类的服务 b.由System V启动脚本启动的服务:和我们打交道最多的一 ...
- LINUX下C++编程如何获得某进程的ID
#include <stdio.h> #include <stdlib.h> #include <unistd.h> using namespace std; pi ...
- hdu 2087剪花布条 (KMP入门 子串出现的次数和子串个数)
剪花布条 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- Leetcode704.Binary Search二分查找
给定一个 n 个元素有序的(升序)整型数组 nums 和一个目标值 target ,写一个函数搜索 nums 中的 target,如果目标值存在返回下标,否则返回 -1. 示例 1: 输入: num ...