Vue、react、 Angular、主流框架和服务器相关问题

• 1、 ng-app是什么？

        ng-app 指令用于告诉 AngularJS 应用当前这个元素是根元素。

        所有 AngularJS 应用都必须要要一个根元素。

        HTML 文档中只允许有一个 ng-app 指令，如果有多个 ng-app 指令，则只有第一个会被使用。

• 2、说说MVC和MVVM分别是什么？

        MVC全名是Model View Controller。是Controller模型(model)－视图(view)－控制器(controller)的缩写

        MVVM是Model-View-ViewModel的简写

• 3、−g是什么？

    在Node.js中-g表示全局安装模块

• 4、自定义指令的类型（E，A，C，M）？

        元素（E）、属性（A）、类（C）、注释（M）

• 5、$scope和自定义指令里的scope有啥区别？

        $scope 对象在 AngularJS 中充当数据模型的作用,也就是一般 MVC 框架中 Model 得角色.但又不完全与通常意义上的数据模型一样,因为 $scope 并不处理和操作数据,它只是建立了视图和 HTML 之间的桥梁,让视图和Controller 之间可以友好的通讯.
        自定义指令里的scope表示指令的作用域，它有三个可选值：true、false、对象{}

• 6、Ionic中的路由？

        Ionic也是基于Angular的，使用的是ui-router,

        ui-router的核心理念是将子视图集合抽象为一个状态机，导航意味着 状态的切换,Ionic之所以没有使用Angular官方的ngRoute,是回ngRoute缺少一些高级的特性，比如视图命名,视图嵌套。

• 7、filter？

        过滤器 对数组中的每一项运行给定函数，返回该函数会返回true 的项组成的数组。
        let even=array.filter(item=>{//获取数组中偶数

        return (item%2===0)

        })

• 8、ng-bind？

        ng-bind 指令告诉 AngularJS 使用给定的变量或表达式的值来替换 HTML 元素的内容。
        如果给定的变量或表达式修改了，指定替换的 HTML 元素也会修改。
         

• 9、说一说link？

        link中可以拿到scope和controller，可以与scope进行数据绑定，与其他指令进行通信。

• 10、为什么angular不推荐使用dom操作？

        Angular倡导以测试驱动开发，在的service或者controller中出现了DOM操作，那么也就意味着的测试是无法通过的
        使用Angular的其中一个好处是啥，那就是双向数据绑定，这样就能专注于处理业务逻辑，无需关系一堆堆的DOM操作。如果在Angular的代码中还到处充斥着各种DOM操作，那为什么不直接使用jquery去开发呢

• 11、看过Angular的源码吗，它是怎么实现双向数据绑定的？

        angular对常用的dom事件，xhr事件等做了封装， 在里面触发进入angular的digest流程。
        在digest流程里面， 会从rootscope开始遍历， 检查所有的watcher

• 12、讲讲promise和aSync await

    Promise:
        Promise是ES6 也就是js 2015中提出的新的Api 本质是为了解决JavaScript的回调地狱问题，相当于一个异步处理容器
        promise.then(res=>{})接收promise容器内部resolve状态返回的值作为参数在.then回调中接收，
        promise.catch(err=>{})接收的是promise容器内部reject状态返回的值作为参数在.catch回调当中接收
    async awiat:
        ES8 标准引入了 async 函数，使得异步操作变得更加方便。
        async 函数是什么？一句话，它就是 Generator 函数的语法糖。
        简而言之申明一个async 函数 内部用await将函数内部的异步操作顺序执行 ，
        不需要像generator一样生成一个iterator迭代器 在.next()的去手动的次序执行，
        而现async与语法糖已经帮你顺序执行完成了上述的操作。async对异步的封装就更加简洁明了

• 13、ui-router 和 ng-router区别？

        AngularJS的ng-route模块为控制器和视图提供了[Deep-Linking]URL
        ui-router的核心理念是将子视图集合抽象为一个状态机，导航意味着 状态的切换。

• 14、什么是指令？

        指令是指示计算机执行某种操作的命令,它由一串二进制数码组成。一条指令通常由两个部分组成:操作码+地址码。

• 15、service服务三种方式是什么？

        angularjs 中可通过三种（$provider,$factory,$service）方式自定义服务

• 16、gulp任务都是怎么定义，怎么执行的？

        通过 gulp.task方法定义任务,在项目中新建gulpfile.js文件，书写代码,如:

        var gulp = require(‘gulp’)

        gulp.tasks(

        ‘script’ // 任务名

        ,function(){

          // 在这里写任务需要执行的代码

        });

在命令输入gulp 任务,可以执行所在目录gulpfile.js文件中的任务。

• 17、Bootstrap中最多可以分多少列？lg、md、sm、xs这几个屏幕宽度的界限是多少？

        12列

        .col-xs- 超小屏幕手机 (<768px)
        .col-sm- 小屏幕平板 (≥768px)
        .col-md- 中等屏幕桌面显示器 (≥992px)
        .col-lg- 大屏幕大桌面显示器 (≥1200px)

