01-JS基础(数据类型)

javascript基础一

JavaScript和ECMAScript的关系

ECMAScript不是一门语言，而是一个标准

符合这个标准的比较常见的有：JavaScript、Action Script（Flash中用的语言）

最新标准是ECMAScript 6版本，即ES6,语言的能力更强,node.js完美支持

js组成

js是一款运行在客户端的网页编程语言。

组成部分

ecmascript js标准 js基础语法
dom 通过js操作网页元素 网页中的任意标签被称为dom元素
bom 通过api操作浏览器

特点

解释执行,基于对象,大小写敏感

引入方式

内部引入:

<pre spellcheck="false" class="md-fences md-end-block ty-contain-cm modeLoaded" lang="javascript" contenteditable="true" cid="n26" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit; color: rgb(51, 51, 51); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><script>
var user = {
name: '张三',
age: 20,
sex: true
}
console.log(typeof user); // 显示为object(对象)
</script></pre>

外部引入:

<pre spellcheck="false" class="md-fences md-end-block ty-contain-cm modeLoaded" lang="javascript" contenteditable="true" cid="n28" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit; color: rgb(51, 51, 51); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><script src="main.js"></script></pre>

输出内容

alert()

在页面弹出一个对话框，早期JS调试使用。

confirm()

在页面弹出一个对话框, 常配合if判断使用。

console.log()

将信息输入到控制台，用于js调试。

prompt()

弹出对话框，用于接收用户输入的信息。

document.write()

在页面输出消息 几乎不用

  • document.write不仅能输出信息，还能输出标签。

    • 转义字符 \

    • \” 转双引

    • \’ 转单引

    • \n 转换行

    • \r 转回车

js注释

  • 快捷键 ctrl+/

  • 单行注释 //

  • 多行注释 /* */ ctrl+Shift +/

变量

变量是用来存储数据的容器

变量类型

number

数字类型

  • var age = 20;

string

字符串类型

  • var name = '张三';

boolean

布尔类型

  • var sex1 = true ;

  • var sex1 = false ;

undefined

未定义类型,只声明变量未赋值,

  • var weight;

null

null就是null,只有当值为null的时候才为null

  • var exp = null;

判断数据类型

简单数据类型

  • var age = 30;

  • 输入console.log(typeof age); //控制台显示为number

复杂数据类型

  • var user = { ​ name: '张三', ​ age: 20, ​ sex: true ​ }

  • console.log(typeof user); // 显示为object(对象)

instanceof

判断某个对象是否为某个构造函数的实例对象

<pre spellcheck="false" class="md-fences md-end-block ty-contain-cm modeLoaded" lang="javascript" contenteditable="true" cid="n119" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit; color: rgb(51, 51, 51); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">//复杂数据类型 数组 Array
var ages = [33,20,555];
console.log(typeof ages); // object
console.log(user instanceof Array)// false
console.log(ages instanceof Array)// true</pre>

规范

不能以数字或者纯数字开头来定义变量名。

不推荐使用中文来定义变量名。

不能使用特殊符号或者特殊符号开头(_除外);

不推荐使用关键字和保留字来定义变量名。

在JS中严格区分大小写的！

避免使用的关键词

break do instanceof typeof
case else new var
catch finally return void
continue for switch while
debugger function this with
default if throw delete
in try

比较运算符

  • 小于 <

  • 大于 >

  • 小于等于 <=

  • 大于等于 >=

  • 比较运算 ==

  • 不等于 !=

  • 注意:

    • = 是赋值运算符

    • ==才是比较运算符

算数运算符

    • 号

    • 数字类型相加==> 数字求和

    • number类型+ string类型 ==> 拼接 string类型

    • string类型 直接拼接

    • 号

    • number-字符串number可以把stirng转换为number运算

    • console.log(3/0); // Infinity 无限大

    • console.log(3-'张三'); // NaN ; not a number 提示缩写

    • console.log(NaN == NaN); // false 面试:

      • NaN永远不等于NaN

  • / 除号

  • % 求余

    • 重要

  • 操作符

    • var a = 10; var b = a+20; console.log(b);输出30.

    • c = c + 1等同于 c += 1等同于 c++

github

全球最大的程序员交友网.

使用教程

  • 注册github

  • 创建库,不要自动生成readme文件,手动生成.

  • 安装git:

git操作:

进入创建的文件夹 xxx-learn-note, 右键==> git bash here ==> 黑窗口

<pre spellcheck="false" class="md-fences md-end-block ty-contain-cm modeLoaded" lang="shell" contenteditable="true" cid="n243" mdtype="fences" style="box-sizing: border-box; overflow: visible; font-family: var(--monospace); font-size: 0.9em; display: block; break-inside: avoid; text-align: left; white-space: normal; background-image: inherit; background-position: inherit; background-size: inherit; background-repeat: inherit; background-attachment: inherit; background-origin: inherit; background-clip: inherit; background-color: rgb(248, 248, 248); position: relative !important; border: 1px solid rgb(231, 234, 237); border-radius: 3px; padding: 8px 1em 6px; margin-bottom: 15px; margin-top: 15px; width: inherit; color: rgb(51, 51, 51); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;">输入以下代码:
git -init
在当前文件夹创建.git的隐藏文件夹.这里实际是初始化本地仓库.
git add .
添加当前文件夹现有文件,不包括空文件夹
git commit -m "第一次提交"
如果是第一次使用将会让添加邮箱和密码,按提示操作
git remote add origin git@github.com:Viarotel/fengxiaotian-learn-note.git
添加本地源,链接github服务器
git push -u origin master
将本地仓库信息推送到远程仓库
</pre>

常用git操作命令:

  • git status 查看工作区状态,红色说明有变动,绿色说明全部被提交到暂存区

  • git config –global user.email “you@example.com”（配置账号）

  • git config –global user.name “Your Name”（配置账号）

  • mkdir xxx （创建文件夹xxx）

  • cd xxx （切换到xxx目录）

  • git init(初始化 git 仓库)

  • git status(查看状态)

  • git add . (这里“.”代表全部添加到上传列表)

  • git commit -m ‘xxx.md’(提交,“”里面的内容是提交的信息)

  • git log（查看所有产生的 commit 记录）

  • git branch（查看本地分支）

  • git branch -r（查看远程分支列表）

  • git branch xx（创建分支xx）

  • git checkout xx（进入分支xx）

  • git checkout -b xx（新建一个分支，自动切换到该分支）

  • git merge xx（合并分支至当前分支）

  • git rebase xx（合并分支至当前分支）

  • git branch -d xx（删除分支）

  • git branch -D xx（强制删除分支）

  • git tag (查看标签)

  • git tag xx（新建标签）

  • git checkout xx（进入标签）

  • ssh-keygen -t rsa（指定 rsa 算法生成密钥，这里是在git-bash里面运行，用于生成链接git与电脑的密匙）

  • git push origin master（把本地代码推到远程 master 分支）

  • git pull origin master（把远程最新的代码更新到本地）

  • git clone git@github.com:name/xx.git（把xx项目 clone 到本地）

  • git remote add .origin. git@github.com:name/x.git(本地项目与远成仓库关联)

  • git remote -v（查看当前项目的远程库）

  • git config –global alias.xx .checkout.(设置命令别名）

  • git diff <id1><id1><id2> （比较两次提交之间的差异）

  • git diff .. （在两个分支之间比较）

  • git diff –staged （比较暂存区和版本库差异）

  • git stash（植入暂存区）

  • git stash list（查看暂存区记录）

  • git stash apply（植出暂存区）

  • git stash drop（删除暂存区最近一条记录）

  • git stash pop（apply加drop功能集合）

  • git stash clear（清空暂存区）

©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 194,457评论 5赞 459
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 81,837评论 2赞 371
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 141,696评论 0赞 319
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 52,183评论 1赞 263
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 61,057评论 4赞 355
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 46,105评论 1赞 272
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 36,520评论 3赞 381
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 35,211评论 0赞 253
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 39,482评论 1赞 290
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,574评论 2赞 309
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,353评论 1赞 326
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 32,213评论 3赞 312
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 37,576评论 3赞 298
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,897评论 0赞 17
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,174评论 1赞 250
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 41,489评论 2赞 341
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 40,683评论 2赞 335

推荐阅读更多精彩内容

  • 01.【JS基础】数据类型的判断方法
    1.typeof方法 此类方法适用于非object的类型判断，返回变量类型。 注意： i. typeof 可以判断...
    唐唐_sugar阅读 388评论 0赞 0
  • git命令整理
    git常用命令 GIT常用命令备忘:http://stormzhang.com/git/2014/01/27/gi...
    新篇章阅读 8,437评论 1赞 26
  • git 命令相关
    1，查看所有远程分支：%git branch -r 2, 拉取远程分支并创建本地分支git checkout -...
    will666阅读 2,039评论 0赞 18
  • git常用命令大全
    一、 Git 常用命令速查 git branch 查看本地所有分支 git status 查看当前状态 git c...
    LOVE_晴天阅读 2,317评论 0赞 10
  • Git从入门到熟练使用
    Git 命令行学习笔记 Git 基础 基本原理 客户端并不是只提取最新版本的文件快照，而是把代码仓库完整的镜像下来...
    sunnyghx阅读 3,897评论 0赞 11