• 18、angular中方法apply和digest区别？

        当数据出现没有经过angular但是发生改变的情况下，需要调用apply。Apply的范围比较广，只执行一次，但是digest针对某一元素执行多次。

• 20、ng-show/hide和ng-if的区别是什么？

         Show/hide是显示隐藏，if是是否存在某一部分

• 21、react虚拟DOM运行机制是什么？

        在React中，render执行的结果得到的并不是真正的DOM节点，结果仅仅是轻量级的JavaScript对象，我们称之为virtual DOM。虚拟dom

• 22、react中prop和state的区别？

        需要理解的是，props是一个父组件传递给子组件的数据流，这个数据流可以一直传递到子孙组件。而state代表的是一个组件内部自身的状态（可以是父组件、子孙组件）。

• 23、redux的原理？

        Redux 把一个应用程序中，所有应用模块之间需要共享访问的数据，都应该放在 State 对象中。这个应用模块可能是指 React Components，也可能是你自己访问 AJAX API 的代理模块，具体是什么并没有一定的限制。State 以 “树形” 的方式保存应用程序的不同部分的数据。这些数据可能来自于网络调用、本地数据库查询、甚至包括当前某个 UI 组件的临时执行状态（只要是需要被不同模块访问）

• 24、node常用模块？

        http、fs、path、url、Buffer、process

• 25、了解npm，spm，nodejs吗，请简要描述？

        NPM便于JavaScript开发者共享和重用代码，它可以很容易地更新你的代码；再分享。是全球最大的开源库生态系统。

        SPM是淘宝社区电商业务（xTao）为外部合作伙伴（外站）提供的一套跟踪引导成交效果数据的解决方案。

        Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。
        它使我们能够在本地运行javascript

• 26.请列举在内网的两台服务器中拷贝文件的方法？用Shell脚本解答数据库？

        将你要拷贝上传的文件使用tar -cf config.tar config/ 将congfig文件夹整个打包成tar 文件
        使用 scp config.tar wujiahao@47.98.21.341:/demo/
        #解读这句话  将打包好的config.tar 文件上传到用户为wujiahao公网ip为47.98.21.341下的demo文件夹下
        #主要就是scp命令的使用

• 27.请简述你了解的服务器配置例如Apache、NGINX

    Apache 设置虚拟主机 
    设置网站域名
    设置站点根目录
    设置根站点默认访问文件

• 28、请描述你所熟悉的Web服务器框架(如Django)作为一个成熟的Web框架，需要提供哪些重要的功能模块？

        提供了网站开发的常用模块：处理用户请求、操作数据库、模板渲染、配置文件管理等

• 29、服务器Node.js和浏览器js的区别是什么？Node.js把js从客户端迁移了到服务端、主要做了哪些工作？为什么说Node.js适合做高并发的互联网应用？

      Node采用一系列“非阻塞”库来支持事件循环的方式。本质上就是为文件系统、数据库之类的资源提供接口。
      Node.js 使用事件驱动，非阻塞I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。

• 30 、说说react和Vue常用的生命周期

     //react
     componentWillMount（初始化）
     componentDidUpdate(更新)
    componentWillUnmount(卸载)
    //Vue
    created（创建）
    mouted(挂载)
    updated(更新)

• 31、简述Vue和React前端配置，解决跨域的方法

//Vue
1、修改config/index.js里proxyTable
    proxyTable: {
      // 前端的请求代理转发    start
      '/': {
        target: 'http://127.0.0.1:9090',//设置你调用的接口域名和端口号 别忘了加http
        changeOrigin: true,
        pathRewrite: {
          '^/': '/'//这里理解成用‘/’代替target里面的地址，后面组件中我们掉接口时直接用api代替 比如我要调用'http://40.00.100.100:3002/user/add'，直接写‘/user/add’即可
        }
      }
      // 前端的请求代理转发    end
    },
2、修改config/dev.env.js

module.exports = merge(prodEnv, {
    NODE_ENV: '"development"',
    API: '"/"' // 加入这一句
})
//React 在package.json当中加入一条proxy 将请求通过webpack转发到你想要请求的地址
  "proxy": "http://localhost:9090"

• 32、vuex 和 react-redux分别实现多状态合并输出怎么做？

//Vue
1、更具功能创建多个store   
2、将多个store导入到一个modules当中
3、在用到相对应的值的时候这么取,比如取demo1state中的d1
import { mapState } from 'vuex'
 computed:mapState({
      d1: state =>state.demo1.d1
  })
如果要用这个值d1 和data当中的状态一样取即可
//react
//合并所有的reducer 并且返回
import {combineReducers } from 'redux'
import {user} from './redux/user.redux'//执行用户登陆的操作
import {chatuser} from './redux/chatuser.redux'//执行用户获取列表的操作
export default combineReducers({user,chatuser})